CODEWITHSUNDEEP
javascriptjquery
Michael
Michael

Reputation: 2187

hide() function doesn't work in jQuery

I am having problems with jQuery validation of a form.

This is my javascript file: test.js.

$(function() {
$('.error').hide();
    $(".button").click(function() {
        $('.error').hide();
  var name = $("input#name").val();
    if (name == "") {
    $("label#name_error").show();
    $("input#name").focus();
    return false;
  }
});
});

This is my html file.

<html>
<head>
<script type="text/javascript" src="test.js"></script>
<script type="text/javascript" src="jquery-1.5.2.min.js"></script>
</head>
<body>
<div id="contact_form">
<form name="contact" action="">
  <label for="name" id="name_label">Name</label>
  <input type="text" name="name" id="name" size="30" value="" class="text-input" />
  <label class="error" for="name" id="name_error">This field is required.</label>
</form> 
</div>
</body>
</html>

I placed these two files together with the jQuery file in the same directory on my server, but the content "This field is required." is still visible. It seems like hide() function in the test.js doesn't work. Can anyone point me out where is wrong? Great thanks!

Upvotes: 2

Views: 1808

Answers (1)

red-X
red-X

Reputation: 5128

Put your jquery file before your test.js.

<script type="text/javascript" src="jquery-1.5.2.min.js"></script>
<script type="text/javascript" src="test.js"></script>

Upvotes: 9

Related Questions