Unleashing the power of obtaining textbox values in DevEx AspxGridView

My form contains an AspxGridView. I have a scenario where upon checking the select checkbox, I trigger a ClientSideEvents event to retrieve selected row values and display them in a listbox:

<dx:ASPxListBox ID="listBox" ClientInstanceName="lb" runat="server"
        ValueType="System.String" Width="961px"></dx:ASPxListBox>
    <ClientSideEvents SelectionChanged="grid_SelectionChanged" />

    function grid_SelectionChanged(s, e) {
        s.GetSelectedFieldValues('A;B;C;D;E;F;G;H;I', GetSelectedFieldValuesCallback);
    }

    function GetSelectedFieldValuesCallback(selectedValues) {
            lb.ClearItems();
            if (selectedValues.length == 0) return;
            l = "";
            for (i = 0; i < selectedValues.length; i++) {
                s = "";
                for (j = 0; j < selectedValues[i].length; j++) {
                    s = s + selectedValues[i][j] + " - ";
                }
                l = l + s + "\r\n";
                lb.AddItem(s);
            }
        }
    

Furthermore, when I add datatextcolumns for textboxes and update the javascript function as shown below, I encounter an issue where I receive null values for textboxes.

<dx:GridViewDataTextColumn FieldName="textBox1" VisibleIndex="9">
        <Settings AllowHeaderFilter="False"></Settings>
        <DataItemTemplate>
        <dx:ASPxTextBox ID="txtBox1" Width="70" runat="server"></dx:ASPxTextBox>
        </DataItemTemplate>
    </dx:GridViewDataTextColumn>

    <dx:GridViewDataTextColumn FieldName="textBox2" VisibleIndex="10">
        <Settings AllowHeaderFilter="False"></Settings>
        <DataItemTemplate>
            <dx:ASPxTextBox ID="txtBox2" Width="70" runat="server"></dx:ASPxTextBox>
        </DataItemTemplate>
    </dx:GridViewDataTextColumn>

    function grid_SelectionChanged(s, e) {
        s.GetSelectedFieldValues('A;B;C;D;E;F;textBox1;textBox2;G;H;I',
                                GetSelectedFieldValuesCallback); 
    }
    

How can I resolve this issue?

Answer №1

Issue arises because txtBox1 and txtBox2 fields are nested inside DataItemTemplate. As they are within a DataItemTemplate, direct referencing by server side ID is not possible. To resolve this, assign a unique ClientInstanceName to each ASPxTextBox in every row.

Refer to DX support for recommended approach:

Mainly, add server side OnInit event handler to both textboxes:

<dx:ASPxTextBox ID="txtBox1" Width="70" runat="server" OnInit="OnTextBox1Init"/>

<dx:ASPxTextBox ID="txtBox2" Width="70" runat="server" OnInit="OnTextBox2Init"/>

Assign "row's-visible-index-dependent" ClientInstanceName to each textbox instance:

protected void OnTextBox1Init(object sender, EventArgs e) {
    ASPxTextBox tb1 = sender as ASPxTextBox;
    GridViewDataItemTemplateContainer container = 
    tb1.NamingContainer as GridViewDataItemTemplateContainer;
    tb1.ClientInstanceName = String.Format("txtBox1_{0}", container.VisibleIndex);
}

Retrieve the textbox value using row-id-dependent ClientInstanceName with GetText(): txtBox1_1.GetText() for first textbox at row #1, and so forth.

This explanation should guide you in resolving your task effectively.

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

Attempting to insert a square-shaped div within a larger square-shaped div and enable it to be moved around by dragging

Imagine this scenario: I have a button and a large div. When the button is clicked, the code adds a new div inside the larger one. However, the new div is not draggable because I didn't implement the necessary code. I'm also trying to figure out ...

Showing the elements of a python list in a dropdown menu on a webpage using AJAX

I'm currently utilizing Django and AJAX to create a chained dropdown feature. The user will initially choose a brand_name from a dropdown menu, and based on that selection, the names of all products made by that brand will be populated in a second dro ...

Translation of country codes into the complete names of countries

Currently, my code is utilizing the ipinfo.io library to retrieve the user's country information successfully. This is the snippet of code I am using to fetch the data: $.get("https://ipinfo.io?token=0000000000", function(response) { console.log ...

The Jquery confirmation dialogue does not seem to be functioning properly within the Content Place Holder

I've encountered an issue with a JQUERY Confirm dialogue where it works perfectly fine until I place it on a page that is within a masterpage. The confirm alert pops up for a split second and disappears. window.onload = function() { $("#ehi").cli ...

AngularJS: Understanding the difference between ng-show and using display:none

I recently encountered a scenario where I needed to hide an HTML element by default using CSS. Here's how I did it: HTML: <div class="box"> </div> CSS: .box { display: none; } However, I wanted to be able to show and hide the elem ...

What steps should I take to begin the following row once the initial one has been finished?

Currently, I have a script that sends requests to the CS:GO GC all at once. However, I would like to introduce some delay between these requests (maybe 1000 - 2000ms) so that each request goes through successfully. An ideal solution would be for each requ ...

Retrieve JavaScript Variable Value when Button is Clicked via asp:HiddenField

Having limited experience with JavaScript and jQuery, I decided to make some modifications to a jQuery Slider for adjusting dates. You can check out what I've done so far here: http://jsfiddle.net/ryn_90/Tq7xK/6/. I managed to get the slider working ...

In TypeScript, how are angle brackets like methodName<string>() utilized?

Could someone please assist me in understanding why we use angular brackets <> in typescript? For example, I have provided some code below and would appreciate an explanation. export class HomePage { constructor(public navCtrl: NavController) ...

JMeter recording displays a script alert error notification

After recording the JMeter script on blazemeter, it initially worked fine on the website. However, upon running the jmx file, I encountered an error message: "alert("Something went wrong. Please try again");window.history.back();" I&a ...

Angular 8 and the conundrum of date parsing issues

const timestamp = '2020-07-11T00:05:00'; const dateOfFlight = new Date(timestamp); dateOfFlight.getMonth() // The output should be 6 However, it is expected to be 7 based on the provided timestamp. ...

Height-based responsive navigation bar

I recently implemented a menu on my responsive website that appears when the viewport is 714px width or less. Upon clicking the button, a side-sliding menu emerges across the page. However, I'm facing an issue with setting the menu height to match th ...

Dynamic Calendar Tool with Integrated Time Picker

Are there any JavaScript and AJAX date picker libraries available that also include the option to select a time range? This would involve choosing a date first, followed by the ability to specify a time range. I'm in search of examples similar to thi ...

Retrieve the element's name with jQuery

In my form, there is a select element with the name field_p_payment[value] and I am trying to reset this select box. I attempted to do this by using the code below: document.getElementsByName("field_p_payment[value]").selectedIndex='0' Unfortun ...

Is there a way to utilize a single EventBus for both a Java and GWT project concurrently?

Currently, I am working on a java project that utilizes the Guava EventBus. My goal is to integrate this code into a GWT project without having to rewrite it entirely. While I am aware that GWT comes with its own built-in EventBus, making changes to my Jav ...

Is there a way to pass a variable to the callback function in a request?

My current approach involves using express and request to convert a website's HTML into JSON, and then sending it back as a response. Here is an example: app.get('/live', function(req, _res){ res = _res; options.url = 'http://targe ...

Having an issue with the OBJLoader.js not loading properly in three.js

Encountering an error using OBJLoader.js to load an obj model with the following message: Resource "https://cdnjs.cloudflare.com/ajax/libs/three.js/r119/OBJLoader.js" blocked due to mismatch (X-Content-Type-Options: nosniff) MIME type ("text ...

Sending a variety of parameters through a query string in a .aspx file to generate a real-time report

I am facing an issue with passing multiple values in a query string for my ASP.Net web report in VS2012. When I pass a single value (e.g., abc), the data is retrieved correctly. However, when passing multiple values separated by a comma (e.g., abc, xyz), t ...

Using a dynamic HTML interface, select from a vast array of over 50,000 values by leveraging the power

I am working on a project that includes a multiselect option with over 50,000 records. We are using AJAX to fetch data from the server based on user searches, which works fine. However, when a user tries to select all records by clicking the "check all" ...

Identifying when a browser is closed with multiple tabs open in Internet Explorer

I need to detect when a browser tab is closed in order to trigger a Struts action. I have successfully implemented this for a single tab using the following JavaScript code: <script type="text/javascript> function loadOut() { if ((window.event.c ...

Add different input strings to an array within the scope when there is a change in the input value (AngularJS)

My goal is to populate an empty array within the scope with strings. The number of elements in this array can vary depending on what the user types in the player count input field. $scope.playerNames = []; To achieve this, I am using a $watch function th ...