EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: glarsen on August 21, 2014, 01:34:15 PM



Title: DataGrid loader fires multiple times
Post by: glarsen on August 21, 2014, 01:34:15 PM
I've seen other topics like this which helped me narrow down the problem.

I have a need to dynamically change the DataGrid title and toolbar. This code will fire the loader:

  dg.datagrid({
    title: title,
    toolbar: toolbar
  });

When pagination is defined it also fires the loader:

        var pager = dg.datagrid('getPager');
        pager.pagination({
          displayMsg: '{from} to {to} of {total} items',
          layout:['list','first','prev','next','last']
        });

Is there a way to avoid this, am I doing something wrong?  The loader is defined like this:

          loader:function(param,success,error){
            $.ajax({
              type: 'POST',
              url: 'init-group-members?n_tab_id=' + $.urlParam('n_tab_id') + '&groupId=' + g.id,
              data: param,
              dataType: 'json',
              async: false,
              success: function(data){
                success(data);
              },
              error: function(){
                error.apply(this, arguments);
              },
              complete: function(jqXHR, textStatus) {
              }
            });
          }



Title: Re: DataGrid loader fires multiple times
Post by: stworthy on August 21, 2014, 06:56:16 PM
Calling '.datagrid({...}' will create datagrid component again, it will also make the request to server if the 'url' property is defined. In your case, you can call 'getPanel' method to get the panel object and call 'setTitle' method to change the title.
Code:
var p = $('#dg').datagrid('getPanel');
p.panel('setTitlte', title);
If you point the toolbar to a specific <div> element, just like this:
Code:
$('#dg').datagrid({
  toolbar: '#tb'
});
Thus, you can change the toolbar content easily, the code looks like this:
Code:
$('#tb').empty().append(...);

If you really want to re-create the datagrid again, please try this:
Code:
var url = dg.datagrid('options').url;
dg.datagrid({
  title: title,
  toolbar: toolbar,
  url: null
});
dg.datagrid('options').url = url;  // restore the 'url' again


Title: Re: DataGrid loader fires multiple times
Post by: glarsen on August 22, 2014, 10:29:47 AM
Thanks for the explanation.  Making progress but can't figure out why toolbar icons are not showing:

<div id="toolbarxOkJJIE1hcmtldGluZyBFdmVyeW9uZQ__" class="datagrid-toolbar">
<a onclick="javascript:groupSort(&quot;xOkJJIE1hcmtldGluZyBFdmVyeW9uZQ__&quot;)" plain="true" iconcls="icon-save" class="easyui-linkbutton" href="#">Default</a>
</div>

Pasted the <a> in an EasyUI demo and it worked.   The toolbar icon worked using iconCls: 'icon-sort' property.

Thanks for any suggestions,
Gary


Title: Re: DataGrid loader fires multiple times
Post by: stworthy on August 22, 2014, 04:03:23 PM
Call $.parser.parse function to parse the toolbar.
Code:
$.parser.parse('div.datagrid-toolbar');


Title: Re: DataGrid loader fires multiple times
Post by: glarsen on August 25, 2014, 09:47:35 AM
Bingo!  Thanks for you help.