|
| 1 | +--- |
| 2 | +title: Accessing Child Row DataKeyName From ComboBox in RadGrid for ASP.NET AJAX |
| 3 | +description: This article demonstrates how to retrieve the DataKeyName value of a child row in RadGrid during the ComboBox's OnClientItemsRequesting event. |
| 4 | +type: how-to |
| 5 | +page_title: How to Access Child Row DataKeyName in RadGrid for ASP.NET AJAX From the ComboBox's OnClientItemsRequesting Event |
| 6 | +slug: grid-how-to-access-child-row-datakeyname-from-combobox |
| 7 | +tags: radgrid, asp.net ajax, datakeyname, onclientitemsrequesting, hierarchical grid, batch editing |
| 8 | +res_type: kb |
| 9 | +ticketid: 1685179 |
| 10 | +--- |
| 11 | + |
| 12 | +## Description |
| 13 | +When working with a hierarchical RadGrid with batch editing enabled for the child table, there may be a need to access the DataKeyName value of a child row within the `OnClientItemsRequesting` event. This is particularly useful for passing the DataKeyName to the context, allowing the `OnItemsRequested` event handler to use it for populating the ComboBox datasource. This knowledge base article also answers the following questions: |
| 14 | +- How can I retrieve a child row's DataKeyName in RadGrid for ASP.NET AJAX? |
| 15 | +- What is the process to access hidden DataKeyNames in a RadGrid's child table? |
| 16 | +- How to use the OnClientItemsRequesting event to get DataKeyName from a child row in RadGrid? |
| 17 | + |
| 18 | +## Environment |
| 19 | +<table> |
| 20 | +<tbody> |
| 21 | +<tr> |
| 22 | +<td>Product</td> |
| 23 | +<td>RadGrid for ASP.NET AJAX</td> |
| 24 | +</tr> |
| 25 | +</tbody> |
| 26 | +</table> |
| 27 | + |
| 28 | +## Solution |
| 29 | +To access the `OrderDetailID` DataKeyName value from the detail table in the `OnClientItemsRequesting` event, even if it's not a displayed column, set the `DataKeyNames` attribute to "OrderDetailID" and use the `ClientDataKeyNames` to access the value on the front-end. Here is the approach to achieve this: |
| 30 | + |
| 31 | +1. Ensure the `DataKeyNames` and `ClientDataKeyNames` attributes are correctly set in your RadGrid definition. |
| 32 | + |
| 33 | +````ASP.NET |
| 34 | +<telerik:RadGrid ID="RadGrid1" runat="server" Width="400" OnNeedDataSource="RadGrid1_NeedDataSource" OnDetailTableDataBind="RadGrid1_DetailTableDataBind"> |
| 35 | + <MasterTableView Name="Orders" AutoGenerateColumns="False" DataKeyNames="OrderID" EditMode="Batch"> |
| 36 | + <Columns> |
| 37 | + ... |
| 38 | + </Columns> |
| 39 | + <DetailTables> |
| 40 | + <telerik:GridTableView Name="OrderDetails" AutoGenerateColumns="false" EditMode="Batch" ClientDataKeyNames="OrderDetailID" DataKeyNames="OrderDetailID"> |
| 41 | + <Columns> |
| 42 | + ... |
| 43 | + </Columns> |
| 44 | + </telerik:GridTableView> |
| 45 | + </DetailTables> |
| 46 | + </MasterTableView> |
| 47 | +</telerik:RadGrid> |
| 48 | +```` |
| 49 | + |
| 50 | +2. Adjust the JavaScript function to find the correct data item and access the `OrderDetailID`. |
| 51 | + |
| 52 | +````JavaScript |
| 53 | +function onClientItemsRequested(sender, args) { |
| 54 | + let comboElement = sender.get_element(); // Get the ComboBox element |
| 55 | + let rowElement = $(comboElement).closest("tr.rgRow, tr.rgAltRow")[0]; |
| 56 | + |
| 57 | + if (rowElement) { |
| 58 | + let detailTables = $find("<%=RadGrid1.ClientID %>").get_detailTables(); // Get the Detail Tables |
| 59 | + |
| 60 | + let currentDetailTable = Array.from(detailTables).find((table) => { |
| 61 | + let editedComboBox = table.get_element().querySelector(".rgBatchCurrent .rgBatchContainer .RadComboBox"); |
| 62 | + return editedComboBox && comboElement.id === editedComboBox.id; |
| 63 | + }); // Find the currently edited Detail Table |
| 64 | + |
| 65 | + if (currentDetailTable) { |
| 66 | + let dataItem = currentDetailTable.get_dataItems()[rowElement.rowIndex]; // Get the DataItem |
| 67 | + let orderDetailID = parseInt(dataItem.getDataKeyValue("OrderDetailID")); // Find the detail order id |
| 68 | + console.log(orderDetailID); |
| 69 | + } |
| 70 | + } |
| 71 | +} |
| 72 | +```` |
| 73 | + |
| 74 | +By utilizing the `find` method to match the currently edited ComboBox, you ensure that you are accessing the detail table corresponding to the row you are interacting with. This method allows you to retrieve the `OrderDetailID` of the correct row effectively. |
| 75 | + |
| 76 | +## See Also |
| 77 | +- [RadGrid for ASP.NET AJAX Documentation](https://docs.telerik.com/devtools/aspnet-ajax/controls/grid/overview) |
| 78 | +- [Client-Side Programming Overview](https://docs.telerik.com/devtools/aspnet-ajax/controls/grid/client-side-programming/overview) |
0 commit comments