Hi all I have this script

<form id="logform">
    <input class="login" name="login" type="text"><br />
    <input class="password" name="password" type="password"><br />
    <input class="submit" type="submit" value="login">
</form>

var username = $(".login").val();
var password = $(".password").val();
$(".submit").click(function() {
    alert(username);
});

and when I type text in input and click submit alert is empty ?

Hi all I have this script

<form id="logform">
    <input class="login" name="login" type="text"><br />
    <input class="password" name="password" type="password"><br />
    <input class="submit" type="submit" value="login">
</form>

var username = $(".login").val();
var password = $(".password").val();
$(".submit").click(function() {
    alert(username);
});

and when I type text in input and click submit alert is empty ?

• javascript
• jquery

Share Improve this question Follow edited Feb 21, 2014 at 6:22 alexmac 19.6k77 gold badges6464 silver badges7474 bronze badges asked Feb 21, 2014 at 6:16 Val DoVal Do 2,69544 gold badges2121 silver badges3838 bronze badges 1

• try this - jsfiddle/7mbqd2qg – Rohit Suthar Commented Sep 30, 2014 at 13:33

Add a ment  | 

6 Answers 6

Sorted by: Reset to default 4

Modify your code to assign value after submit:

$(".submit").click(function(){
    var username = $(".login").val();
    var password = $(".password").val();
    alert(username);
});

Because, value are being assigned when page is called. That is why username is empty.

Use the below script with user name within click function

$(".submit").click(function(){
var username = $(".login").val();
alert(username);
});

You are getting the user name before the click event is fired on document load, put in click event to get the value of username when click is triggered.

Live Demo

$(".submit").click(function(){
        var username = $(".login").val();
    var password = $(".password").val();
         alert(username);
});

You need to get the username/password inside the submit callback. The way you're code is written now, you're getting the username/password immediately, when they're still blank, and never getting the again.

the value of username get initialized on load so it will be always empty

$(".submit").click(function(){
alert($(".login").val()); //get the current value
});

or

$(".submit").click(function(){
    var username = $(".login").val();
    alert(username);
});

Demo Fiddle

You have taken the value before the submit click thats the issue

put the following codes inside the click function and try var username = $(".login").val(); var password = $(".password").val();

<form id="logform">
    <input class="login" name="login" type="text"><br />
    <input class="password" name="password" type="password"><br />
    <input class="submit" type="submit" value="login">
    </form>

$(".submit").click(function(){
var username = $(".login").val();
var password = $(".password").val();
alert(username);
});