Note that there are some explanatory texts on larger screens.

plurals
  1. POjQuery serialize() doesn't serializes with jQuery Validate captcha
    text
    copied!<p>It seems simple but I can't get a solution. serialize() doesn't get any form values. console.log(data) retrieves empty text in console.</p> <p><strong>Form</strong></p> <pre><code> &lt;form id="form-contact" novalidate="novalidate" method="post" action="#" role="form"&gt; &lt;fieldset class="col-xs-5"&gt; &lt;div class="form-group"&gt; &lt;label for="firstname"&gt;First name &lt;span&gt;*&lt;/span&gt;&lt;/label&gt; &lt;input type="text" class="form-control" id="firstname" name="firstname"&gt; &lt;/div&gt; &lt;div class="form-group"&gt; &lt;label for="phone"&gt;Phone&lt;/label&gt; &lt;input type="text" class="form-control" id="phone" name="phone" /&gt; &lt;/div&gt; &lt;div class="form-group"&gt; &lt;label for="captcha"&gt;Insert captcha... &lt;span&gt;*&lt;/span&gt;&lt;/label&gt; &lt;input type="text" class="form-control" id="captcha" name="captcha" /&gt; &lt;/div&gt; ..... &lt;/fieldset&gt; &lt;/form&gt; </code></pre> <p><strong>Script</strong></p> <pre><code>var formContact = $("#form-contact"); function sendContactEmail() { var data = formContact.serialize(); console.log(data); // Output: (empty) $.ajax({ url: "/wp-admin/admin-ajax.php", type: "POST", data: data + '&amp;action=sendcontactmail', cache: false, success: function (html) { ... }, error: function() { ... } }); } /* * Validation Form with jquery.validate plugin */ formContact.validate({ rules:{ ... 'captcha':{ required: true, number: true, remote: urlCaptcha // If I comment this line all works } ... }, //rules onkeyup: false, onfocusout: false, submitHandler: function() { sendContactEmail(); } }); // end Validate </code></pre> <p><strong>Instead this works</strong>:</p> <pre><code>$("footer").click(function() { var dataform = formContact.serialize(); console.log(dataform); // Output: OK, all the form values are here }); </code></pre> <p><strong>EDIT</strong>:</p> <p>Maybe I found where's the issue. It seems to be releated to jquery-validate rules. I've a rule for a captcha input in the form. If I comment the line <code>remote: urlCaptcha</code> all works, but I obviously need that line to check the captcha.</p> <p><strong>Rule</strong></p> <pre><code>'captcha':{ required: true, number: true, remote: urlCaptcha } </code></pre> <p><strong>urlCaptcha</strong> is defined in head:</p> <pre><code>&lt;script type="text/javascript"&gt;var urlCaptcha = 'http://localhost/project/wp-content/themes/my_theme/assets/js/plugins/captcha/process.php';&lt;/script&gt; </code></pre>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload