Question

I wanted to read the value entered in the text box in one of my HTML form, for this I tried jQuery val() method, but it is not working, any idea why?

HTML:

<form method="POST" id="payment-form">
   <p>
      <label class="card-number" for="txt_cardno"><span>Card Number:</span></label>
      <input type="text" size="20" autocomplete="off" class="card-number" id="txt_cardno" name="cardno" />
   </p>
   <p class="submit submit-button"><a class="btn" href="#">Charge Card</a><br><a class="btn" href="#" onClick="return false">Go Back</a></p>
   <div class="clear"></div>
</form>

Javascript:

$(document).ready(function() {
    $(".submit").live("click", function(e) {
        e.preventDefault();
        var card_num = $('.card-number').val();
        alert(card_num);
    });
});

the jsfiddle is http://jsfiddle.net/74neK/1/

Answer 1

Use the id to access it (faster):

 var card_num = $('#txt_cardno').val();