Wondering if anyone know why the 2 plugins (validate and form) would be causing a problem?
Required fields will not validate when using the form plugin for an ajaxForm, and the form does not validate when clicking submit, will even submit empty. Here is my js code(taken mostly form the examples for the plugins): $().ready(function(){ //hide the result div - for holding response form php script $("#result").hide(); //loader spinning image var loader = jQuery('<div id="loader"><img src="images/loading.gif" alt="loading..." /></div>') .css({position: "relative", top: "70px", left: "150px"}) .appendTo("#content") .hide(); //ajaxSubmit options var options = { target: '#result', success: returnHandler } //set-up form for ajax $('#contactForm').ajaxForm(options); //handle return form php - error or success function returnHandler(evt) { $('#result').show(); return false; } //ajax event handlers $("#contactForm").ajaxStart(function(){ loader.show(),$('#contactForm').hide(); }).ajaxStop(function(){ loader.hide(); }).ajaxError(function(){ //ajax error return }); //validate $('#contactForm').validate({ submitHandler: function(form) { $(form).ajaxSubmit(); }, rules: { firstname: { required: true, validaChars: true }, lastname: { required: true, validChars: true }, email: { required: true, email: true, validChars: true }, phone: { required: true, phone: true, validChars: true }, bestTime: { validChars: true }, comments: { validChars: true } }, messages: { firstname: 'please enter your first name', lastname: 'pleae enter your last name', email: { required: 'please enter your email', email: 'please enter a valid email address' }, phone: { required:'please enter your phone number', phone: 'please enter a valid phone number' } } }); });