jQuery.val of a select box after a load event returns old data

Question

I have a problem with jQuery I'm hoping someone can help with, I've replaced the content of a select box using jQuery's .load function, however if I then request the value of that box it returns the old data.

Currently the item selected is not in the new list, run the Ajax call

jQuery('#user').load(jsonurl + "?mode=list&select=users");
var user = jQuery('#user').val();

alert (user);  // Returns old value

Any ideas?

Thanks in advance.

`.load` takes a while to load, the value of the element won't change until the request has completed. — rorypicko, Nov 25 '13 at 22:16
What @RoryPicko92 said -- see http://api.jquery.com/load/#callback-function — Blazemonger, Nov 25 '13 at 22:17

score 3 · Accepted Answer · answered Nov 25 '13 at 22:17

3

Access the item after the load function finishes what it is doing. You may try to read the value in the callback part of load method.

jQuery('#user').load(jsonurl + "?mode=list&select=users",function(){

   // This code will execute after load finishes. So Access now  
   var user = $('#user').val();
   alert(user);

});

answered Nov 25 '13 at 22:17

Shyju

214,206
104
411
497

This is great thanks, is there a jQuery function to wait until all my Ajax functions have completed? – trevrobwhite Nov 25 '13 at 22:42

jQuery.val of a select box after a load event returns old data

1 Answers1