Databases
StackOverflow2013
Postsdbo
POAdding reCaptcha to this jQuery AJAX form
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POAdding reCaptcha to this jQuery AJAX form
    primarykey
    data
    text
    <p>I am having some problems adding a <strong>reCaptcha</strong> to my jQuery AJAX form.</p> <p>I have tried following the documentation, in particular <a href="https://developers.google.com/recaptcha/docs/display" rel="nofollow">this page</a>, but had no luck.</p> <ul> <li>If I use the "Challenge and Non-JavaScript API", adding the code before the send button, I get no output.</li> <li>If I try with the method called "AJAX API" adding a custom div inside the form, I don't get anything anyway. Basically I am not able to show and then validate it.</li> </ul> <p>This is the code that I have so far.</p> <p>My form: </p> <pre><code> &lt;div id="contactForm"&gt;&lt;img src="img/contact-form.png" width="250" height="365" alt="contact" /&gt;&lt;/div&gt; Name: &lt;span class="contactErrorFloat" id="err-name"&gt;Need the name&lt;/span&gt; &lt;input name="name" id="name" type="text" placeholder="Name.." /&gt; Email: &lt;span class="contactErrorFloat" id="err-email"&gt;Need email&lt;/span&gt;&lt;span class="contactErrorFloat" id="err-emailvld"&gt;Email not valid.&lt;/span&gt; &lt;input name="email" id="email" type="text" placeholder="Email.." /&gt; Message: &lt;textarea name="message" id="message" rows="10" placeholder="Message.."&gt;&lt;/textarea&gt; &lt;button id="send"&gt;Send&lt;/button&gt; &lt;div class="contactError" id="err-form"&gt;Error during validation&lt;/div&gt; &lt;div class="contactError" id="err-timedout"&gt;Timeout&lt;/div&gt; &lt;div class="contactError" id="err-state"&gt;&lt;/div&gt; &lt;div id="ajaxsuccess"&gt;Email sent!&lt;/div&gt; &lt;/form&gt; </code></pre> <p>My Script:</p> <pre><code>jQuery(document).ready(function ($) { $('#send').click(function(){ $('.error').fadeOut('slow'); // Resetta i messaggi di errore, nascondendoli var error = false; var name = $('input#name').val(); if (name == "" || name == " ") { $('#err-name').fadeIn('slow'); error = true; } var email_compare = /^([a-z0-9_.-]+)@([da-z.-]+).([a-z.]{2,6})$/; var email = $('input#email').val(); if (email == "" || email == " ") { $('#err-email').fadeIn('slow'); error = true; } else if (!email_compare.test(email)) { $('#err-emailvld').fadeIn('slow'); error = true; } if (error == true) { $('#err-form').slideDown('slow'); return false; } var data_string = $('#ajax-form').serialize(); $.ajax({ type: "POST", url: $('#ajax-form').attr('action'), data: data_string, timeout: 6000, error: function(request, error) { if (error == "timeout") { $('#err-timedout').slideDown('slow'); } else { $('#err-state').slideDown('slow'); $('#err-state').html('C\'è stato un errore: ' + error + ''); } }, success: function () { $('ajax-form').slideUp('slow'); $('#ajaxsuccess').slideDown('slow'); } }); return false; }); }); </code></pre> <p>There is also a PHP file with the php function to send the email but I don't think it's much important actually. I would really LOVE if someone could give me any help to implement this. Thanks a lot!</p>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. This table or related slice is empty.
    1. USwiredmark
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

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