Initial Input Value in Javascript

Question

I have a page that is generated dynamically via the URL (GET Method). This dynamic page generates among a lot of other stuff the following line of HTML:

<input type='hidden' name='device' id='device' value='abcd' />

I am also loading several javascript functions, and I want one them to be able to read the initial value of 'device', however, it doesn't seem to be able to read the initial value on the intial page load. It will read it if the javascript function is fired again after the page load.

I am using the following code in my .js file

jQuery(document).ready(function(){
    var device = jQuery('#device').val();
});

When debugging, on the intial page load device is simply set to 'undefined' Anyone have any ideas? Thanks.

Brian

How are you debugging it? After setting it in that code example, where are you trying to read it? — Quentin
– Quentin, Commented Nov 6, 2011 at 17:56
You mean there's an $.ajax() or $.get() call occurring that's loading content, right? So it's loading asynchronously, and $.ready() is firing before the async: true loaded content loads. Have you tried setting async: false on the content loading? — Jared Farrish
– Jared Farrish, Commented Nov 6, 2011 at 18:05

Sarfraz · Accepted Answer · 2011-11-06 17:57:46Z

1

This means the element isn't available by the time you are looking for its value, you can either use onload event or put your script before </body> tag.

This should work:

$(window).load(function(){
  var device = jQuery('#device').val();
});

answered Nov 6, 2011 at 17:57

Sarfraz

384k81 gold badges561 silver badges613 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

ZenMaster Over a year ago

Isn't it already supposed to be "onloaded" bu using $(document).ready?

Sarfraz Over a year ago

@ZenMaster: As per OP, it is dynamically generated because of which one can't say for sure.

ZenMaster · Accepted Answer · 2011-11-06 18:01:08Z

1

If you load those JavaScript functions together with the HTML that you receive as a response to an AJAX request - it is possible that by the moment your JS executes this code:

jQuery(document).ready(function(){
    var device = jQuery('#device').val();
});

it refers to the existing DOM? If you don't reload your body - I don't see this event firing when you insert the received HTML into your existing DOM.

answered Nov 6, 2011 at 18:01

ZenMaster

12.8k5 gold badges40 silver badges60 bronze badges

Collectives™ on Stack Overflow

Initial Input Value in Javascript

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related