PHP Form with multiple submit buttons - javascript

I have a form with Two buttons. It's a submit form which is basically there to increase/Decrease an Integer value in a MySQL database depending on which button they click.
This is a weird scenario, the page requires an ID extension;
appinfo.php?id=12
Whenever I click one of the buttons it changes the extension to:
appinfo.php?VoteYes=Yes
Ideally I'd like it so if someone clicks on Yes it will increase a value within an SQL query and if they click no, it will decrease it.
Here is what I have so far:
<form action="<?php echo $_SERVER['PHP_SELF'] . "?id=" . $_GET['id']; ?>"/>
<input id="submit" name="VoteYes" type="submit" value="Yes" class="btn btn-success"></input>
<input id="submit" name="VoteNo" type="submit" value="No" class="btn btn-warning"></input>
</form>

In your <form> add the attribute method="post". The default is GET which is changing your URL.
So, it should be:
<form method="post" action="<?php echo $_SERVER['PHP_SELF'] . "?id=" . $_GET['id']; ?>"/>
<input id="submit" name="VoteYes" type="submit" value="Yes" class="btn btn-success"></input>
<input id="submit" name="VoteNo" type="submit" value="No" class="btn btn-warning"></input>
</form>
Then in your PHP code, check for $_POST instead of $_GET when checking for the submitted values.
Hope it helps!

If you really want the query string You can do this with hidden input that will include the id,
I also modified the names to make it less complicated
<form>
<input id="submit" name="Vote" type="submit" value="Yes" class="btn btn-success" />
<input id="submit" name="Vote" type="submit" value="No" class="btn btn-warning" />
<input name="id" type="hidden" value="<?php echo $_GET['id']?>" /></form>

Related

Multiple forms on one php page not working

So I want to add one more form on the page to insert some data in a database, but it is not working at all. Plus, it broke my first form which worked fine before.
this is the form I want to add:
<div class="overlay">
<div style="margin-top:25%;"> </div>
<form id="favForm" class="favFormClass" action="" method="post" enctype="multipart/form-data">
<input type="hidden" name="id_post_fav" value="<?php echo $row['id_post'];?>" />
<button type="submit" name="fav" style="background:transparent; border:none; cursor:pointer;"> <i class="fa fa-heart" style="font-size:60px;color:red;" aria-hidden="true"></i></button>
<form>
</div>
and this is the form from the chat area, that worked fine:
<div class="chat-box"></div>
<form action="#" class="typing-area">
<input type="text" class="incoming_id" name="incoming_id" value="<?php echo $user_id; ?>" hidden>
<input type="text" name="message" class="input-field" placeholder="Type a message here..." autocomplete="off">
<button><i class="fa fa-paper-plane-o"></i></button>
</form>
I tried applying different id for each one, but still not working. Also, I can see that the second form has action="#" (the second form is not written by me, that is why it doesn't have button type="submit" or things like that) and if I put action="something1" in the first form, it also applies to the second one... Please help

How do I submit two forms with one button? (the solutions provided by other similar issues are not working for me)

I have 2 forms (and will have more in the future) that I need to submit. Right now, when the submit button is clicked, it will only submit the form in the same collapsible section. Hence, I need a "Submit All" button outside these sections to submit all the forms.
I've tried implementing AJAX and tried out the solution from this link Submit two forms with one button , but it's still not working for me.
submitForms = function(){
document.getElementById("form1").submit();
document.getElementById("form2").submit();
}
<html>
<body>
<form id="form1" action="<?php echo htmlspecialchars(basename($_SERVER['REQUEST_URI'])); ?>" method="post">
<div style="background-color:lightblue" class="form-group <?php echo (!empty($answer_err)) ? 'has-error' : ''; ?>">
<label><?php echo $question; ?></label>
<input type="text" name="answer[]" class="form-control" value="<?php echo $answer; ?>">
<span class="help-block"><?php echo $answer_err;?></span>
<input type="hidden" name="consideration_no[]" value="<?php echo $consideration_no; ?>"/>
<input type="hidden" name="dg_no" value="<?php echo $dg_no; ?>"/>
</div>
<input type="Submit" name = "$consideration_no[]" class="btn btn-primary" onclick="submitForms()" value="Submit">
Cancel
</form>
</div>
<form id="form2" action="<?php echo htmlspecialchars(basename($_SERVER['REQUEST_URI'])); ?>" method="post">
<div class="form-group <?php echo (!empty($answer_err)) ? 'has-error' : ''; ?>">
<label><?php echo $question; ?></label>
<input type="text" name="answer[]" class="form-control" value="<?php echo $answer; ?>">
<span class="help-block"><?php echo $answer_err;?></span>
<input type="hidden" name="consideration_no[]" value="<?php echo $consideration_no; ?>"/>
<input type="hidden" name="dg_no" value="<?php echo $dg_no; ?>"/>
</div>
<input type="Submit" name = "$consideration_no[]" class="btn btn-primary" onclick="submitForms()" value="Submit">
Cancel
</form>
</div>
<input type="button" value="Submit All!" onclick="submitForms()" />
</body>
</html>
When I click on the last button to Submit All, nothing happens.
The html forms are inside php if else and while loop scripts, but I doubt that affects anything?
(I welcome other methods and ideas of submitting these two forms from a single button.)
------------UPDATE------------------------
I tried removing the actions and used this:
submitForms = function(){
document.getElementById("form1").submit();
document.getElementById("form2").submit();
}
It wouldn't work too. In my POST handler, it has a:
if($stmt->execute()){
//Records Submitd successfully. Redirect to landing page
header("location: home1.php?dm_no=".$_GET["dm_no"]);
exit();
Would the redirection have affected the AJAX not being able to submit two forms? But even if it doesn't and only is able to submit one, I would still redirect to another page. Right now, the button doesn't seem to do anything.
I think it's not possible submit two form on one click. because form redirect on given form action, so if you submitting two from with two action then system not able to redirect two different actions.
But you can achieve this by doing ajax call Like:
<input type="button" value="Submit All!" onclick="submitForms()" />
<script>
function submitForms() {
$("#form1").ajaxForm({url: 'server.php', type: 'post'})
$("#form2").ajaxForm({url: 'server.php', type: 'post'})
}
</script>

continue button and add button

I need you help, I have a form in PHP, javascript, HTML and MYSQL. I use a bootstrap for template.
I have a two button (continue button and add button)
<form class="form-horizontal form-label-left" action="PHP/GuardarMetodoque.php" method="POST" novalidate>
<div class="form-group">
<div class="btn-group btn-group-lg">
<button class="btn btn-primary" onclick="return continuar();">Continuar</button>
<button type="submit" class="btn btn-primary" onclick="return continuar();">Continuar</button>
<input type="hidden" name="metodoque" value="metodoque" />
<button type="submit" class="btn btn-primary" onclick="return continuar();">AƱadir Riesgo</button>
<input type="hidden" name="Anadirriesgo1" value="Anadirriesgo1" />
<input type="hidden" name="ID_proceso" value="<?php echo $_id; ?>">
<input type="button" class="btn btn-primary" value="Regresar" onclick="history.back(-1)" />
</div>
</div>
</form>
the continue button serves to pass another page and the add me button works to add data from the answered form.
as you see called the file "PHP/GuardarMetodoque.php" and it works but when you click continue, you save the form again, and what I want is for you to just send me the other form without saving anything
If you set button type to submit for continue button it will submit the form to mentioned action url, Try:
<button class="btn btn-primary" id="continue">Continue</button>
Add jquery to handle button click event:
$('#continue').click(function(){
//do your logic here
});

Why doesn't my POST variable arrive after this.form.submit();? [duplicate]

This question already has an answer here:
Why does this 'onClick disable=true; this.form.submit();' work on one button but not another?
(1 answer)
Closed 6 years ago.
I have a form that submits after a button is pressed. The problem is - the button that has the this.form.submit() function attached doesn't send the POST variable...
<form method= "post" action="timestable_submit.php">
<input type="hidden" name="b" value="<?php echo $f;?>">
<input type="hidden" name="c" value="<?php echo $s;?>">
<input type="submit" name="sub" id="btn" value="<?php echo $d;?>"
onclick="this.disabled=true; this.form.submit();">
<input type="submit" name="sub" id="btn2" value="<?php echo $w1e;?>">
<input type="submit" name="sub" id="btn3" value="<?php echo $w2e; ?>">
</form>
When I assign a variable from the $_POST['sub'] - I get nothing...
Any ideas? It works if I don't have the onclick="this.disable=true; this.form.submit();" line
Working fiddle.
Change button type to button instead of submit because you're submiting the form programmatically using this.form.submit() :
<input type="button" name="sub" id="btn" value="<?php echo $d;?>" onclick="this.disabled=true; this.form.submit();">
And better if you could separate your logic and use submit event :
<input type="submit" name="sub" id="btn" value="<?php echo $d;?>"/>
var form = document.forms[0];
form.addEventListener("submit", function(e){
document.getElementById('btn').disabled=true;
})
NOTE : .disabled=true; has almost no effect here because the page wil be redirected to timestable_submit.php.
Hope this helps.

HTML form method post does not work with multiple submit

HTML form method post does not work with multiple submit
I have the following
<form id="myForm" method="post" action="">
<select name="select_data">
<option value="1000">Account Demo 1</option>
<option value="1035">Account Demo 2</option>
</select>
<input type="submit" onclick="sendForm('<?php echo $domainURL;?>page_1')" form="myForm" class="btn btn-primary btn-sm" value="Page 1">
<input type="submit" onclick="sendForm('<?php echo $domainURL;?>page_2')" form="myForm" class="btn btn-primary btn-sm" value="Page 2">
<script>
function sendForm(action)
{
document.getElementById('myForm').action = action;
document.getElementById('myForm').submit();
}
</script>
I did some testing, I change method to "get" and its work, but when I change method to "post" , it not able send anything.
I tried with
print_r($_GET);
print_r($_POST);
Get was able to retrieve the send value on a select option tag.
Same code, but post doesn't send through
I tried to do post
if action="" , its work fine
but if action="http://www.myowndomain.com/subpage/page/thepage.php" it does not work for post.
Instead of Javascript, use the formaction attribute:
<input type="submit" formaction="<?php echo $domainURL;?>page_1" class="btn btn-primary btn-sm" value="Page 1">
<input type="submit" formaction="<?php echo $domainURL;?>page_2" class="btn btn-primary btn-sm" value="Page 2">
THere's also no need for form="myForm" when the submit button is inside the <form> element.
Change <input type="submit"> to type="button" I hope it will work.

Categories