Kendo Grid selected row grid to form control

[Saran]

Hi,

I am trying to load a html form just below the kendo grid for edit from the selected Kendo Grid row. I am able to get the selected grid row using events and dataitem. ( var dataItem = this.dataItem($(e.currentTarget).closest("tr"));)

How do we bind it to the editable html form? Do we have any functionality like gridtoform? Is there any demo related to this?

[Daniel]

Hi,

You could use the MVVM functionality to bind the item to the form inputs e.g.

<form action="/" method="post" id="myForm">
    <input type="text"  data-bind="value: selectedItem.MyField"/>
</form>

var viewModel = kendo.observable({
    selectedItem: null
});
kendo.bind($("#myForm"), viewModel);
function customCommand(e) {
    e.preventDefault();
    var row = $(e.currentTarget).closest("tr");
    var dataItem = this.dataItem(row);
    viewModel.set("selectedItem", dataItem);

}

Regards,
Daniel
the Telerik team

[Saran]

Hi Daniel,

Thanks for the reply. I was able to bind the grid row data item to the form.

Thanks,
Saran