CODEWITHSUNDEEP
jqueryasp.net
Adesh Mishra
Adesh Mishra

Reputation: 69

how to get Textbox value in Jquery/Javascript if id created dynamically based on condition

I have multiple rows and with text box and button, I created a jQuery function to get the value of Text-box on class click. I tried so long but unable to get value. what I am doing wrong here.? Thanks in Advance. Text-box Code:-

$('input.R_Insert').click(function() {

  var roundNum = 0; // row no get from db (1,2,3,4,5..)

  var bb = "#TextBox" + roundNum;
  var x = $("bb").val();
  alert(x);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<tbody>
  <tr>
    <td>
      <div id="">
        <asp:TextBox ID="TextBox1" runat="server" TextMode="MultiLine" CssClass="form-control" Rows="5" Text="" Enabled="false"></asp:TextBox>
        <asp:Button ID="btnSubmit1" runat="server" Text="Submit" CssClass="add_top_10 R_Insert" Enabled="false" />
      </div>
    </td>
    <td>
      <div id="">
        <asp:TextBox ID="TextBox2" runat="server" TextMode="MultiLine" CssClass="form-control" Rows="5" Enabled="false"></asp:TextBox>
        <asp:Button ID="btnSubmit2" runat="server" Text="Submit" CssClass="add_top_10 R_Insert" Enabled="false" />
      </div>
    </td>
  </tr>
  <tr>
    <td>
      <div id="">
        <asp:TextBox ID="TextBox3" runat="server" TextMode="MultiLine" CssClass="form-control" Rows="5" Text="" Enabled="false"></asp:TextBox>
        <asp:Button ID="btnSubmit3" runat="server" Text="Submit" CssClass="add_top_10 R_Insert" Enabled="false" />
      </div>
    </td>
    <td>
      <div id="">
        <asp:TextBox ID="TextBox4" runat="server" TextMode="MultiLine" CssClass="form-control" Rows="5" Enabled="false"></asp:TextBox>
        <asp:Button ID="btnSubmit4" runat="server" Text="Submit" CssClass="add_top_10 R_Insert" Enabled="false" />
      </div>
    </td>
  </tr>
</tbody>

Upvotes: 0

Views: 435

Answers (3)

Mohammed Athar Imran Ahmed
Mohammed Athar Imran Ahmed

Reputation: 675

Here is a working code. You may play @ https://jsfiddle.net/wmfn5t7c/

<table>

<tbody>
                    <tr>
                        <td>
                            <div id="">
                                <input type='TextBox' ID="TextBox1" runat="server" TextMode="MultiLine" CssClass="form-control" Rows="5" Text="" Enabled="false" />
                                <input type='Button' ID="btnSubmit1" runat="server"  Text="Submit" CssClass="add_top_10 R_Insert" Enabled="false" />
                            </div>
                        </td>
                        <td>
                            <div id="">
                                <asp:TextBox ID="TextBox2" runat="server" TextMode="MultiLine" CssClass="form-control" Rows="5" Enabled="false"></asp:TextBox>
                                <asp:Button ID="btnSubmit2" runat="server" Text="Submit" CssClass="add_top_10 R_Insert" Enabled="false" />
                            </div>
                        </td>
                    </tr>
                 <tr>
                        <td>
                            <div id="">
                                <asp:TextBox ID="TextBox3" runat="server" TextMode="MultiLine" CssClass="form-control" Rows="5" Text="" Enabled="false"></asp:TextBox>
                                <asp:Button ID="btnSubmit3" runat="server" Text="Submit" CssClass="add_top_10 R_Insert" Enabled="false" />
                            </div>
                        </td>
                        <td>
                            <div id="">
                                <asp:TextBox ID="TextBox4" runat="server" TextMode="MultiLine" CssClass="form-control" Rows="5" Enabled="false"></asp:TextBox>
                                <asp:Button ID="btnSubmit4" runat="server" Text="Submit" CssClass="add_top_10 R_Insert" Enabled="false" />
                            </div>
                        </td>
                    </tr>
                </tbody>
</table>

 $('#btnSubmit1').click(function () {

            var roundNum = 1; // row no get from db (1,2,3,4,5..)

            var bb = "#TextBox" + roundNum;
            var x = $(bb).val();
            alert(x); 
            });

Upvotes: 0

Bharatsing Parmar
Bharatsing Parmar

Reputation: 2455

You can also try this one that work with textbox,dropdown, textarea.

$('.R_Insert').click(function () {
  //This will work for textarea,input, select controls
  var x = $(this).parent().find('.form-control').val();         
  alert(x);
});

Upvotes: 0

LogicalDesk
LogicalDesk

Reputation: 1297

just remove the double quotes-

var bb = "#TextBox" + roundNum;
            var x = $(bb).val();

Upvotes: 1

Related Questions