user838359
user838359

Reputation: 173

using jquery for validation

I'm pretty much new to jquery. I've been trying to do validations where i check if a textbox length is greater than 4.

So, this is what i did:

   $(document).ready(function () {

    $('#tbstreet1').blur(isValid);
                        });
   function isValid()
{
    Boolean isvalid;
   var street1Length = $("#tbstreet1").val().length;

   alert(street1Length);
     if(myLength >4)
     {
         isvalid= true;
        ActivateSave()
     }


}
function ActivateSave()
    {

   $("#btn_save").attr("Enabled",true);
   }

This is my aspx page:

   <asp:Label runat="server" ID="street1" Text="Street1" O></asp:Label> 
  <asp:TextBox ID="tbstreet1" runat="server" CausesValidation="true"  ></asp:TextBox>

 <asp:Button ID="btn_save" runat="server" Text="Save" Enabled="false" />

I even have script source in my .net page

 <script src="http://code.jquery.com/jquery-1.6.4.js"  type="text/javascript" > 
 </script>

But the thing has been that how do i call the javascript function from here? as i 'm pretty sure that my javascript is not getting called. Can u help me?

Upvotes: 1

Views: 344

Answers (3)

DWolf
DWolf

Reputation: 725

Also, if you havent made the change, if you are running your textbox at server you do need

 $('#<%= tbstreet1.ClientID %>').blur(function(){});

instead of

 $('#tbstreet1').blur(function(){});

Upvotes: 0

Juan Jimenez
Juan Jimenez

Reputation: 5842

just to add to @Daniel T.'s answer:

The blur event is sent to an element when it loses focus, to have a more accurate text change event you can use this plugin

I suggest you to use firebug to make js debug, it makes things much easier

Upvotes: 0

Daniel T.
Daniel T.

Reputation: 38380

You need to 'attach' your jQuery function to your textbox:

$('#tbstreet1').blur(isValid);

This will run the isValid function when the text field is blurred. Alternatively, you can provide an anonymous function:

$('#tbstreet1').blur(function() {
    // do something, maybe even 'isValid();'
});

This is good if the code you need to run is one-off, but if you need the function to be executed multiple times in multiple places, it's better to create a 'named' function, like in the first example.

Keep in mind that you need to put all this code inside the onReady function, which will execute only after the page is finished loading (and the DOM is ready for navigation). You can do this by simply using:

<script type="text/javascript">
    // this is a shortcut for $(document).ready()
    $(function() {
        // your code
    });
</script>

Upvotes: 3

Related Questions