locked
pass textbox values to gridview on button click via javascript RRS feed

  • Question

  • User364607740 posted

    I've some textboxes in my web form and I've to pass the values of these textboxes to gridview using javascript/jquery. I searched in internet but did not get anything worthy. How could I do it?

    <div>
                First name:<br />
                <input type="text" name="firstname" id="txtfname" runat="server" />
                <br />
                Last name:<br />
                <input type="text" name="lastname" id="txtlname" runat="server" />
                <br />
                <input type="submit" value="Submit" />
                <br />
                <br />
                <div id="div_grid" runat="server">
                    <asp:GridView ID="GridView1"
                        runat="server"
                        AutoGenerateColumns="false"
                        Width="100%">
                        <Columns>
                            <asp:TemplateField HeaderText="S No." ItemStyle-Width="5%">
                                <ItemTemplate>
                                    <%#Container.DataItemIndex+1 %>
                                </ItemTemplate>
                            </asp:TemplateField>
                            <asp:BoundField
                                DataField="txtfname"
                                HeaderText="FRIST NAME">
                                <ItemStyle VerticalAlign="Top" />
                            </asp:BoundField>
                            <asp:BoundField
                                DataField="txtlname"
                                HeaderText="LAST NAME">
                                <ItemStyle VerticalAlign="Top" />
                            </asp:BoundField>
    
                        </Columns>
                    </asp:GridView>
                </div>
    
            </div>

    Please help!!!

    Saturday, April 21, 2018 6:47 PM

All replies

  • User-1838255255 posted

    Hi scala_1988,

    According to your description and code, as far as i know, you want to pass the textbox value to the code behind through JS then show them in gridview. 

    I think you could use jquery ajax to send data to code behind, then insert them to database, then bind them to the gridview: 

    Insert Data Into SQL Database Using jQuery Ajax: 

    https://www.c-sharpcorner.com/UploadFile/b926a6/data-insert-into-sql-database-using-jquery-ajax-method/ 

    But i am not clear why you need pass data through JS? Usually we insert the data and show gridview data directly in code behind, if you could use it, please check this tutorial:

    Insert data in GridView without using database in ASP.Net: 

    https://www.aspsnippets.com/Articles/Insert-data-in-GridView-without-using-database-in-ASPNet.aspx 

    Best Regards,

    Eric Du 

    Monday, April 23, 2018 8:15 AM
  • User-492460945 posted

    Hello scala_1988,

    Not sure why you want to fill gridview textbox using javascript. But we have a way to do it. Please check below.

     var grid = $11('<%=gv.ClientID %>');
                for (var i = 2; i <= grid.rows.length + 1; i++) {
                    if (i <= 9) {
                        i = '0' + i;
                    }
                    $11(grid.id + '_ctl' + i + '_txt').value = 'your value'
                       
                }

    Thanks,

    RajeshV.

    Monday, April 23, 2018 12:04 PM