Hi
I am working on igHierarchicalGrid. I am able to update the child table as you can see in attached pic .
Note : As I am using angular2 please let me know can we achieve in this. It will be very helpful for me.
Thanks
Ankur Shah
Hello Ankur,
- To remove Done and Cancel buttons set the [showDoneCancelButtons](http://igniteui.com/help/api/2016.1/ui.iggridupdating#options:rowEditDialogOptions.showDoneCancelButtons) option to false
Example:
features: [{ name: "Updating", showDoneCancelButtons: false, editMode: "cell", columnSettings: [ { columnKey: "Title", editorOptions: { validation: true, validatorOptions: { onblur: true, custom: { method: function(value) { if (value === "CEO") { return false; } return true; }, errorMessage: "You cannot enter CEO title" } } } } ] }]
features: [{
name: "Updating",
showDoneCancelButtons: false,
editMode: "cell",
columnSettings: [
{
columnKey: "Title",
editorOptions: {
validation: true,
validatorOptions: {
onblur: true,
custom: {
method: function(value) {
if (value === "CEO") {
return false;
}
return true;
},
errorMessage: "You cannot enter CEO title"
]
}]
- To validate the data use the [columnSettings.editorOptions.validatorOptions](http://igniteui.com/help/api/2016.1/ui.iggridupdating#options:columnSettings.editorOptions) setting as shown in the code snippet above
- To have only one row expanded at a time handle the [rowExpanding](http://igniteui.com/help/api/2016.1/ui.ighierarchicalgrid#events:rowExpanding) event and collapse the other expanded rows.
rowExpanding: function (evt, ui) { $("#hgrid1 tr[aria-expanded=true]").each(function (ix, el) { $("#hgrid1").igHierarchicalGrid("collapse", el); }); }
rowExpanding: function (evt, ui) {
$("#hgrid1 tr[aria-expanded=true]").each(function (ix, el) {
$("#hgrid1").igHierarchicalGrid("collapse", el);
});
In this code snippet the "hgrid1" is the ID of the `igHierarchicalGrid` DOM placeholder
Hope this helps,Martin PavlovInfragistics, Inc.