I have a checkout page http://www.oipolloi.com/oipolloi/shop/viewbasket.php with multiple ajax calls after certain items update (EG look up postage cost when country is changed, then update discount boxes etc). I've asked for help in the past about the best method of making sure ALL calls have returned before allowing the form to be submitted for payment processing:

http://stackoverflow.com/questions/2290372/how-do-i-prevent-form-submission-until-multiple-ajax-calls-have-finished-jquery

I was fairly happy that the logic in the finished solution was correct, but I have still been receiving reports that people using Safari are able to submit the form without the ajax calls returning properly.

I have tried using the Safari Web Inspector to debug but it seems that when you Inspect Element, then update an element with an ajax call, the Inspector doesn't seem to update. I am updating hidden fields, so it's hard to be able to know whether the problem lies with the DOM not being updated properly, or the Inspector itself.

I'm using Safari 4.0.5 on PC and you can reproduce the problem above by looking for a div id="countryFieldsBilling" with Web Inspector. It should contain three hidden fields that are initially empty. You can try to make it update (or not) by choosing a country from the select menu at the bottom of 'Shipping Address' box, and then clicking the 'click to use Shipping Address' link at the top of the 'Billing Address' just below.

The behaviour I am seeing is that the country chosen in the shipping select gets copied correctly to the country in the billing select, but the hidden inputs in the Web Inspector do not get updated.

When these hidden inputs do not get updated, this causes the problem that Mac Safari users report.

If you can let me know either how to get Web Inspector to work properly, or something else I may have missed in the behaviour of Mac Safari that may cause these problems, that would be great.

Thanks in advance