What I am trying to achieve is a load on demand functionality using JQuery and JSON.
I have a value in my table, lets call it "BatchNumber", when I click the + button I want to trigger a function that will make a request to grab all the corresponding data for that particular order row. How does one bind events to the +/- button? I am not sure where the documentation is for this. Right now I'm parsing a full JSON dataset, but would like to do this on demand. If it helps here is my current BLOCKED SCRIPT
$(function () { var data = @Html.Raw(Json.Encode(Model)); $("#grid").igHierarchicalGrid({ dataSource: data, primaryKey: "BatchNumber", autoGenerateColumns: false, odata: false, initialDataBindDepth: 1, columns: [ { headerText: "Batch Number", key: "BatchNumber", dataType: "string" }, { headerText: "Process Date", key: "BatchGroupItemDate", dataType: "date", format: "MM-d-yyyy, h:mm tt" }, { headerText: "Batch Comment", key: "BatchComment", dataType: "string" }, { headerText: "Number Of Documents", key: "NumberOfDocuments", dataType: "number" }, { headerText: "Total Transfered", key: "TotalTransfered", dataType: "number" }, { headerText: "Not Transfered", key: "NotTransfered", dataType: "number" } ], features: [ { name: "Sorting", type: "local" }, { name: "Filtering", type: "local" }, { name: 'Paging', type: "local", pageSize: 10 } ], autoGenerateLayouts: false, columnLayouts:[ { key: "BatchDetails", autoGenerateColumns: false, primaryKey: "Key", foreignKey: "BatchNumber", responseDataKey: 'results', columns: [ { headerText: "Order #", key: "Key", dataType: "string" }, { headerText: "Process Date", key: "Date", dataType: "date", format: "MM-dd-yyyy, h:mm:ss tt" }, { headerText: "Batch Comment", key: "BatchComment", dataType: "string" }, { headerText: "Last Error Message", key: "LastErrorMessage", dataType: "string" }, { headerText: "Transferred Status", key: "TransferredStatus", dataType: "string" }, { headerText: "Transfer Date", key: "TransferDate", dataType: "date"} ], features: [ { name: "Sorting", type: "local" }] } ] }); });
Hi Zachary,
Thank you for posting in our forums! We already have Load on Demand functionality build in our Hierarchical grid. You can find more information here. If you want to create your own you can bind to rowExpanding or rowExpanded events of the grid. You can find more information about events and methods in our API Reference documentation.
Please let me know if you need any further assistance.
Kind regards, Petko Zhekov Software Engineer
I was unable to implement the load on demand using Jquery as I could not find an example of implementing the oData referenced in the documentation. With my current datastructure, switching oData to true just breaks my grid.
Hello Zachary,
From what I can see in your code your data is local and it’s already loaded on the page. In this case you don’t need a load on demand functionality because the whole point of the feature is to load the child layouts on demand from the server. Also you don't need the odata option if you are not loading you data from a oData service. If you experience any kind of issues you can send me a small project with sample data so I can see what exactly is happening and give you solution.
I’m looking forward to your reply.
I am just following up to check if you still need any assistance. If so don't hesitate to contact us again.