How to bind grid and combo?

Hello,
I have the next problem. I red many pages from your forum and documentation and saw example on http://docs.dhtmlx.com/doku.php?id=dhtmlxdatastore:datastore_example_server-side but don’t understand how i can bind grid and combo.
I have php file where i describe datastore by string

...
$mydata = new GridConnector($conn,"MsSQL");
$mydata->render_sql("Select A.name, B.* from A, B where A.id=B.id", "B.id","col1, col2, col3, col4");
...

And in html file i want to bind grid and combo

...
<div id="gridbox" ></div>
<script>
var data_store = new dhtmlXDataStore({  
		url:"myphp.php"
	});
mygrid = new dhtmlXGridObject('gridbox');
mygrid.init();
myGrid.sync(data_store);
...
</script>

How i can describe in javascript or in php that “B.id” is parent column and grid must filled by myphp.php only from table B? How i can insert and configure combo in code to select at first parent id “A.id” from table A in combo and then my grid will filled subsequently?
Thanks.

Hello,

How i can insert and configure combo in code to select at first parent id “A.id” from table A in combo and then my grid will filled subsequently?

Combo should have separate datasource in this case. As the mentioned query returns records with non-unique combo options (the same parent from A table may be in several records from B table).

How i can describe in javascript or in php that “B.id” is parent column and grid must filled by myphp.php only from table B?

You may hide the “parent” column in grid.

there could be two ways:

  1. load combo and grid from different datasources and process the option change in combo manually:

    ... combo.loadXML(url1); .... grid.loadXML(url2); combo.attachEvent("onChange",function(){ var value = this.getActualValue(); grid.clearAll(); grid.loadXML(url2+"?combo="+value); });

  2. load combo and grid from different datasources and use bind method. In this case the grid column with parent name should be hidden.

... combo.loadXML(url1); ... grid.loadXML(url2); grid.bind(combo, function(data, filter){ return grid.cells(data, 0).getValue() == filter.text; });

Alexandra, thanks for reply.
Please explain me how grid in your code understand that loadXML(url2+"?combo="+value) bind with id in table B? Must i do some desription in myphp.php file on in somewhere else?

Thanks

Hello,
I try to use for grid and combo render_table where i have id in column list (for grid) and use the code grid.loadXML(“myphp_grid.php?id=”+32) for test but my grid don’t respond on this modification in url. What am i do wrong?

I find resolve in one topic from forum about forming-up query. Thanks.

I have problem when i try to update my table. In php file i use render_sql method

$table->render_sql("Select id, idCol, col1, col2, col3 from Table1 where idCol = '$idFromCombo'", "id","idCol, col1, col2, col3");

In html file i have

<div id="combo" height="50px" style="background-color:white;overflow:hidden"></div>
<div id="gridbox" height="550px" style="background-color:white;overflow:hidden"></div>
	
<script>
	mygrid = new dhtmlXGridObject('gridbox');
	mygrid.setHeader("idCol, col1, col2, col3");
	mygrid.setColTypes("ed,ed,ch,ed");
	mygrid.setColSorting("server, server, server, server");
	mygrid.attachEvent("onKeyPress", onKeyPressed);
	mygrid.init();
	mygrid.enableMultiselect(true);
	mygrid.enableBlockSelection(true);
	mygrid.setCSVDelimiter("\t");

	var dp = new dataProcessor("mygrid_php.php");
	dp.setUpdateMode("off");
	dp.setTransactionMode("POST", true);
	dp.init(mygrid);
	
	mycombo = new dhtmlXCombo("combo", "combo_name", '200px');
	mycombo.loadXML("mycombo_php.php");
	
	mycombo.attachEvent("onChange",function(){
        var value = this.getActualValue();
        mygrid.clearAll();
        mygrid.loadXML("mygrid_php.php?idFromCombo="+value);
    });
 </script>
 <div><a href="#" onClick="dp.sendData();">Sync with DB</a></div> 

New values don’t saves in the table on server. Help me to resolve this.

Try to enable server side logs and if issue still occurs - please provide the content of the log for the problematic operation.

docs.dhtmlx.com/doku.php?id=dhtm … nd_logging


====================================
Log started, 02/09/2011 11:09:55
====================================

SELECT   id, idCol, col1, col2, col3 FROM Table1 WHERE ( idCol = '355')

Done in 0,0032031536102295s



====================================
Log started, 02/09/2011 11:09:16
====================================

Undefined variable: idFromCombo at D:\apache\localhost\www\mygrid_php.php line 48

DataProcessor object initialized
193_gr_id => 193
193_c0 => 355
193_c1 => 13
193_c2 => 4126431C1
193_c3 => 0
193_!nativeeditor_status => updated
ids => 193

Row data [193]
id=> 193
idCol=> 355
col1=> 13
col2=> 4126431C1
col3=> 0
!nativeeditor_status => updated

UPDATE Table1 SET idCol='355',col1='13',col2='4126431C1',col3='0' WHERE id='193' AND (( idCol = ''))

Edit operation finished
0 => action:updated; sid:193; tid:193;

Done in 0,0043659210205078s

I find that in update query idCol parametr is empty. And why is idFromCombo undefined when i translate it in code ?


   mycombo.attachEvent("onChange",function(){
        var value = this.getActualValue();
        mygrid.clearAll();
        mygrid.loadXML("mygrid_php.php?idFromCombo="+value);
    });

Change the line
mygrid.loadXML(“mygrid_php.php?idFromCombo=”+value);
as
dp.serverProcessor = “mygrid_php.php?idFromCombo=”+value;
mygrid.loadXML(“mygrid_php.php?idFromCombo=”+value);

it will not only reload the data in grid, but will change the feed for dataprocessor saving as well.

Thanks. It’s well.

hum…