JQuery Mobile: .val () not working

Question

Hi,

I have the following jQuery Mobile code:

<div data-role="content">
  A confirmation code has been sent to your mobile phone via SMS
  <br><br>
  To proceed, please enter the 3-digit confirmation code below:
  <br>
  <input id="verifySMS_code" type="text"  /><br>
  <a id="verifySMS_submit" href="#" data-role="button">Submit</a>
</div>

Here is my javascript:

$(document).ready(function(){
  $("#verifySMS_submit").live("click",function() {
    alert('hi');
    var code=$('input#verifySMS_code').val();
    alert(code);
  });
});

'hi' appears in the first notification field, however, "" appears in the second warning field, i.e. completely empty !!!

I tried document.getElementById ('verifySMS_code') also to no avail.

I even tried jquery mobile 1.0a3pre

This is a really serious problem for me, and I don’t know how to fix it.

I hope someone can help.

Thank you very much in advance,

Answer 1

• Install firebug

• Test it with

<input id="verifySMS_code" type="text" value="someoldvalue" />

and

$(document).ready(function(){
  $("#verifySMS_submit").bind("submit",function() {
    console.log($('#verifySMS_code'));
    var code=$('#verifySMS_code').val();
    console.log(code);
  });
});

That's why:

• value= the input will be displayed if it is a problem with getting the value or with putting what you enter into the input element (jquery mobile is building something on the input)
• , "#verifySMS_submit" live() there
• . , jquery mobile blur , , - ,
• console.log($('input#verifySMS_code')); . - .

---

.

: $('input').each(function(){console.log($(this).attr('id'));}); firebug, DOM, HTML.

Answer 2

. , , JQuery Mobile ("#someId")

("input[id=verifySMS_code]").val()

Answer 3

If you have a duplicate id (after loading the page or using changePage(), etc.), try to access the children of the active page object ... Ex.

var myval = $('form#src #search').val(); // returns incorrect (:first) value of the element   

replace

var myval = $.mobile.activePage.find('form#src #search').val(); 

Anyway, the form worked for me :)

Answer 4

I had the same problem on a specific page. Then I realized that I have code that calls changePage()on the same page, thereby duplicating the dom element and its identifier.