Display remote combobox item in edatagrid loaded

[finzaiko]

I tried from example edatagrid12 load combobox item from remote server and read this topic http://www.jeasyui.com/forum/index.php?topic=1896.0
I want to display the name of the supplier and not ID of supplier when edatagrid loaded,
 

Code:

$('#inv').edatagrid({
            url: 'index.php?r=invoice/getData',
            saveUrl: 'index.php?r=invoice/create',
            updateUrl: 'index.php?r=invoice/update',
            destroyUrl: 'index.php?r=invoice/delete',
            onClickRow: function() {
                invid = $('#inv').datagrid('getSelected');
                if (invid) {
                    console.log(invid.id);
                    doViewDetail(invid.id);
                }
            },
        });

      

display combo in edatagrid :

Code:

<th data-options="field:'supplier_id',width:50,  
	formatter:function(value, row){
		if (row.id == value) return row.suppl_name;
    },
    editor:{
	type:'combobox',
        options:{  
            url: 'index.php?r=supplier/getData',
            method:'get',
            valueField:'id',
            textField:'suppl_name',
            panelHeight:'auto'
		}  
    }">supplier</th>

data in combobox not display when grid loaded, but when i click/edited the combobox data work.

Can anyone help?
Thanks a lot in advance.

[stworthy]

Please refer to this example http://jsfiddle.net/dGd5E/.

[finzaiko]

Thanks stworthy, I try your snippet code worked for me and I found another way load json into variable

Code:

function getJson(url) {
        return JSON.parse($.ajax({
         type: 'GET',
         url: url,
         dataType: 'json',
         global: false,
         async:false,
         success: function(data) {
             return data;
         }
     }).responseText);
    }

var suppliers = getJson('index.php?r=supplier/getData');

 var peditor2 = {
        type: 'combobox',
        options: {
            valueField: 'id',
            textField: 'suppl_name',
            data: products,
            required: true
        }
    };

column display :

Code:

<th data-options="field:'supplier_id',width:50,  
                                formatter:function(value, row){
                                    for(var i=0; i<products.length; i++){
                                        if (products[i].id == value) return products[i].suppl_name;
                                    }
                                },
                                editor:peditor2">supplier</th>

Thanks for great support