Question

Right now, my HTML code looks like so:

<div id="register">
<table class="tab2">
        <tr>
            <td>Email:</td>
            <td><input type="text" id="email" /></td>
        </tr>
        <tr>
            <td>Confirm Email:</td>
            <td><input type="text" id="confirmemail" /></td>
        </tr>
</table>
</div>

And to get the values from the inputs via jQuery, I have to do this:

$("#email").live('focusout', function() {
    email = $(this).val();
});
$("#confirmemail").live('focusout', function() {
    confirmemail = $(this).val();
});

I know there are better solutions to perform this (as my solution works, but is messy since there’s way more than two inputs), but they won’t work for me. I’d like to use something like

$("#email").val();

and just retrieve the value as it’s needed, rather than storing it to a variable. The issue is that whenever I run that code, it always returns an empty string. What would be the reason for that?

EDIT:

I forgot to mention that the values are being used after a click event is ran, like so:

$("#dialog_next").live('click', function() {

When I run the $(“#email”).val() code after that, it returns an empty string.

Answer 1

Update: This fiddle works fine: http://jsfiddle.net/yt8pK/

I expect this issue has something to do with when the code is actually run. Since I can’t see the problem code I can only guess. For example if you had like this:

 $(function () {
     var email = $("#email").val();

     function string getEmail() {
        return email;
     }

     ... (later you call getEmail to look at the value)

 });

It would fail as the variable email is set before user input.

Code like this would work:

 $(function () {

     function string getEmail() {
        var email = $("#email").val();
        return email;
     }

     ... (later you call getEmail to look at the value)

 });

What did your code which failed look like?