ansaurus

Question

Answer 1

+2 A:

The event you're looking to trigger on is called 'blur' and can be hooked up like this:

<input type="text" name="fname" id="fname" onblur="javascript:validate_form();" />

Or in jQuery:

$(function() {
  $('#fname').blur(validate_form);
});

Now the 'validate_form' function will be hooked in to the "blur" action on your fname field.

To post code on StackOverflow highlight the code portions of your questions and answers and click the button labeled "101010" to block it as code.

Also see theraccoonbear's comment on using .html() instead of .val().

EDIT: Added jQuery version and kept old input for up-voters.

Cryo 2010-01-18 21:40:32

I like jQuery. It really makes it much easier to separate my HTML from my Javascript. That way the HTML isn't loaded with Javascript commands.

Chacha102 2010-01-18 21:48:09

Definitely. It's all I use at work and I encourage everyone I work with to pick it up as well. JavaScript is actually fun now.

Cryo 2010-01-18 22:08:48

Answer 2

A:

Cryo mentioned that you want the onblur event, but I think you'd also need to modify the code that sets the error message to use the html() and not the val() method in jQuery. e.g.

$('#p1').html("Please fill in fname");

theraccoonbear 2010-01-18 21:43:42

Answer 3

A:

onclick="return validate_form();" >

Don't put form validation code on submit-onclick. It belongs on form-onsubmit. That way you're guaranteed the code will be called however the form is submitted.

if ( document.form.fname.value == "" )

You have an id on that control, might as well use document.getElementById('fname'), or, since you appear to be using jQuery, $('#fname').val(). Either of those is unambiguous, which accessing inputs directly from the document and form objects may not be.

$('#p1').val("Please fill in fname");

val() is for form fields not text content. You want .text('message').

bobince 2010-01-18 21:45:46

Answer 4

A:

<tr>
<td>First Name</td>
<td><input type="text" name="fname" id='fname' size="30" maxlength="30" value="" ></td>
<td> <p name='p1' id='p1'></p> </td> 
</tr>


<form name="form" action="applicationform_database.php" method="GET" onsubmit="return validate_form();" >

function validate_form()
{
    if ( document.getElementById('#fname').value == "" )
    {
        $('#p1').text("Please fill in fname");
        return false;
    }
}

I tried this.But still it is not working for me.I am not so good coding and just trying to catch up the pace..so plz dont mind if i am doing minor-2 mistakes.I think everybody have to start form zero..So please correct code..

and if i use jquery i know i have to download jquery first ,but tell where i should put this code..I think if this code is suing function(validate) so it should be outside it and in head section..

$(function() {
      $('#fname').blur(validate_form);
    });

and last thing can u elaborate blur function... Please write down the code beacuse i have done evrything thyat i can do..plz once it will be more benifical for me if you write code

Deepak Narwal 2010-01-18 22:31:23

Re-posting more questions as an answer isn't going to help you, no one's going to see it. You should edit your original question and mark it as updated, detailing the changes you made since the original posting to get more help.

Cryo 2010-01-19 00:56:02

You'll want to enclose both your validate_form function as well as the jQuery code in script tags like this:<script type="text/javascript">// javascript in here</script>. The blur function is a complement to the focus function. When a field gets the focus from the mouse cursor or from tabbing the "focus" method is fired. Then, when the cursor leaves the focused field it's "blur" event is fired. Lastly you can download jQuery here: http://docs.jquery.com/Downloading_jQuery. Hope that helps.

Cryo 2010-01-19 00:58:57

Can you plz write the code as i saw u in above answer..actully sir i dont know where i am getting wrong but my code is not working..so plz once write a complete code or tell me the changes which i should make in above code

Deepak Narwal 2010-01-19 08:45:23

Answer 5

A:

<head>

<script type="text/javascript">

function validate_form()
{
    if(document.getElementById("name").value =="")
    {
        **document.getElementById("p1").innerHtml="Fill This Box";**
        return false;
    }
}   


</script>

</head>



<body>

<tr>
<td>Name</td>
<td><input type="text" id="name" size="30" OnBlur="return validate_form();"></td>
**<td><div id="p1"></div></td>**
</tr>

<tr>
<td>Password</td>
<td><input type="password" id="password" size="30" maxlength="30" value=""></td>
</tr>

</body>

As i move to second textbox keeping first empty i want(by this coading) that on right side of textbox1 error msj comes "fill this box" on onblur event of first textbox..But this is not working..Please tell me where i am falling wrong..Please write full code by making change in my code..

Deepak Narwal 2010-01-19 19:21:38

check out this plz

Deepak Narwal 2010-01-19 20:59:48

ansaurus

tags:

views:

answers:

Raising Errors on Failed Validation

HTML Code:

Validation Code:

related questions