Run PHP code after button click but without refreshing page
Solution 1
You need to use either the onsubmit
event of the form or the onclick
event of the button.
In the event handler, you assemble a URL and "get" it. For example:
<script type="text/JavaScript">
function submitCouponCode()
{
var textbox = document.getElementById("couponCode");
var url =
"https://www.example.com/script.php?couponCode=" + encodeURIComponent(textbox.value);
// get the URL
http = new XMLHttpRequest();
http.open("GET", url, true);
http.send(null);
// prevent form from submitting
return false;
}
</script>
<form action="" onsubmit="return submitCouponCode();">
<input type="text" id="couponCode">
<input type="submit" value="Apply">
</form>
Solution 2
Use jQuery AJAX. When it's complete, refresh your page as needed.
Solution 3
You can use Jquery to do an AJAX post you your PHP script, and then use JS to change the contents of the calling page.
http://api.jquery.com/jQuery.post/
Solution 4
It's simple with jQuery. You just have to use the right tag. If you use an "a" tag the page will refresh.
<button id="MyButton">Click Me!</button>
<script>
$("#MyButton").click( function(){
$.post("somefile.php");
});
</script>
samyb8
Updated on February 13, 2020Comments
-
samyb8 over 4 years
I have a form in HTML to apply a Discount Coupon to a current shopping cart. I would like the user to just click on APPLY (after entering the coupon code) and then without refreshing the page, to have some PHP code run so it computes the corresponding discount.
Here is my form:
<form action=""> <input type="text" name="couponCode"> <input type="submit" value="Apply"> </form>
PHP to be run:
if (isset($_REQUEST['couponCode']) && $_REQUEST['couponCode']!='') { $couponCode = $_REQUEST['couponCode']; if ($couponCode == "TEST1") { $discount=0.2; } }
How would this be done using javascript?
-
moonwave99 about 11 yearsYou don't need a
POST
for that, but aGET
.