Datagrid send three http request to fetch data from server

[mattjiang]

Hi all my script is simple like below:
_{$('#moviesList').datagrid({ 
              url:'fetchAllMovies', 
              pagination: true,
              columns:[[ 
                  {field:'movieName', title:'Movie Name', width:150}, 
                  {field:'year', title:'Release Year', width:30, align:'right', sortable:true}, 
                  {field:'director', title:'Director', width:100, sortable:true,
                     formatter:function(value, rowData, rowIndex) {
                        if (value != null)
                          return value.name;
                        else
                           return "";
                  }
                  }, 
                 {field:'id', title:'Action', width:70, align:'center', 
                   formatter:function(value, row, rowIndex) { 
                  
                      var linkEdit = '<a href="#" onclick="goEditMovie(' + value + ')">EDIT</a>'; 
                    return linkEdit; 
                   } 
                 } 
              ]] 
          });}

Below is HTML code
<table title="Movie List" class="easyui-datagrid" id="moviesList" style="width:350px;" border="1" cellspacing="1"></table>

the point is whenever I added "pagination" attribute, datagrid will send three request to server for the target URL.
you can easily see it using Chrome or Firebug.

How do I prevent this problem?
thanks a lot.

[stworthy]

Please remove the 'class'(easyui-datagrid) attribute from the <table> markup.

[mattjiang]

Thanks stworthy,

I removed the css class. But there are still two duplicated requests occurred.
I found this is because "pagination: true" added.
so datagrid() method will fire one ajax request, but if "pagination: true" added as parameter, it will cause data grid send two duplicated request.

I think this behavior is not correct. Is there any way to prevent duplicated http request occurred?

[stworthy]

Please refer to this example http://www.jeasyui.com/tutorial/datagrid/datagrid2_demo.html. It send only one request to server.

[mattjiang]

Yes, This example does send only one request to the target URL, I tried before.
but it did not use the same definition method as mine.
It define grid using HTML tag attributes, but I use pure JavaScript.
I think using JavaScript to define grid property and behavior is better in my case.
So if possible, could you help investigate why it send two duplicate AJAX request to the target URL?
(It seems that I can't get source, so I can't investigate it by myself)
Thanks a lot.

[stworthy]

Hi mattjiang,

Using javascript to create datagrid is same as defining datagrid in <table> markup. Here is the example that using javascript to create the pagination datagrid.
http://www.jeasyui.com/tutorial/datagrid/datagrid2_demo1.html

Using the firebug and you will see it send only one request.

[mattjiang]

Hi stworthy,
Thank you so much, I update EasyUI to latest 1.3 version, then the problem does not occur again.
I didn't change anything of my script, so I think this problem only exists in older version.
thank you for your patience.