Develop Reference

Making a button that’s send you to another page

Hi i am trying to make a button that’s works like a link. I hope it makes sense, can you help?
<button type="submit" value="Login" id="next" class="login-form-submit next" href="lessonB.html">Next</button>

I am thinking you have a form you are submitting with this button. It's not the right solution in your case to add a element inside the button. Here an example of how I would do it:
<form action="https://redirect_link_here.com/foo.html" method="GET">
<input name="name">
<input name="lastname">
<button type="submit">Button name</button>
</form>
When you press the button the user input gets sent to the link you specified in action in the URL. So if the user inputs is "Andreas" and "Köhler" for instance you would be redirected to this URL on submit: https://redirect_link_here.com/foo.html?name=Andreas&lastname=Koehler. Then you can read the data out of the URL in the code of foo.html and your submit button is not messed up.

How to prevent a form from opening action url and only print when submitted?

i am building a form and when i submit it it opens the action url. I want to submit the form on click button which should not open the target url but submit the request. as well as i want to print a message after submit and form should be cleared after submit.
<form id="contact" action="https://control.msg91.com/api/sendhttp.php" method="post">
<h3>Send SMS</h3>
<h4>Build in Process</h4>
<fieldset>
<input name="authkey" type="hidden" value="auth key as required"/>
<input name="mobiles" placeholder="Mobile Number" type="text" tabindex="1" maxlength="10" required >
</fieldset>
<fieldset>
<textarea name="message" placeholder="Type your message here...." tabindex="2" maxlength="320" required></textarea>
</fieldset>
<input name="sender" type="hidden" value="FAKEin" />
<input name="route" type="hidden" value="4" />
<input name="country" type="hidden" value="0" />
<fieldset>
<button name="submit" type="submit" id="contact-submit" data-submit="...Sending">Submit</button>
</fieldset>
</form>
any help how can i do this?
also can i add a hidden text in message tab that should add to the message tab in post/get as + instead of &
eg. actionurl.php?authkey=custommade&mobiles=9999999999&message=orginal+message+hidden+message&sender=FAKEin&route=4&country=0&submit=
You can also check the source code of page https://www.tricksbygoogle.com/sms/sms.php

Basically You can't .
The only solution here I see , is using ajax query and use javascript to clear form.
This example I provide is no redirections at all. What means you page will not be reloaded.
Maybe little jquery will help.
var result_func = function(response){
if(response.allOk){
$this.reset();
}
}
$('#contact').submit(function(e){
e.preventDefault()l
var $this = $(this);
var data = $this.serialize();
$.post($this.attr('action'),data,result_func.bind($this));
});
Header location will work , but user still will be redirected.

Based on your question, and the comments it looks like you're going to have to do a little bit of research. Here are some tips though.
If you would like to include the functions from a page without actually visiting the page, than you can use what is called an include statement. This will keep the browser from visiting that page while still executing it. - http://php.net/manual/en/function.include.php
To display a message you're going to need to hide and show the element with javascript. I would suggest viewing this question - Hide div after a few seconds
Basically on submit, you're going to want to check for the variables from your form. You would run a php if statement.
Then, if those variables exist you are going to want to include your action page.
In the same if statement, you're going to want to echo a <div> with a class that has some javascript attached to it to hide it after a few seconds.
The form will automatically clear on submit.
if($variable != null){
include '/action.php' // --- you can add some GET variables to the end of this if you would like to.
echo '<div id="message">Message sent</div>'
}

ReCaptcha 2.0: enable Submit button on callback if recaptcha successful

I have a very simple form as follows. I want to make it so that the Submit button is disabled, and only enabled after the user has successfully completed the ReCaptcha.
I'm assuming I'm going to need some Javascript / jQuery to do this.
Google's documentation on ReCaptcha 2.0 seems really sparse and dense (to me, anyway). I'd appreciate some pointers:
<form action="something.php" method="post">
Name: <input type="text" size="40" name="name"><br><br>
<div class="g-recaptcha" data-sitekey="############-#####"></div>
<input type="submit" value="Submit" >
</form>

i did the same thing on my test site. however, i used a button instead of submit, so here:
you must add the property data-callback="enableBtn" data-callback property executes the function specified after accomplishment of recaptcha.
<div class="g-recaptcha" data-sitekey="############-#####" data-callback="enableBtn"></div>
and set the id of the button to whatever id you want to and set it to disabled:
<input type="button" value="Submit" id="button1" disabled="disabled">
then on javascript make a function to enable the button
function enableBtn(){
document.getElementById("button1").disabled = false;
}

Javascript button which submits Contact Form 7 form, then redirects to URL

I'm trying to make a 'Choose Your E-mail Plan' page on my website - https://godesignweb.co.uk/e-mail-services/monthly-email/ & I'm having trouble submitting the form, and then redirecting to a specific paypal page depending on what package they've chosen.
As you can see from the website it's almost there, and depending on which package you choose, it displays a different at the bottom of the page.(which I want to contain a submit button which redirects the user).
I currently have
<input type="submit" form="email" value="send">
which is outside of the contact form 7 form, and works (it's on the Pro plan) if you click it, it submits the form.
Is there anyway I can call 3 different functions for the 3 buttons which;
1) submit the form (including checking the validation that it normally does_
2) redirect the user to a paypal page
Cheers

Updated answer:
As taken from your comment to my answer, here's what you could try if you use three different submit buttons:
1.) assign each SUBMIT button a unique name:
<!-- button in starter form -->
<input type="submit" name="submit-starter" form="email" value="Send"/>
<!-- button in pro form -->
<input type="submit" name="submit-pro" form="email" value="Send"/>
<!-- button in advanced form -->
<input type="submit" name="submit-advanced" form="email" value="Send"/>
2.) On PHP side:
if (isset($_POST['submit-starter'])) {
$plan= 'starter';
$priceMonthly= 3.99;
} elseif (isset($_POST['submit-pro'])) {
$plan= 'pro';
$priceMonthly= 5.99;
} elseif (isset($_POST['submit-advanced'])) {
$plan= 'advanced';
$priceMonthly= 7.99;
}
// create the Paypal form
?>
<form name="_xclick" action="https://www.paypal.com/de/cgi-bin/webscr" method="post">
<input type="hidden" name="cmd" value="_xclick">
<input type="hidden" name="business" value="me#mybusiness.com">
<input type="hidden" name="currency_code" value="GBP">
<input type="hidden" name="item_name" value="<?php print $plan; ?>">
<input type="hidden" name="amount" value="<?php print $price; ?>">
<input type="image" src="http://www.paypal.com/en_GB/i/btn/x-click-but01.gif" border="0" name="submit" alt="Pay with PayPal">
</form>
-- previous answer --
I am not sure if I got you right because I somehow just see one (submit) button instead of three buttons so I hope my answer is not misleading or doesn't make sense in your scenario:
I assume that:
the three buttons refer to the three plans you offer
you only want to have one validation function
based on the plan selection you want to have different prices on the Paypal checkout form
The below code will only deal with the frontend control, you should definitely add a second server-based verification to make sure nobody injected/manipulated your frontend form code.
Instead of using a standard submit button, change it to:
<input type="button" onclick="formInspectAndSubmit()" value="send"/>
and add a form variable for your plan
<input type="hidden" id="input-plan" name="input-plan"/>
Your FRONTEND validation function should look like this:
function formInspectAndSubmit() {
// validation stuff ...
// retrieve the chosen plan
var plan= $('.active').prop('id');
switch (plan) {
case 'starter':
// set hidden parameters for starters
$('#input-plan').val('starter');
break;
case 'pro':
// set hidden parameters for pro
break;
case 'advanced':
// set hidden parameters for starters
break;
}
// set POST variables based on above plan and redirect to validation page; this should then forward to Paypal checkout page with price defined by chosen plan
$('#email').submit();
}

Input field with onchange fails to trigger when user click button in another form

I have a page with multiple small forms on it. Each form has one input field that has an onchange function which will submit it's form to a url that returns a no data status.
Things work fine, submitting form after form, until the user clicks on a small form that has ONLY a submit button in it. This click works, but abandons the change in the previous field resulting in its onchange not firing the click at the bottom of the changed function fails (still trying to understand the firebug trace).
What's going on? is there a fix for my structure?
UPDATE:
First I tried simply delaying the action of the submit, but no luck.
I have hidden the and added an <input button> to the chain of "events" so that the focus has a place to come to rest before the real submit tries to happen -- the code below has been updated. So the question now becomes:
Is this as simple as it can be?
Script:
$(function() {
$('input,select').change(changed);
});
function changed(){
...
$(this).parents('form').find(':submit').click();
}
function doSubmit(elt, id)
{
$(elt).focus();
setTimeout(function(){
$(id).click();
}, 400);
}
One of may small forms:
<form class="clean" method="POST" action="QuoteProApp.php">
<input type="submit" value="field" name="btn_update" style="display: none;">
<input type="hidden" value="000242" name="quote_id">
<input type="text" maxlength="15" size="3" value="" name="q[cost][4][1][unit]">
</form>
The offending click goes into this form:
<form class="clean" method="POST" action="QuoteProApp.php">
<input type="hidden" value="000242" name="quote_id">
<input type='button' name='btn_close' value='Close' onclick='doSubmit(this,"#CLOSE");'>
<input id='CLOSE' type='submit' name='btn_close' value='Close' style='display:none;'>
</form>

Might be totally irrelevant, but your selector for the change event includes your submit input too. Can you change it to:
$('input[type="text"],select').change(changed);
to see if anything changes?

The solution turned out to be to create a button tag, set the focus explicitly to a it, and then set a timeout to click the real, but hidden, submit input tag. This allows the change in focus to run the submit associated with it and then continue with the explicit submit of the page.
The question has been updated to show this solution.