Menu
I've got a form and a button outside the form. I want to submit the form using the button, so i have written some jquery code. Everything seems to work fine, except one thing. After submit action button's name and value aren't being send (in this case: page=2). How can I fix it? Thanks in advance for help.
$('button').on('click', function() {
$('#test-form').submit();
});<!doctype html>
<html>
<head>
<title>Test</title>
</head>
<body>
<form method="get" action="#" id="test-form">
<input type="text" name="example">
</form>
<button name="page" value="2">2</button>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</body>
<html>
593
asked Oct 15 '25 04:10
The reason the button's data won't be submitted in the form is because the button is outside the form element. To fix this, place the button before the closing </form> tag so your code looks like so:
<!doctype html>
<html>
<head>
<title>Test</title>
</head>
<body>
<form method="get" action="#" id="test-form">
<input type="text" name="example">
<button name="page" value="2">2</button>
</form>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</body>
<html>
Of course if you really wanted to add the button'a value to the handling page without the button being inside the form, you could just add this to the URL:
Instead of having
https://example.com/handler.php
As your action URL, add the button's values here:
https://example.com/handler.php?page=2
And put that in your form's action attribute like so:
<form id="testForm" method="get" action="https://example.com/handler.php?page=2">...</form>
And then the data will be submitted.
140
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
