jquery get textbox text value

<script type="text/javascript">


    $(document).ready(function() {


        $('.btnSubmit').click(function(e) {
            



            alert($("#txtName").val());
        });
    });
    





</script>

I have a text box like this

<asp:TextBox ID="txtName" CssClass="txtName" runat="server" TabIndex="1" MaxLength="40"></asp:TextBox>

<asp:HiddenField ID="hfName" runat="server" />

On form load

txtName.Text = "myname";

how do i get the textbox value using jquery

somehow this did not work

thanks

Re: jquery get textbox text value

Hi Urspalshu,

If you've got an input with an id of txtEmail you should be able to use the following code to access the value of the text box:

$("#txtEmail").val()

You can also use the val(string) method to set that value:

$("#txtEmail").val("something")

Re: jquery get textbox text value

thanks for your reply . seems like my alert is not returning the value...

kindly help with sample....

thanks

Re: jquery get textbox text value

Try this. It works for me.

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title></title>
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
    <script type="text/javascript" language="javascript">
        $(function() {
            $("#Button1").click(function() {
                alert($("#Text1").val());
            });
        });
    </script>
</head>
<body>
    <input id="Button1" type="button" value="button" />
    <input id="Text1" type="text" />
</body>
</html>

Re: jquery get textbox text value

Thanks for your sample but I need to use asp TextBox and ImageButton to achieve the same. Kindly help with sample using this.

<asp:TextBox ID="txtName" CssClass="txtName" runat="server" TabIndex="1" MaxLength="40"></asp:TextBox>

<asp:ImageButton ID="btnSubmit" CssClass="btnSubmit" runat="server" ImageUrl="~/images/btnSubmit.jpg"

AlternateText="Submit" TabIndex="14" OnClick="btn_submit_Click" />

Thanks

Re: jquery get textbox text value

It's the same code but here you go.

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title></title>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" language="javascript">
$(function() {
$("#btnSubmit").click(function() {
alert($("#txtName").val());
});
});
</script>
</head>
<body>
<asp:ImageButton ID="btnSubmit" CssClass="btnSubmit" runat="server" ImageUrl="~/images/btnSubmit.jpg" AlternateText="Submit" TabIndex="14" OnClick="btn_submit_Click" />
<asp:TextBox ID="txtName" CssClass="txtName" runat="server" TabIndex="1" MaxLength="40"></asp:TextBox>
</body>
</html>

Re: jquery get textbox text value

Hi Urpalshu,

In ASPX:

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>Untitled Page</title>


    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>


    <script type="text/javascript">


        $(function()
        {
            $("#<%= btnSubmit.ClientID %>").click(function()
            {
                alert($("#<%= txtName.ClientID %>").val());
                var isPostbackRequired = false;
                /// Do your stuff to make isPostbackRequired true
                /// or false so as to postback or not


                return isPostbackRequired
                

            });
        });


    </script>


</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:TextBox ID="txtName" CssClass="txtName" runat="server" TabIndex="1" MaxLength="40"></asp:TextBox>
        <asp:ImageButton ID="btnSubmit" CssClass="btnSubmit" runat="server" ImageUrl="~/images/btnSubmit.jpg"
            AlternateText="Submit" TabIndex="14" OnClick="btn_submit_Click" />
    </div>
    </form>
</body>
</html>

In Codebehind:

using System;
using System.Collections.Generic;
using System.Text;
using System.Web.UI;


public partial class Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            txtName.Text = "myname"; 
        }
    }
    protected void btn_submit_Click(object sender, ImageClickEventArgs e)
    {
        //Do your stuff here
    }
}

Re: jquery get textbox text value

Unfortunately this method is now incorrect and will throw an exception error in the .NET compiler.

A better method is to use the name like selector of jQuery:

<asp:Textbox ID="txtTest" runat="server" />


$("input[name*='txtTest']").val():

Re: jquery get textbox text value

G0ggy

Unfortunately this method is now incorrect and will throw an exception error in the .NET compiler.

A better method is to use the name like selector of jQuery:

<div class="dp-highlighter"><div class="bar"><div class="tools">view plaincopy to clipboardprint?
</div></div>

<asp:Textbox ID="txtTest" runat="server" />

$("input[name*='txtTest']").val():
</div>
<asp:Textbox ID="txtTest" runat="server" />


$("input[name*='txtTest']").val():

Or this: $("input[id$=txtTest]").val()

That will search in reverse for the input id. Perfect for ASP.NET MasterPages

Re: jquery get textbox text value

Thank you for that tip! That saved me a lot of FindControl() / ClientID headache.