jQuery - Submit form issue

[glenelkins]

Hi

 

Can anyone see the problem here. I have included the code for a very basic form, and the jQuery.

 

The problem is in the jQuery. Where the alert is, it is showing the "username" field where the "fname" variable is. So if i have username="test" password="1234" and fname="Glen" the alert for some strange reason is showing: Username: test Password: 1234 Fname: test ???

 

Form

        <form action="javascript::void(0);" id="register_form" name="register_form">
            <fieldset>
                <table class="register_table">
                    <tr>
                        <th>Username: </th>
                        <td><input type="text" name="username" size="17" maxlength="16"  /></td>
                    </tr>
                    <tr>
                        <th>Password: </th>
                        <td><input type="password" name="password" size="17" maxlength="12"  /></td>
                    </tr>
                    <tr>
                    	<th>Re-Type Password: </th>
                        <td><input type="password" name="retypepassword" size="17" maxlength="12"  /></td>
                    </tr>
                    <tr>
                        <th>First Name: </th>
                        <td><input type="text" name="fname" size="17" /></td>
                    </tr>
                    <tr><td colspan="2" align="center"><input type="submit" value="Register" /></td></tr>
                </table>
            </fieldset>
       </form>

 

jQuery

/* jQuery for register page. */

$(document).ready ( function() {
/* START OF DOCUMENT */

/* start of register form */
$("#register_form").submit ( function() {
															   
// Get vars
username = $("input:username").val();
password = $("input:password").val();
fname = $("input:fname").val();

alert ( "Username: " + username + " Password: " + password + " Fname: " + fname );


});
/* end of register form */

/* END OF DOCUMENT */
});

[RichardRotterdam]

try  the jQuery attribute selector

 

This should prob work:

username = $("input:[name='username']").val();
password = $("input:[name='password']").val();
fname = $("input:[name='fname']").val();

[glenelkins]

ok here is a nother question.

 

how do i write a custom function in jQuery to use without a selector?? For example:

 

/* function to create a html message */
$.pg._messageToHtml = function ( message, tag ) {

return ( '<' + tag + '>' + message + '</' + tag + '>' );

}

 

now from inside thr $("#register_form").submit selector, how would i call this function so it assigns the return value to variable "messages".

 

Normal javascript would just be:  var messages = _messageToHtml ( 'Hello', 'li' );

[trq]

To use one without a selector would simply be....

 

$jQuery._messageToHtml = function ( message, tag ) {
   return ( '<' + tag + '>' + message + '</' + tag + '>' );
}

var msg = $._messageToHtml('hello','li');

[glenelkins]

nope that doesnt work. here look at my code, inside the function i put an alert() to see if its called, it doesnt!

 

/* jQuery for register page. */

$(document).ready ( function() {
/* START OF DOCUMENT */

/* function to create a html message */
$jQuery._messageToHtml = function ( message, tag ) {

alert ( message );
return ( '<' + tag + '>' + message + '</' + tag + '>' );

}
/* start of register form */
$("#register_form").submit ( function() {
															   
// Get vars
username = $("input#username").val();
password = $("input#password").val();
retypepassword = $("input#retypepassword").val();
fname = $("input#fname").val();
lname = $("input#lname").val();
dob = $("input#dob").val();
town_city = $("input#town_city").val();
state_province = $("input#state_province").val();
country = $("select#country").val();
avatar = $("input#avatar").val();
xbox_gamer_tab = $("input#xbox_gamer_tag").val();

var message = $._messageToHtml ( 'hello' ,'li' );


});
/* end of register form */

/* END OF DOCUMENT */
});