OK. Could able to manage to some extent myself. Now I am stuck at getting the checked nodes along with edited value at client side. I tried with Ext.getCmp('FunctionTree').getCheckedNodes() with no luck.
Looking for expert advise -
The tree in cshtml
Html.X().TreePanel()
.Title("FunctionTree")
.Region(Region.Center)
.Fields(
Html.X().ModelField().Name("nodeText"),
Html.X().ModelField().Name("name"),
Html.X().ModelField().Name("amount").Type(ModelFieldType.Int)
)
.ColumnModel(
Html.X().TreeColumn().DataIndex("nodeText").Width(280),
Html.X().Column().DataIndex("name").Flex(1),
Html.X().Column().DataIndex("amount").Editor(Html.X().NumberField())
)
.Border(false)
.Root(Html.X().Node().NodeID("0").Text("Root").Checked(false))
.Listeners(l => { l.BeforeLoad.Fn = "nodeLoad"; })
.Plugins(
Html.X().CellEditing()
)
The loader function in javascript -
var nodeLoad = function (store, operation, options) {
var node = operation.node;
App.direct.NodeLoad(node.getId(), {
success: function (result) {
node.set('loading', false);
node.set('loaded', true);
node.appendChild(result);
node.expand();
},
failure: function (errorMsg) {
Ext.Msg.alert('Failure', errorMsg);
}
});
return false;
};
The Action Method -
[DirectMethod]
public ActionResult NodeLoad(string node)
{
NodeCollection nodes = new Ext.Net.NodeCollection();
if (!string.IsNullOrEmpty(node))
{
for (int i = 1; i < 6; i++)
{
Node asyncNode = new Node()
{
NodeID = Guid.NewGuid().ToString(),
Text = "ChildNodeText1",
Checked = false,
AttributesObject = new { nodeText = "noteText"+i, name = "Name "+i, amount = i }
};
nodes.Add(asyncNode);
}
}
return this.Direct(nodes);
}