I have done more investigation and I found that the HTML element for children is created in the table but display css property is set to none.

I have done a temporary workaround to put in gridComplete event, please let me know if it is corrected a day.

$(".treeclick","#datagrid_produitsservices").each(function() {

if($(this).hasClass("tree-minus")) {

var rowid = $(this).parentsUntil('tr').parent().attr('id');

var childrens = $("#datagrid_produitsservices td[aria-describedby=datagrid_produitsservices_parent][title="+rowid+"]").parent();

$(childrens).css('display', '');

}

});

I'm having problem expending rows in my datagrid. When the datagrid is loaded with initial data everything is working fine. All categories are listed (as root, no parent_id). If I click on the expand symbol in the row, sub rows are loaded and displayed.

However, if I do a search (this example is working with the filter toolbar but on another page, I have the same exact grid except using the search box), the AJAX request is done and completed. The problem is that rows are not displayed. The expand symbol is transforming into Collapse symbol but sub rows are not shown. If I click on Collapse button and again on the Expand button, this node is working and will work until they end.  It must be done for all nodes.

jQGrid version tested: 1.7.2, 1.8.2

jQuery version: 1.4.2

jQuery UI version: 1.8.1

Model: Adjency

Datatype: JSON

Autoloading used: true

Here is my grid definition:

$("#datagrid_produitsservices").jqGrid({

datatype: "json",

mtype:'post',

url: 'jx.php?module=product&func=get_datagrid',

postData: {enabled: 'true', pos: 'true'},

height: tmp_height,

treeGrid: true,

treeGridModel: 'adjacency',

ExpandColumn : 'title',

colNames:[

'#',

'Produit/Service',

'CUP',

'Actif'

],

colModel:[

{name:'id',index:'id', width:80, hidden:true, sorttype:'int'},

{name:'title',index:'title', width:248, sortable:false,sorttype:'text', search: true, searchoptions:{sopt:['aa']}},

{name:'cup',index:'cup', width:100, hidden:true},

{name:'enabled',index:'enabled', width:60, hidden: true}

],

sortname: 'title',

sortorder: "asc",

caption: "",

viewrecords: true,

autowidth: true,

shrinkToFit: true,

scrollOffset: 0,

rowNum:0,

gridComplete : function() {

$("#datagrid_produitsservices td[role='gridcell'][title='0,00']").html('');

$("#datagrid_produitsservices").parent().parent(".ui-jqgrid-bdiv").css('overflow-x', 'hidden');

}

}).filterToolbar({searchOnEnter:false});

Here are example of data received initially:

{"rows":[{"id":"102","cell":["102","Accessoires chevaux","","Oui","0","NULL","false","false"]},{"id":"99″,"cell":["99","Accessoires oiseaux","","Oui","0","NULL","false","false"]}, …lot_of_data…],"page":"1″,"total":"1″,"records":"2382″}

Here are example of data received after searching "chat":

{"rows":[{"id":"96","cell":["96","Arbres u00e0 chat","","Oui","0","NULL","false","false"]},{"id":"88″,"cell":["88","Biscuits","","Oui","0","NULL","false","false"]}, …lot_of_data…],"page":"1″,"total":"1″,"records":"143″}

Thanks,

Antoine