Daniel McBrearty schrieb:
> Hi
> 
> Just getting into using js to do things. I'm just experimenting right now.
> 
> Here is my example code:
> 
> 
> <p id="member_info"></p>
> 
> <script type="text/javascript">
>   function findMember(form){
>     $("#member_info").html(form.username.value);
>   }
> </script>
> 
> <form name="find_member" action="" method=GET>
>   <input type="text" size="30" name="username">
>   <input type="submit" onClick="findMember(this.form)" size="30"
> value="Find by Username">
> </form>
> 
> now what happens when I fill in a value and click is that the value I
> entered into the text box appears in the "member_info" <p> ... but
> disappears again almost straight away.
> 
> any ideas?
> 
> thanks. the lib looks nice and clean BTW.


Yes, it's because the form gets submitted and the page gets immediatly 
reloaded. That takes a little while so you still can see the page before 
the refresh with the value put into the p.

A nice and clean solution would look like this:

* stop the form from submitting
* use proper events to catch all submits, not only clicking the submit 
button (you could hit enter in the form)
* don't pollute your HTML with inline event handler attributes.
* Do you really need the name attribute for the form? It's deprecated, 
you should use id as identifier and can leave away the method, GET is 
default.

Here's my proposal:


<script type="text/javascript">
$(function {

     $('#find_member').submit(function() {
         var username = $('[EMAIL PROTECTED]"username"]', this).val();
         $('#member_info').html(username);
         return false;
     });

});
</script>

<form id="find_member" action="">
     <input type="text" name="username">
     <input type="submit" value="Find by Username">
</form>



Cheers, Klaus


_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/

Reply via email to