Replace an input hidden value before submitting a form with some value fetched via Ajax
<p>I have the following submit handler which should lookup for some value based on the user input (key) and update an hidden field with the fetched value, before submitting the form.</p>

<pre><code>$('#my_form').submit(function() {
  $.ajax({
    url: "lookup.php?key=" + $('#key').val(),", // Read one of the user input and lookup
    dataType: 'json',
    success: function(data){
     console.log(data); // Shows the expected result
     $('#my_form').find('input[name="xxx"]').val(data); // Substitute the hidden xxx with the fetched data
     return true;
    }
  });
  console.log($('#my_form').find('input[name="xxx"]')); // Still the old value here
  return true;
});
</code></pre>

<p>Unfortunately, the final submitted form seems to contain the old value, as shown in the console.log. Given I'm very new to JS, I guess I'm missing something very basic here.</p>
