user2812097
user2812097

Reputation: 82

html input tag always reads null in Javascript

I'm trying to try a simple login page. I add a few text fields and want to read them using javascript or jquery. The issue I'm having is that I'm getting a null error every time using javascript and a blank using jquery, even if I type text into the field.

html:

<label id='userNameLabel' class='inputLabel' for='userNameInput'>Username</label>
<input id='userNameInput' name='User' class='userInput' type='text' value=''>
<label id='passwordLabel' class='inputLabel' for='passwordInput'>Password</label>
<input id='passwordInput' name='Password' class='userInput' type='text' value=''>
<input id='submitSignIn' class='button' type='submit' value='Log In'>

js:

$(document).ready(function(){
 $('#submitSignIn').click(function(){
  $userName = $('#userNameInput').text();
  $userName = $('#passwordInput').text();
  $rememberMe = $('#rememberMe').val();
 });
})

-or

$(document).ready(function(){
 $('#submitSignIn').click(function(){
  $userName = document.getElementById(userNameInput).value;
  $userName = document.getElementById(passwordInput).value;
  $rememberMe = document.getElementById(rememberMe).value;
 });
})

Can anyone tell me why I'm having this issue?

Upvotes: 0

Views: 1447

Answers (3)

budamivardi
budamivardi

Reputation: 760

for check bus use is checked method

   $(document).ready(function(){
     $('#submitSignIn').click(function(){
      $userName = $('#userNameInput').val();
      $userPass = $('#passwordInput').val();
     })

;

Upvotes: -1

Michael Berman
Michael Berman

Reputation: 1

Your jQuery is using .text() rather than .val() - inputs are self-closing elements, hence do not have any text.

Your JavaScript is missing quote marks around userNameInput, meaning it is getting the variable userNameInput rather than the string "userNameInput".

Upvotes: 0

Quentin
Quentin

Reputation: 943569

$userName = $('#userNameInput').text();

This attempts to take the child nodes of the input and extract the text from them.

Input elements can't have any child nodes. You want val().

$userName = document.getElementById(userNameInput).value;

This attempts to get the element by the id in the string variable userNameInput, which is undeclared. You need to put quotes around it to make it a string literal.

Upvotes: 5

Related Questions