set url combogrid in datagrid editor by selected other combogrid or filter data

[shivavalkyre]

hello all,

i have some problem with filter data combogrid as editor in datagrid, for schema i have 2 combogrid one as main, this combo used as filter data for other combogrid in side datagrid as editor. i have try some solution but still not work this is my code :

Code:

<select id="customer" class="easyui-combogrid" style="width:250px" data-options="
            panelWidth: 500,
            idField: 'customerid',
            textField: 'customername',
            url: './control/get_customer.php',
            columns: [[
                {field:'customername',title:'Customer',width:120},
            ]],
			onSelect:getValue,
            fitColumns: true
        ">
    </select>

 <table id="dg2"  title="" style="width:790px;height:250px"
toolbar="#toolbar" data-options="singleSelect:true,pageList:[100],pageSize:100" pagination="false" idField="trandetailid"
rownumbers="true" fitColumns="true" >
<thead>
<tr>
<th field="customerid" width="20" editor="{type:'combogrid',options:{required:true,panelWidth:580,idField:'btno',textField:'btno',mode:'remote',url:'./control/list_product.php',columns: [[
{field:'btno',title:'Product No',width:100},
{field:'productdescription',title:'Product Description',width:350},
{field:'harga',title:'Unit Price',width:80,formatter:formatPrice},
]],	onSelect: onSelectGrid,
	onShowPanel: onShowPanel,
	onHidePanel: onHidePanel,}}">Product No</th>
<th field="productdescription" width="50" editor="{type:'text',options:{required:true}}">Product Description</th>
<th field="qty"   width="30" editor="{type:'numberbox',options:{required:true,precision:0,onChange:onChangeCell}}">Quantity</th>
<th field="unit_price"  width="20" formatter="formatPrice" editor="{type:'numberbox',options:{required:true,precision:0,onChange:onChangeCell}}">Unit Price</th>
<th field="subtotal"   width="40" formatter="formatPrice" editor="{type:'numberbox',options:{required:true,precision:0,onChange:onChangeCell}}">Sub Total</th>
</tr>
</thead>
</table>

Thanks for help

Best Regards

Shiva

[stworthy]

You can bind the 'onBeforeLoad' event to change the 'url' property before requesting data from remote server.

Code:

options:{
	columns:[[...]],
	url:...,
	onBeforeLoad:function(param){
		var opts = $(this).datagrid('options');
		opts.url = ...
	}
}

[shivavalkyre]

Hi,
thank you for solution,
i have try your sugestion but it still not work for me  

Code:

 <table id="dg2"  title="" style="width:790px;height:250px"
toolbar="#toolbar" data-options="singleSelect:true,pageList:[100],pageSize:100" pagination="false" idField="trandetailid"
rownumbers="true" fitColumns="true" >
<thead>
<tr>
<th field="btno" width="20" editor="{type:'combogrid',options:{required:true,panelWidth:580,idField:'btno',textField:'btno',mode:'remote',columns: [[
{field:'btno',title:'Product No',width:100},
{field:'productdescription',title:'Product Description',width:350},
{field:'harga',title:'Unit Price',width:80,formatter:formatPrice},
]],url:'./control/list_product.php',
	onBeforeLoad:onBeforeLoad,
	onSelect: onSelectGrid,
	onShowPanel: onShowPanel,
	onHidePanel: onHidePanel,}}">Product No</th>
<th field="productdescription" width="50" editor="{type:'text',options:{required:true}}">Product Description</th>
<th field="qty"   width="30" editor="{type:'numberbox',options:{required:true,precision:0,onChange:onChangeCell}}">Quantity</th>
<th field="unit_price"  width="20" formatter="formatPrice" editor="{type:'numberbox',options:{required:true,precision:0,onChange:onChangeCell}}">Unit Price</th>
<th field="subtotal"   width="40" formatter="formatPrice" editor="{type:'numberbox',options:{required:true,precision:0,onChange:onChangeCell}}">Sub Total</th>
</tr>
</thead>
</table>
<script>
		function getValue(){
       valurl = $('#customer').combogrid('getValue');
          
  }
 
			function getRowIndex(target) {
				var tr = $(target).closest('tr.datagrid-row');
				return parseInt(tr.attr('datagrid-row-index'));
			}
			var cbg=null;
			var tb=null;
			function onSelectGrid(index,record) {
				if(cbg) {
					var cb = cbg;
					var opts =cb.combogrid('options');
					var grid = cb.combogrid('grid');
					var row= grid.datagrid('getSelected');
			//		alert (row.material_name);
					var dg2 = $('#dg2');
					var index = dg2.datagrid('getRowIndex', dg2.datagrid('getSelected'));
			//		var index = $('#dg2').datagrid('getSelected');
					//alert (index);


					var editors = dg2.datagrid('getEditors', index);
					//var vl= $(editors[0].target).combogrid('getValue');
					//alert (vl);
					$(editors[1].target).val(row.productdescription);
					//$(editors[2].target).val(row.Unit);
					$(editors[3].target).val(row.harga);


				}
			}

			
			function onBeforeLoad(param){
			
			var opts = $(this).datagrid('options');
			opts.url ="./control/list_product.php?customerid="+valurl;
			alert (opts.url);
			}
			
			function onShowPanel() {
				cbg = $(this);
			
			}
			function onHidePanel() {
				cbg = null;
			}

</script>

Best Regards

Shiva

[stworthy]

You must confirm if the 'valurl' value is correct. Is the 'opts.url' value correct? Please open your browser's developer tool and switch to network tab to see what request parameter has been sent to server.

[shivavalkyre]

 my directly test to page is successfully here my code:

Code:

<?php  
    include 'koneksiMysql.php';

    $page = isset($_POST['page']) ? intval($_POST['page']) : 1;
    $rows = isset($_POST['rows']) ? intval($_POST['rows']) : 100;
    $offset = ($page-1)*$rows;
	$q = isset($_POST['q']) ? strval($_POST['q']) : '';
	$customerid = isset($_GET['customerid']) ? strval($_GET['customerid']) : '';
	
	$rs = mysql_query("SELECT `customer`.`customerid`, `customer`.`customername`,`productmaindata`.`btno`,`productmaindata`.`productdescription`,`productprice detail`.`harga` FROM `productmaindata` INNER JOIN `productprice detail` ON `productprice detail`.`productid` = `productmaindata`.`productid` INNER JOIN `productprice` ON `productprice`.`id` = `productprice detail`.`productpriceid` INNER JOIN `customer` ON `customer`.`customerid` = `productprice`.`custid` WHERE customerid='$customerid' order by `productmaindata`.`btno` ASC;");


    $items = array();
    while($row = mysql_fetch_object($rs)){
    array_push($items, $row);
    }
    $result["rows"] = $items;
     
    echo json_encode($result);

	//echo ($customerid);

?>

please see attachment for result
Best Regards

Shiva

[shivavalkyre]

Hi,
Thanks your previous code is work perfectly after i refresh or restart my xampp.

Best Regards

Shiva

[shivavalkyre]

hi,
thanks for your sugesstion code, but i still have little bit question about it, if i need use onBeforeLoad event to Fires before a request is made to load data for combogrid editor,how about combogrid editor in datagrid is load but i click again  my 1st combogrid to  filter combogrid editor in datagrid where it still open. what event i must use? onLoadSuccess or other event?


Best Regards

Shiva