Asp.net C# display data from gridview to TextBox using Javascript

Question

I have a simple gridview that contains userID and user_name and a select button in each row,

I created a javascript function to display user ID and User Name from gridview to asp.net Texboxe user ID and Texboxe user Name by clicking on the select button, and its working fine,

but instead of using multiple buttons on each row I want to use a single button that can do the same thing based on the value on Texboxe user ID value,

for example if I typed user ID (1) on Texboxe user ID and then clicked the single button it show display the user name on Texboxe user Name

  <asp:GridView runat="server" ID="GridView11" AutoGenerateColumns="false" Width="290px" DataSourceID="SqlDataSource11" CssClass="GridviewDiv">
                            <HeaderStyle CssClass="headerstyle" Height="40px" />
                            <Columns>
                 <asp:BoundField DataField="user_name" HeaderText="user ID"/>

                <asp:TemplateField HeaderText="user name" >
                       <ItemTemplate>
                            <asp:Label ID="Label27" Text='<%#  Eval("user_name")  %>' runat ="server" />
                       </ItemTemplate>
                       </asp:TemplateField>

                  <asp:TemplateField>
           <ItemTemplate>                                                                                                                                               
                       <asp:Button ID="ButtonSelect" runat="server" ClientIDMode="Static" width="60" Text='Select'  OnClientClick = "return GetSelectedRow(this)"  />

              </ItemTemplate>
             </asp:TemplateField>

                            </Columns>
                        </asp:GridView>
            <asp:SqlDataSource ID="SqlDataSource11" runat="server" ConnectionString="<%$ ConnectionStrings:MydbConnectionString2 %>" SelectCommand="SELECT [user_ID], [user_name] FROM users_table"></asp:SqlDataSource>





                function GetSelectedRow(UserLink) {
                    var row = UserLink.parentNode.parentNode;

                    var Userid = row.cells[0].innerHTML;
                    var UseriName= row.cells[1].getElementsByTagName("span")[0].innerHTML;

                     //document.getElementById("TextBox_user_id").value = Userid;

                     document.getElementById("TextBox_user_name").value = UseriName;

                    return false;

                }

s.ch · Accepted Answer · 2021-11-02 04:21:49Z

1

You Can Use Like this...

   function GetSelectedRow(UserLink) {
                            var row = UserLink.parentNode.parentNode;
                            var i = row.rowIndex;                           
                            var grid1=document.getElementById("GridView11");
                            var Userid = grid1.row[i].cells[0].innerHTML;
                            var UseriName= grid1.rows[i].cells[1].getElementsByTagName("span")[0].innerHTML;
        
                             //document.getElementById("TextBox_user_id").value = Userid;
        
                             document.getElementById("TextBox_user_name").value = UseriName;
        
                            return false;
        
                        }

answered Nov 2, 2021 at 4:21

s.ch

1446 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Asp.net C# display data from gridview to TextBox using Javascript

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related