Event or Method after Rows are populated

[aravindtrueMember]

Hi,

I need a clarification. Is there any event or method in grid control, which should trigger after populating all the rows inside the grid.

I tried,

ready – is triggered once the grid is initialized.
rendered – is triggered once it is rendered.
Initialized – is triggered once the grid is initialized.

But i need the trigger only after all the rows in the grid are populated.

Is there a way?

Regards,
Aravind

[Peter StoevKeymaster]

Hi Aravind,

bindingcomplete event is triggered when the binding operation is completed and rows are loaded.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[aravindtrueMember]

$(document).ready(function () {
var theme = getTheme();
$(“#jqxgrid”).jqxGrid(
{
width: 670,
theme: theme,
filterable: true,
sortable: true,
autoshowfiltericon: true,
});

var addfilter = function () {
var filtergroup = new $.jqx.filter();

var filter_or_operator = 1;
var filtervalue = ‘Beate’;
var filtercondition = ‘contains’;
var filter1 = filtergroup.createfilter(‘stringfilter’, filtervalue, filtercondition);

filtervalue = ‘Andrew’;
filtercondition = ‘starts_with’;
var filter2 = filtergroup.createfilter(‘stringfilter’, filtervalue, filtercondition);

filtergroup.addfilter(filter_or_operator, filter1);
filtergroup.addfilter(filter_or_operator, filter2);
// add the filters.
$(“#jqxgrid”).jqxGrid(‘addfilter’, ‘firstname’, filtergroup);
// apply the filters.
$(“#jqxgrid”).jqxGrid(‘applyfilters’);
}

$(“#generate”).click(function(event){
var data = generatedata(500);
var source =
{
localdata: data,
datatype: “array”
};
$(“#jqxgrid”).jqxGrid(
{
width: 670,
source: source,
theme: theme,
filterable: true,
sortable: true,
ready: function () {
addfilter();
},
autoshowfiltericon: true,
columns: [
{ text: ‘First Name’, datafield: ‘firstname’, width: 90 },
{ text: ‘Last Name’, datafield: ‘lastname’, width: 90 },
{ text: ‘Product’, datafield: ‘productname’, width: 170 },
{ text: ‘Order Date’, datafield: ‘date’, width: 160, cellsformat: ‘dd-MMMM-yyyy’ },
{ text: ‘Quantity’, datafield: ‘quantity’, width: 80, cellsalign: ‘right’ },
{ text: ‘Unit Price’, datafield: ‘price’, cellsalign: ‘right’, cellsformat: ‘c2’ }
]
});
});
});

Please look at the above example. I want to apply filter after the row is populated.

Regards,
Aravind

[Peter StoevKeymaster]

Hi Aravind,

What’s the issue with the code? The filter is applied in the ready callback i.e after the Grid is loaded.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[aravindtrueMember]

Sorry for the in inconvenience. I didn’t paste the HTML. In that example,

On page load, I am just building the grid. I have a button called “Generate” and when I click that, I am pushing the source, columns and on ready, I am trying to apply the filter where it is not working.

Regards,
Aravind

[aravindtrueMember]

<div id="jqxWidget" style="font-size: 13px; font-family: Verdana; float: left;">
<div id="jqxgrid"></div>
<input type="button" id="generate" value="Generate" />
</div>

[Peter StoevKeymaster]

Hi Aravind,

Ok, as you with to refresh the Grid’s source dynamically and apply a filter after that, bind to the Grid’s bindingcomplete event and add the filter in the event handler.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[aravindtrueMember]

Thanks, Its working great… 🙂

[Author]

Posts