Getting the expanded row columns values in a RadGrid when using the onHierarchyExpanded event

Here is the code for my RadGrid:

<telerik:RadGrid ID="ProductRanges_Grd" ShowHeaderWhenEmpty="true" runat="server"
                        AutoGenerateColumns="false" Width="100%" Height="250px" ShowHeader="true" Visible="false"
                         OnDetailTableDataBind="ProductRanges_Grd_DetailTableDataBind" OnItemCommand="ProductRanges_Grd_ItemCommand"
                          OnInsertCommand="ProductRanges_Grd_InsertCommand" OnUpdateCommand="ProductRanges_Grd_UpdateCommand" 
                          OnNeedDataSource="ProductRanges_Grd_NeedDataSource" OnDeleteCommand="ProductRanges_Grd_DeleteCommand"
                          OnItemDataBound="ProductRanges_Grd_ItemDataBound">
                        <ClientSettings>
                            <ClientEvents OnRowSelected="RowSelected"  OnHierarchyExpanded="HierarchyExpanded" />
                            <Scrolling AllowScroll="true" />
                            <Selecting AllowRowSelect="true" />
                        </ClientSettings>
                        <MasterTableView EditMode="EditForms" HierarchyLoadMode="Client" DataKeyNames="PROVIDER_ID,PROVIDER_NAME" 
                            HierarchyDefaultExpanded="false">
                            <NoRecordsTemplate>
                                <span></span>
                            </NoRecordsTemplate>
                            <Columns>
                                <telerik:GridBoundColumn UniqueName="PROVIDER_ID" DataField="PROVIDER_ID" Display="false">
                                </telerik:GridBoundColumn>
                                <telerik:GridBoundColumn UniqueName="PROVIDER_NAME" DataField="PROVIDER_NAME" HeaderText="Provider">
                                </telerik:GridBoundColumn>
                            </Columns>
                            <DetailTables>
                                <telerik:GridTableView CommandItemDisplay="Top" DataKeyNames="PRODUCT_ID" Name="ProductTableView"
                                    ShowHeadersWhenNoRecords="true" EditMode="EditForms" ShowFooter="true" >

                                    <CommandItemTemplate>
                                        <table width="100%">
                                            <tr>
                                                <td align="left" style="padding-left: 8px;" valign="middle">
                                                    <asp:ImageButton ID="AddDetailTable_btn" CommandName="InitInsert"  runat="server"
                                                        ImageUrl="~/images/add.gif" />  Add
                                                </td>
                                            </tr>
                                        </table>
                                    </CommandItemTemplate>
                                    <Columns>
                                        <telerik:GridButtonColumn ButtonType="ImageButton" ImageUrl="../../../images/Erase12.png"
                                            HeaderText="Remove" CommandName="Delete">
                                        </telerik:GridButtonColumn>
                                        <telerik:GridEditCommandColumn ButtonType="ImageButton" EditImageUrl="../../../images/edit.gif">
                                        </telerik:GridEditCommandColumn>
                                        <telerik:GridBoundColumn UniqueName="ROW_ID" DataField="ROW_ID" Display="false">
                                        </telerik:GridBoundColumn>
                                        <telerik:GridBoundColumn UniqueName="PRODUCT_ID" DataField="PRODUCT_ID" Display="false">
                                        </telerik:GridBoundColumn>

                                        <telerik:GridBoundColumn UniqueName="PRODUCT_NAME" DataField="PRODUCT_NAME" HeaderText="Products">
                                        </telerik:GridBoundColumn>
                                        <telerik:GridBoundColumn UniqueName="Min_Quantity" DataField="MIN_QUANTITY" HeaderText="Minimum quantity">
                                        </telerik:GridBoundColumn>
                                        <telerik:GridBoundColumn UniqueName="Max_Quantity" DataField="MAX_QUANTITY" HeaderText="Maximum quantity">
                                        </telerik:GridBoundColumn>
                                        <telerik:GridBoundColumn UniqueName="Comission" DataField="DISCOUNT_VALUE"
                                            HeaderText="Commission">
                                        </telerik:GridBoundColumn>



   <script type="text/javascript">

   function HierarchyExpanded(sender,args)
  {
     // how can I access the expanded row's ProviderID in this function?
  }

Any help is appreciated

c#javascripttelerikradgrid

Answer №1

Feel free to experiment with the sample code provided below.

JavaScript

function DisplayHierarchyInfo(sender, eventArgs) {
            alert(eventArgs.get_gridDataItem().getDataKeyValue("ITEM_ID"));
        }

.html

<MasterTableView ClientDataKeyNames="ITEM_ID" HierarchyLoadMode="Client">

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

When I try to insert new data into a MongoDB collection during an update operation, the existing data is being overwritten instead

While updating data, I have a requirement to also add new data. Specifically, I need to append data to an existing object in a for loop that stores data in a database. However, when attempting this, the data is being updated instead of added to the current ...

javascriptnode.jsmongodbmongoose

Which internal function is triggered in JavaScript when I retrieve the value of an array element by its index?

Check out this fascinating wtfjs code snippet: var a = [,]; alert(a.indexOf(a[0])); This example highlights the difference between uninitialized and undefined values: The array a contains only one uninitialized element. Accessing a[0] returns undefined ...

javascript

Creating NextJS Route with Dynamic Links for Main Page and Subpages

In my NextJS project, I have dynamic pages and dynamic subpages organized in the following folders/files structure: pages ├── [Formation] ├── index.js │ ├── [SubPage].js Within index.js (Formation Page), I create links like this: < ...

javascriptnext.jsnext-link

Create a personalized compilation process that eliminates the two-way binding

In my Angular 1.5.8 application, I have created an attribute directive called my-directive. I am trying to apply this directive to an element while passing two additional parameters - one with one-way binding (@) and the other with two-way binding (=). Ev ...

javascriptangularjsangularjs-directive

Using the spread operator to modify an array containing objects

I am facing a challenge with updating specific properties of an object within an array. I have an array of objects and I need to update only certain properties of a single object in that array. Here is the code snippet I tried: setRequiredFields(prevRequir ...

javascriptreactjstypescript

Successfully running npm update on a Mac seemed to have updated the package, however, the

I needed to upgrade my npm version using the following command: npm install npm@latest -g After running the above command, I encountered the following output: /Users/ariful.haque/.npm-global/bin/npm -> /Users/ariful.haque/.npm-global/lib/node_modules ...

javascriptnode.jsnpm

How to disable annoying browser ad extensions using Javascript

Is there a way to prevent browser add-ons from injecting HTML code? My website built in angularjs is experiencing routing issues due to certain browser add-ons. The following HTML snippet is causing errors in my angularjs: <script async="" src="http:/ ...

javascriptangularjsbrowser-addons

Focus on programmatically generated elements by utilizing refs

I need to set focus on the Input within a custom component by creating dynamic refs. This is how I'm currently rendering the elements: const createRefForCountRow = denom => { this[`${denom.id}-ref`] = React.createRef(); return ( <Count ...

javascriptreactjsreact-ref

Can a 1D array be utilized to create a 2D grid in React?

I needed to display a one-dimensional array in a 2D grid format with 3 rows and 3 columns. The array itself contains numbers from 1 to 9. const array = Array.from({ length: 9 }, (_, i) => i + 1); In my React component, I have it rendering as a series o ...

javascripthtmlcssreactjs

I have noticed that when I close the Material-UI dialog, it prevents me from interacting with my

After closing the material-ui dialog box, I seem to be unable to click or touch anything on my page. The useState hook is used here: const [open, setOpen] = useState(false); This function is called when handling the dialog close action: const handleClose ...

javascriptreactjsmaterial-ui

Reverting a concealed segment

Can anyone make sense of my unconventional explanation? I've set up a hidden section as shown below: <section class="intro"> <label> <input type="checkbox"> <span class="menu"> <span class="hamburger"></span&g ...

javascriptjqueryhtmlcss

Server Error: Reactjs doesn't support posting images

I am experiencing an issue in my ReactJS project. When I attempt to upload an image using react-images-uploader, I encounter the following error: "Cannot POST /images error" Below is the code snippet for the image upload: <ImagesUploader ur ...

javascriptreactjs

Utilizing React JS to dynamically incorporate form values into objects

I have an array of objects where I need to add a key value State : const [row, setRow] = useState([{ nameofthework: "", schedulerefNo: "", unitprice: "", qty: "", uom: "", gst: "", total: "& ...

javascriptnode.jsreactjsexpressecmascript-6

Struggling to accurately determine the intersection face vertex positions in Three.js

Hello there! I've been immersed in the world of three.js, dealing with loading models using THREE.JSONLoader. Currently, I'm faced with the task of selecting these objects and their faces, which I've managed to do successfully. Now, my goal ...

javascriptthree.jsintersectionvertex

The search text box is mysteriously absent from each column in the datatables

I am utilizing jQuery Datatables to construct a table with data retrieved from MySQL. This is how my table appears: LOT_LOCATION, Zone Attribute, LOTID, Design_ID, Board_ID1, QA_WORK_REQUEST_NO, QA_CONTACT_NAME, QA_PROCESS_NAME, CURRENT_QTY, Date, Temp ...

javascriptjqueryjsondatatables

Using three.js to control the opacity and size of points

I have returned with question number two about points. My query this time revolves around changing the opacity from 0 to 1 and back within specific pixel distances from the emitter. var particleCount = 14, particles = new THREE.Geometry(), pMaterial = new ...

javascriptthree.jsopacitypointparticles

In order to enhance your programming skills, avoid hard coding functions and ensure that data is returned after binding changes

I am trying to create a method where I can provide a DOM as a parameter and retrieve data from image_preview. The goal is to make image_preview reusable instead of hardcoding it inside the function. Additionally, I want to separate image_preview.model() an ...

javascriptjqueryoop

Transforming JSON format to another JSON format using AngularJS

I am in the process of setting up a questionnaire using angularjs. I have an array of responses that looks like the following, and I need to convert this object array into JSON format. How do I go about converting an object array into JSON format? ...

javascriptarraysangularjsjson

JavaScript regular expressions only recognize certain characters

When submitting a form, I need to validate a field and ensure that only specific characters are allowed. The permitted characters include: a-z A-Z 0-9 % . " ' & - @ # $ * / + = [ ] ! I attempted to use the following regex for validation: var r ...

javascriptregex

Exploring the world of Bootstrap Twitter 3.0 alongside the wonders of Knockout

When utilizing Twitter Bootstrap, the validation classes like has-error or has-warning must be added to the wrapping form-group element to style both the input and its label. However, Knockout-Validation directly adds the class to the input element itself. ...

javascriptcsstwitter-bootstrapknockout.js