title: Why is the submit button on my contact form not working?
body: <p>So we have this contact form in the footer of a web page that does not work, the form validation and jquery events arent connected with the form itself.</p>
  
  <p>The javascript on the page should be attaching an event to the submit button, but it looks like this isn't working.</p>
  
  <p>Here is the jQuery:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>                jQuery(document).ready(function () { 
                      jQuery('#form_contact_form_widget_001').validationEngine('init');
  
                      jQuery('#form_contact_form_widget_001 a#contact_form_widget_001_wformsend').click(function () { 
                          var form_builder_url = jQuery('#contact_form_widget_001_wurl').val();
  
                          jQuery('#form_contact_form_widget_001 .loading').animate( {
                              opacity : 1
                          } , 250);
  
                          if (jQuery('#form_contact_form_widget_001').validationEngine('validate')) { 
                              jQuery.post(form_builder_url, { 
                                  field_003 : jQuery('#field_003').val(), 
                                  field_004 : jQuery('#field_004').val(), 
                                  formname : 'contact_form_widget_001', 
                                  formtype : 'widget' 
                              }, function () { 
                                  jQuery('#form_contact_form_widget_001 .loading').animate( { opacity : 0 }, 250);
                                  document.getElementById('form_contact_form_widget_001').reset();
                                  jQuery('#form_contact_form_widget_001').parent().find('.widgetinfo').hide();
                                  jQuery('#form_contact_form_widget_001').parent().find('.widgetinfo').fadeIn('fast');
                                  jQuery('html, body').animate( { scrollTop : (jQuery('#form_contact_form_widget_001').offset().top - 100) }, 'slow');
                                  jQuery('#form_contact_form_widget_001').parent().find('.widgetinfo').delay(5000).fadeOut(1000);
                              } );
  
                              return false;
                          } else { 
                              jQuery('#form_contact_form_widget_001 .loading').animate( { opacity : 0 }, 250);
  
                              return false;
                          }
                      } );
                  } );</code></pre>
  </div>
  </div>
  </p>
  
  <p>Any ideas why this isn't working properly?</p>
  
  <p><a href="http://medicure-html.cmsmasters.net/" rel="nofollow">http://medicure-html.cmsmasters.net/</a></p>
  
  <p>This template page has a working version of the same form.</p>