I want to add recaptcha to a form, I registered for it and got the keys.
<form>
<input type="text" name="name" />
<input type="email" name="email" />
<textarea name="message"></textarea>
<input type="submit" name="submit" value="Send" />
</form>
Then I added this code to the page:
<script src='https://www.google.com/recaptcha/api.js?render=My_Website_Key'></script>
Next I added this Javascript/Jquery code:
//When page is loaded.
$(document).ready(function() {
grecaptcha.ready(function() {
grecaptcha.execute('The Website Key', {action: 'homepage'}).then(function(token) {});
}); //Recaptcha ready
}); //Page is loaded
Finally I'm trying to verify, But there is no hidden element with a value to use or anything to send to the backend to check.
So how to check from the backend?
Take a look at:
https://developers.google.com/recaptcha/docs/invisible
You can link it to the submit button and link it to inputs fields
Related
I am using the following form on a landing page of domain A to let users make a fast registration through domain B's API.
<form action="https://www.domainb.com/api-register" method="post" class="noajax">
<input value="" id="firstname" name="firstname" type="text" />
<input value="" id="lastname" name="lastname" type="text" />
<input value="" id="email" name="email" type="text" />
<input type="submit" value="Register" />
</form>
When form is submitted successfully, users are redirected to the full registration page of domain B, using the following code:
<script type="text/javascript">
var baseUrl = "https://www.domainb.com";
var successReg = function () {
location.href = "https://www.domainb.com/full-registration-page";
};
However, the user's info (full name + email) is not transferred to the full registration page to autofill the full registration form.
What would be the simplest way to achieve that?
With location.href you are only redirecting to that page.
If you remove all the js code, and add a submit button to the form, it will work.
OK it seems that there was a mistake on the API end and has been fixed.
Now the registration page captures the info correctly.
Thank you for your suggestions
I've got a problem regarding my contact form page. I did callback after clicking the submit button. I tried not to fill name textbox but form still submits.
My code:
function sendFeedback() {
alert("Thank you for the feedback :)");
}
<form>
<p class="font3">Name:</p>
<input name="name" type="text" maxlength="50" size="30" required/>
<br />
<p class="font3">Email:</p>
<input name="email" type="email" placeholder="" required/>
<br />
<p class="font3">Subject:</p>
<input name="subject" type="text" required/>
<br />
<p class="font3">Message:</p>
<textarea name="comment" row="80" cols="30" required></textarea>
<br>
<br>
<input type="submit" value="Submit" onclick="sendFeedback()">
<input type="reset" value="Reset">
</form>
You should change <form> to <form onsubmit="test()",where test() would go something like this:
test(e){
e.preventDefault();
/* do some validations here */
document.querySelector("form").submit();
}
Hope it helps
The form submitting and your alert triggering are two completely different things. The required attributes you have on the inputs are working correctly. If you leave any of the required inputs blank, the form will not submit to the server, instead you'll trigger standard error messaging in whatever browser you're using (usually a red outline and a popover).
The bit of JavaScript you have (i.e. your alert) will trigger regardless of whether the form submits successfully or not since it's executed BEFORE the submit goes through. You need to either do something like e.preventDefault() or return false at the end of your function, but that will prevent the form from being submitted altogether.
As #dvenkatsagar said, your best option is to change your onclick to onsubmit.
I have a HTML submit button and am trying to send hidden info to an outside form.
<form name="input" action="https://www.skinnybodycare.com/aff/join" method="post">
<input type="hidden" value="2skinnyme" name="enroller" />
<input type="hidden" value="Continue">
<input type="submit" value="Order Now">
</form>
And it has to take the user to https://www.skinnybodycare.com/aff/join and input the value and click on Continue... but can't figure it out and I'm against time here... help is very much appreciated...
I also want to say that I've already searched the forum for similar issues but couldn't find anything
The answer is: You can't pre-fill forms from outside, unless you've made code that reads values from the URL.
Here's some sample code (untested) to give you an idea of how to make the page work this way:
<form name="input" action="https://www.skinnybodycare.com/aff/join" method="post" **id="myform1"**>
<input type="hidden" value="2skinnyme" name="enroller" />
<input type="hidden" value="Continue">
<input type="submit" value="Order Now">
</form>
<script type="text/javascript">
var myvar = location.toString().replace(/[&?]2skinnyme=([^&]*)/, '$1');
document.getElementById('myform1').2skinnyme = myvar;
document.getElementById('myform1').submit();
</script>
Alternatively, you can just submit directly, from the original page, to the URL using AJAX and jquery, but that would require you to be on the same domain:
<script type="text/javascript">
$.post('https://www.skinnybodycare.com/aff/join', { enroller: '2skinnyme' }, function() {
alert('Form has been submitted');
});
</script>
i am newbie in jquery. i searched in google and i got Validation Plugin. but it's not working. i have attached jquery.validate.js in my header part.
my code looks like...
<form action="" method="" id="contact">
<div class="form-group"">
<label> Your Name </label>
<input type="text" class="form-control" placeholder="Enter Your Name" id="firstname" required="" minlength="5"/>
</div>
<div class="form-group">
<label> Your E-mail </label>
<input type="email" class="form-control" placeholder="Enter Your Email" id="email"/>
</div>
<button type="submit" class="btn btn-primary btn-lg"> Send</button>
</form>
<script type="text/javascript">
$('#contact').validate({
success: function(label){
label.addClass("has-success").text("ok");
}
});
</script>
but it's not validating my field... Can anyone say how to use it? i know i am doing something wrong here but i am newbie so...
Did you include jquery-plugin validation.js file in your project directory?? If no then you need to include http://www.websitecodetutorials.com/code/jquery-plugins/validation.js
The submit button is essencial since it fires the validate function:
$("#myform").validate({
submitHandler: function(form) { // this line is important
form.submit(); // with this line the validate function gets fired
}
});
perhaps you should also try following:
– make sure your jquery library is correctly embedded in your document
– make sure your validation.js is in the correct folder
Try using document ready instruction:
$(function(){
$('#contact').validate();
});
it works: http://jsfiddle.net/RQMaV/15/
I have two files. One is login.html which is a simple html5 file with a form.
HTML
<form method="post" action="" name="form1">entre the pasword:
<input type="password" name="code" placeholder="code" maxlength="6">
<p class="submit">
<input type="submit" name="commit" value="send" onclick="verif(document.form1.code)">
</p>
</form>
Second is my javascript file with the below code:
function verif(inputtxt) {
var pwd = "123456";
if (inputtxt.value.match(pwd)) {
window.location.href = 'Test.html';
} else {
alert('Code erron\351 ! ')
return false;
}
}
Now my problem is that when I enter my password, if it is wrong the alert message indicating an error should appear (it appears and I don't have a problem with that) and if it is correct, I should get redirected to the next page. The second part doesn't work for me.
Please help, I'm stuck with that for two days now..
Since your button is a submit button, I think it is submitting the form after the JS is done and this could be the reason why you don't get redirected to Test.html (as form action attribute doesn't have any value.) Try the below code for the HTML form and check if this solves the issue.
<form method="post" action="" name="form1" onsubmit="verif(document.form1.code);return false;">entre the pasword:
<input type="password" name="code" placeholder="code" maxlength="6">
<p class="submit">
<input type="submit" name="commit" value="send">
</p>
</form>
The return false; in the onsubmit attribute prevents the form's default submit action. The verif(document.form1.code) will be executed whenever the form is submitted (that is the submit button is clicked).