JavaScript works in all browsers but Safari?

http://www.forfuturesale.com/properties/detached-newer-one-floor-condo/

At the page above, at the bottom, there is a button that says “E-mail Seller”. This loads a small contact form in a jQuery fancyBox (lightbox).

The following script (form-handler.js) is meant to handle the form to and from the form-handler.php.


jQuery(document).ready(function(){
	
	jQuery('#contact-seller-form').submit(function(){
	
		var action = $(this).attr('action');

		jQuery("#message").slideUp(750,function() {
		jQuery('#message').hide();			
		
		jQuery.post(action, { 
			buyer_name: jQuery('#buyer_name').val(),
			buyer_email: jQuery('#buyer_email').val(),
			buyer_message: jQuery('#buyer_message').val(),
			seller: jQuery('#seller').val(),
			refnum: jQuery('#refnum').val()
		},
			function(data){
				document.getElementById('message').innerHTML = data;
				jQuery('#message').slideDown('slow');
				jQuery('#contact-seller-form img.loader').fadeOut('fast',function(){$(this).remove()});
				jQuery('#contact-seller-form #submit').attr('disabled',''); 
				//if(data.match('success') != null) $('#contactform').slideUp('slow');
			}
		);
		
		});
		return false; 
	});	
});

Everything works fine in Firefox, IE and Chrome. However in Safari, it’s like the contents of form-handler.js are not there, its not doing anything. Using Safaris dev tools you can clearly see the script has loaded fine.

Any help would be greatly appreciated.

Cheer :slight_smile:

Personally rather then using return false i would use the following to prevent the form running its normal action event.

jQuery('#contact-seller-form').submit(function(e){
    e.preventDefault();
    
    // continue...
});

That is the only thing i can see that would let the form continue normally.

Zing. Unfortunately modifying my code like you suggested did not help. Everything still works fine in all browsers except Safari.

The confirmation message should be appearing dynamically under the form via the javascript, however it is loading in a new windown but again, only in Safari.

Is anyone aware of any quirks when it comes to Safari and javascript I may be overlooking?

Cheers :slight_smile:

Okay try this

jQuery('#contact-seller-form').live('submit', function(){}

That fixed it!!! You da man!

Thanks a lot for you help.

No problem

Any chance you can help me understand why this works?

When i looked at how your modal window worked i saw Ajax requests which inputted the form that everyone sees, once i saw that i said to use the .[B]live/B method because it seeks out DOM elements that are not part of the original DOM structure where as the .[B]submit/B method can only seek out DOM elements that are part of the pre-existing DOM.

I had the same trouble when i first started with Ajax and form submissions but after a while you start to understand what works better with Ajax.

Awesome. Thanks a lot. I really appreciate your help.

Cheers