dependent combobox in datagrid easyui

Question

I have combobox dependent in datagrid using easyui but not working

},{
  field: "family", 
  title: "Family", 
  align: "center",
  width: 150, 
  editor: {
    type: "combobox",
    options: {
      valueField :"family_id",
      textField :"family",
      url:'<?php echo site_url(); ?>/ref_json/DataFamily',
      onSelect: function(rec){ 
        var url = '<?php echo site_url(); ?>/ref_json/DataMaterial1/'+rec.family_id; 
        var ed = $('dgUpholdstery').datagrid('getEditors',{index:1,field:'material'});
        $(ed.target).combobox('reload',url);
      },
      filter: function(q,row){
        return row.family.toLowerCase().indexOf(q.toLowerCase())==0;
      }
    }
  }
},{
  field: "material", 
  title: "Name", 
  align: "center",
  width: 270, 
  editor: {
    type: "combobox",
    options: {
      valueField:"kode_barang",
      textField:"nama_barang",
      url:'<?php echo site_url(); ?>/ref_json/DataMaterial1'
    }
  }
},{

I have tested with many other variation but nothing happens. please help me. I'm stack with this. Thank you for your help.

Answer 1

I just fix this issue with this code

....
onSelect: function(rows){ 
    var url = '<?php echo site_url(); ?>/ref_json/DataMaterial1/'+rows.family_id; 
    var tr = $(this).closest('tr.datagrid-row');
    var idx = parseInt(tr.attr('datagrid-row-index'));
    var ed = $("#dgUpholdstery").datagrid("getEditor", {index:idx, field:'kode_barang'});       
    $(ed.target).combobox("reload", url);
}
....