Question

I have a select element, that posts (just fine) when changed using $.post. But if I want to reload the page, and add a location.reload() then it doesn’t post. If I remove the line, it posts fine. Any ideas?

        <script type="text/javascript">
          $('#target').change(function() {
            $.post('<?=$base_url?>orders/create-new/order-items/<?=$order_id?>/target', 
              { 
                use_sort_modifier: $('select#target').val(),
                order_id: <?=$order_id?>
              } 
            );
            location.reload(); // Works without this line.
          });
        </script>

Answer 1

Ajax is asynchronous. Your reload fires before the post has had a chance to finish.

Do the reload in the post’s success event handler:

$.post('<?=$base_url?>orders/create-new/order-items/<?=$order_id?>/target', 
  { 
   use_sort_modifier: $('select#target').val(),
   order_id: <?=$order_id?>
  },
 function() { location.reload(); }
 );