EasyUI Forum

Hi all,

I hope someone can help :)

I am using a datagrid with an inline editor, and a number of my columns use the "URL" option to load data dynamically from the server. What I would like to do is pass the current value in that column back with the URL so that I can do some processing with it.

EG:

    $('#tt').datagrid({ 
        title:'Editable DataGrid', 
        singleSelect:true, 
        idField:'itemid', 
        url:'get_grid_data.php', 
        columns:[[ 
            {field:'itemid',title:'Item ID',width:60}, 
            {field:'productid',title:'Product',width:100, 
                editor:{ 
                    type:'combobox', 
                    options:{ 
                        valueField:'productid', 
                        textField:'name', 
                        url: 'get_product_list.php?current_product_id='+row.productid,
                        required:true 
                    } 
                } 
            }, 
        ]], 
        ...
    }); 
}); 

The above code is incomplete I know, it is just an example, with the line in red indicating what I am trying to accomplish. The server can receive the value as a GET or a POST, it doesnt matter, as long as I can find some way to pass the value...

Any assistance would be much appreciated :)

You need to get the editing row data before passing the row parameter to server. Here is the solution shows how to do this:

Hi stworthy,

Thanks for the assistance, I got it working.

A note for anyone else trying to do this:

After some trouble I found that the onBeforeLoad is firing AFTER the combobox control has been created (obvious in hindsight), so when you try to get a handle on the row being edited, give the selector a context to work in, to ensure you get the right control back.

I made my selection even more specific, working on the "datagrid-row-editing" class that gets added to the row when editing is enabled.

onBeforeLoad:function(param){
    var container_div = $("#container_div_id"); // div containing datagrid
    var tr = container_div.find(".datagrid-row-editing"); // find the row being edited
    var index = parseInt(tr.attr("datagrid-row-index"));  // get the row index
    var row = $("#gridEditAssets").datagrid("getRows")[index];  // get the row data
    alert(row.field_name);
}

Hi again stworthy and all,

The onBeforeLoad discussed above works fine for a combobox, but I am not able to set the param values when using a combotree - the onBeforeLoad param is null:

{field:'productid',title:'Product',width:100, 
   editor:{ 
      type:'combotree', 
      options:{ 
         valueField:'productid', 
         textField:'name', 
         url: 'get_product_list.php',
         required:true,
         onBeforeLoad:function(param){
                            var container_div = $("#container_div_id"); // div containing datagrid
                            var tr = container_div.find(".datagrid-row-editing"); // find the row being edited
                            var index = parseInt(tr.attr("datagrid-row-index"));  // get the row index
                            var row = $("#gridEditAssets").datagrid("getRows")[index];  // get the row data
                            param.current_product_id = row.productid
         }
      } 
   } 
}, 

Console log message:

Uncaught TypeError: Cannot set property 'current_location_id' of null

I even tried setting:

"mode": "remote",
"queryParams": {
    current_location_id: "0"
},

Which makes no difference...

Any ideas?

Just to put an answer up, I did not see that combotree inherits from combo and tree, and not from combobx, so the onBeforeLoad() for tree accepts 2 paramaters, which is why I was having trouble:

onBeforeLoad:function(node, param){
...


Thanks for the awesome UI stworthy