0

HTML Markup

        <table>
            <tr>
                <td><asp:Label runat="server" Text="Subject: " /></td>
                <td><asp:TextBox ID="txtSubject" runat="server" />
                    <asp:RequiredFieldValidator runat="server" ErrorMessage=" *" ControlToValidate="txtSubject" Font-Size="10pt" ForeColor="Red" />
                </td>
            </tr>
            <tr></tr><tr></tr><tr></tr>
            <tr>
                <td><asp:Label runat="server" Text="Messages: " /></td>
                <td><asp:TextBox ID="txtMessage" runat="server" TextMode="MultiLine" Height="100px" Width="18em" />
                    <asp:RequiredFieldValidator runat="server" ErrorMessage=" *" ControlToValidate="txtMessage" Font-Size="10pt" ForeColor="Red" />
                </td>
            </tr>
            <tr></tr><tr></tr><tr></tr>
            <tr>
                <td><asp:Button ID="btnSubmit" runat="server" Text="Submit" CssClass="Button" OnClick="SubmitFeedback" /></td>
                <td><asp:Button ID="btnReset" runat="server" Text="Reset" CssClass="Button" CausesValidation="false" ClientIDMode="Static" /></td>
            </tr>
        </table>

.JS

$(document).ready(function() {
    $('#btnReset').click(function (e) {
        clearTextBox(e);
    });
});

function clearTextBox(e) {
    e.preventDefault();
    $('#txtSubject').val("");
    $('#txtMessage').val("");
}

Both of the textbox value if unable to reset.
What i done wrongly in my code?

3
Contributors
3
Replies
15
Views
3 Years
Discussion Span
Last Post by gahhon
0

Set ClientIDMode on your textboxes to static, otherwise the id that gets rendered looks like ctl_blahblahblah...

0

I tested your code. It worked as expected. I do agree that you may consider adding the ClientIDMode Attribute so that asp.net renders the HTML element with that ID.

I did not add it in my example and when I looked at the HTML source code, ASP.NET used the same IDs without having to use ClientIDMode. However, as a rule of thumb, whenever I integrate javascript/jQuery, I always set this attribute.

Here is my complete example... maybe you forgot to include the reference to the jQuery library in your <head> section. In the example below, i did not include the onclick event for your submit button...

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Demo</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
</head>
<body>
    <form id="form1" runat="server">
<table>
            <tr>
                <td><asp:Label ID="Label1" runat="server" Text="Subject: " /></td>
                <td><asp:TextBox ID="txtSubject" runat="server" />
                    <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage=" *" ControlToValidate="txtSubject" Font-Size="10pt" ForeColor="Red" />
                </td>
            </tr>
            <tr></tr><tr></tr><tr></tr>
            <tr>
                <td><asp:Label ID="Label2" runat="server" Text="Messages: " /></td>
                <td><asp:TextBox ID="txtMessage" runat="server" TextMode="MultiLine" Height="100px" Width="18em" />
                    <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ErrorMessage=" *" ControlToValidate="txtMessage" Font-Size="10pt" ForeColor="Red" />
                </td>
            </tr>
            <tr></tr><tr></tr><tr></tr>
            <tr>
                <td><asp:Button ID="btnSubmit" runat="server" Text="Submit" CssClass="Button"  /></td>
                <td><asp:Button ID="btnReset" runat="server" Text="Reset" CssClass="Button" CausesValidation="false" ClientIDMode="Static" /></td>
            </tr>
        </table>
    </form>
    <script>
        $(document).ready(function () {
            $('#btnReset').click(function (e) {
                clearTextBox(e);
            });
        });
        function clearTextBox(e) {
            e.preventDefault();
            $('#txtSubject').val("");
            $('#txtMessage').val("");
        }
    </script>
</body>
</html>

Edited by JorgeM

0

Problem solved by adding both textbox ClientIDMode="Static" Thanks for in advance

This question has already been answered. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.