I am trying to bind data to a form from a grid and nothing happens (grid is working fine)

this is the code:

var base_layout = new dhtmlXLayoutObject(document.body, ‘4I’);
var cellInfo = ‘a’;
var cellHotel = ‘b’;
var cellForm = ‘c’;
var cellTab = ‘d’;

base_layout.cells(cellForm).setText(‘Hotel Information’);
base_layout.cells(cellTab).setText(‘Room Information’);

var defcombo = {
parent: “listEvent”,
label: “select event”,
width: 200,
readonly: true

var cmbEvent = new dhtmlXCombo(defcombo);
cmbEvent.attachEvent(“onSelectionChange”, onSelectionChangeFunc);

cmbEvent.attachEvent(“onXLE”, onComboLoaded);
function onComboLoaded() {
cmbEvent.selectOption(0, false, true);
document.getElementById(‘comboEvent’).style.display = “block”;


function onSelectionChangeFunc() {
if (cmbEvent.getSelectedValue() == ‘’) { return; }
// grid.clearAll();
// grid.loadXML(“handler/GetEventHotelList.ashx?eventid=” + cmbEvent.getSelectedValue());


var str = [
{ type: “input”, name: “NAME”, label: “Name”, validate: “NotEmpty”, maxLength: 100, inputWidth: 100 },
{ type: “input”, name: “NICKNAME”, label: “Nickname”, maxLength: 100, validate: “NotEmpty”, inputWidth: 100 }
var formhotel = base_layout.cells(cellForm).attachForm(str);

var grid = base_layout.cells(cellHotel).attachGrid();

grid.selMultiRows = false;
grid.dragAndDrop = “false”;


I made a mistake when I send the sample code
the lines
// grid.clearAll();
// grid.loadXML(“handler/GetEventHotelList.ashx?eventid=” + cmbEvent.getSelectedValue());
should be uncommented

Unfortunately we cannot reproduce this issue locally. Can you please provide complete demo where we can reproduce it? You can find tutorial how to create complete demo here … leted_demo

Also, try to follow this tutorial … htmlxstart

Attached is a demo. Try to select something in the combo (it always return the same grid). The form is bind to the grid but it is not working (509 KB)

If you want to bind form and grid, you should use data store. Please check tutorial here

I made it work finally.

I have a question. I use the form to edit the fields, so I select an item of the grid, it automatically fills the fields in the form. Thats works fine.

Now when I press the button cancel in the form, I want to reset the values in the form with the values of the item selected in the grid. I did not find a way of doing this but manually clicking in other item and then clicking again in the first item.

Is there a way to refresh the fields bind in the form? (I tried selecting the row already selected but i didn’t work)

Just in case I tried form.reset but it resets the values to the original ones assigned to the inputs (in this case blank)

for the record, I also tried grid.setCursor(idRow) it didnt work

Before you ask, here you have a demo :slight_smile:

1.Select an event
2.Select a row in the grid
3.Click on edit
4.Change the name in the form
5.Click on cancel

I want to reset the values of the form with the current values of the row selected, grid.setcursos is not working

please help

demo (522 KB)


Correct, reset() works together with load(), but you’re using DataStore.

So, you can try to add event for “cancel” button and call:

By the way: form have lock() and unlock() methods (maybe will useful).

did you try lock and unlock? because they do not work with a form binded to a grid (they should but it seems that the form unlocks automatically when I select an item in the grid)