How to set focus on first Textbox and Clear all textbox using Jquery ?


Default_Focus
Hi

Recently i used one of the cool feature of jquery in my asp.net project with writing very few line of code.

My requirement was there to make focus on first textbox on client side and clear all textbox on reset button click. I did this task using jquery like this code.


<%@ Page Title="" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
    CodeFile="Default2.aspx.cs" Inherits="Default2" %>

<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="Server">
<script type="text/javascript" src="Scripts/jquery-1.4.1.min.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $('input:text:first').focus();

        $('#MainContent_btnReset').click(
        function () {
            $('form')[0].reset();
        });

    });

</script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="Server">
    <div>
        <fieldset style="width: 400px; height: 200px;">
            <table cellpadding="3" cellspacing="3" border="0">
                <tr>
                    <td>
                        <asp:Label ID="lblName" Text="Name: " runat="server"></asp:Label>
                    </td>
                    <td>
                        <asp:TextBox ID="txtName" Width="200px" runat="server"></asp:TextBox>
                    </td>
                </tr>
                <tr>
                    <td>s: " runat="server"></asp:Label>
                    </td>
                    <td>
                        <asp:TextBox ID="txtAddress" Width="200px" runat="server"></asp:TextBox>
                    </td>
                        <asp:Label ID="lblAddress" Text="Addres
                </tr>
                <tr>
                    <td>
                        <asp:Label ID="lblEmail" Text="Email: " runat="server"></asp:Label>
                    </td>
                    <td>
                        <asp:TextBox ID="txtEmail" Width="200px" runat="server"></asp:TextBox>
                    </td>
                </tr>
                <tr>
                    <td>
                    </td>
                    <td>
                        <asp:Button ID="btnSubmit" Text="Submit" runat="server" />
                        <asp:Button ID="btnReset" Text="Reset" runat="server" />
                    </td>
                </tr>
            </table>
        </fieldset>
    </div>
</asp:Content>


Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: