CODEWITHSUNDEEP
c#jqueryasp.net
AShah
AShah

Reputation: 942

Getting client ID using jquery

Im trying to validate a textbox by getting the client ID using the below and then testing its value The textbox is in a ModalPopupExtender which is in a updatepanel However JQuery doesnt seem to be returning anything, the control is always NULL This textbox is inside a gridview

  <asp:TemplateField HeaderText="Quick Donate">
                                <ItemTemplate>
                                    <asp:Button ID="btnQuickDonate" runat="server"
                                        CommandName="Insert"
                                        CommandArgument="<%# ((GridViewRow) Container).RowIndex %>"
                                        OnClick="btnQuickDonate"
                                        Text="Quick Donate" />
                                    <ajaxToolkit:ModalPopupExtender ID="ModalDonationPopup" runat="server" TargetControlID="btnQuickDonate" PopupControlID="Panel1" BackgroundCssClass="modalBackground">
                                    </ajaxToolkit:ModalPopupExtender>
                                    <asp:Panel ID="Panel1" runat="server" CssClass="modalPopup" Style="display: none">
                                        Enter Donation Amount<br />
                                        <table>
                                            <tr>
                                                <td></td>
                                                <td>
                                                    <asp:Button ID="btnOnePound" runat="server" CommandArgument="<%# ((GridViewRow) Container).RowIndex %>" OnClick="btnQuickDonate" Text="1" />
                                                    <asp:Button ID="btnFivePound" runat="server" CommandArgument="<%# ((GridViewRow) Container).RowIndex %>" OnClick="btnQuickDonate" Text="5" />
                                                    <asp:Button ID="btnTenPound" runat="server" CommandArgument="<%# ((GridViewRow) Container).RowIndex %>" OnClick="btnQuickDonate" Text="10" />
                                                    <asp:Button ID="btnFifteenPound" runat="server" CommandArgument="<%# ((GridViewRow) Container).RowIndex %>" OnClick="btnQuickDonate" Text="15" />
                                                    <asp:Button ID="btnTwentyPounds" runat="server" CommandArgument="<%# ((GridViewRow) Container).RowIndex %>" OnClick="btnQuickDonate" Text="20" />
                                                    <asp:Button ID="btnTwentyFivePounds" runat="server" CommandArgument="<%# ((GridViewRow) Container).RowIndex %>" OnClick="btnQuickDonate" Text="25" />
                                                    <asp:Button ID="btnThirtyPounds" runat="server" CommandArgument="<%# ((GridViewRow) Container).RowIndex %>" OnClick="btnQuickDonate" Text="30" />
                                                    <asp:Button ID="btnFiftyPounds" runat="server" CommandArgument="<%# ((GridViewRow) Container).RowIndex %>" OnClick="btnQuickDonate" Text="50" />

                                                </td>

                                            </tr>
                                            <%--  --%>
                                        </table>
                                        <br />

                                        <asp:TextBox ID="txtFreeDonationAmount" runat="server" CommandArgument="<%# ((GridViewRow) Container).RowIndex %>"  ></asp:TextBox>
                                        **<asp:Button ID="btnOK" runat="server" CommandArgument="<%# ((GridViewRow) Container).RowIndex %>" Text="OK" OnClientClick="return valtxtBoxFreeDonation();" OnClick="btnQuickDonate"></asp:Button>**
                                        <br />
                                        <asp:Button ID="btnCancel" runat="server" Text="Cancel" />

                                    </asp:Panel>

Javascript below I have also tried $('#txtFreeDonationAmount') with no joy...

function valtxtBoxFreeDonation() {
    var txtDonation = $('#<%=txtFreeDonationAmount.ClientID %>');

     if (txtDonation.val().length < 0) {
        // do something
        apprise("Please Enter a Donation Amount before click okay");
        return false;
    }

}

Upvotes: 0

Views: 28680

Answers (2)

Vsevolod Goloviznin
Vsevolod Goloviznin

Reputation: 12324

The bold solution is jsut to take this id 'GridView1_btnOK_1` and use it in your JS. 

$('#GridView1_txtFreeDonationAmount_0')

And as mentiones about the $('#<%=txtFreeDonationAmount.ClientID %>') will work only if your JS is in the same .aspx file.

Upvotes: 2

Paweł Sołtysiak
Paweł Sołtysiak

Reputation: 625

This code:

var txtDonation = $('#<%=txtFreeDonationAmount.ClientID %>');

will work properly only when JavaScript is inside .aspx file.

Upvotes: 10

Related Questions