How should I check in php if checkbox is checked after button was clicked?
I tried to do like this, but nothing happens. It returns the answer of my first condition. I tried to put "checked" property on one of checkboxes, but code still doesn't work...
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
$('#refreshList').on('click', function() {
var url = 'admin/thisPage.php';
$('#div1-wrapper').load(url + ' #div1');
});
});
</script>
</head>
<body>
<div>
<input type="checkbox" name="active_registration" id="active_registration" value="" > active registration
<input type="checkbox" name="coming_events" id="coming_events" value="" /> Comming events
<button type="button" class="btn btn-primary" id=refreshList>refresh</button>
</div>
<div id="div1-wrapper">
<div id="div1">
<?php
if ( !isset($_POST["active_registration"]) && !isset($_POST["coming_events"])) {
echo "false/false";
}
if ( isset($_POST["active_registration"]) && !isset($_POST["coming_events"])) {
echo "true/false";
}
if ( !isset($_POST["active_registration"]) && isset($_POST["coming_events"])) {
echo "false/true";
}
if ( isset($_POST['active_registration']) && isset($_POST['coming_events'])) {
echo "true/true"
}
?>
</div>
</div>
</body>
</html>
Related
I have been working on a multi-form page for a while. I need some help trying to understand why when I unset my variable that the multi-form pages ceases to work correctly. I placed an echo statement in the code to track the variable value and even after a page refresh the variable stays. I literally, have to delete the cookies for the site in order for the variable to be unset.
Here is the code:
<?php
session_start();
// Start the session
echo $_SESSION["formatPickleball"];
$_SESSION["Pickleball"] = "";
// Submit button is pressed
if (isset($_POST['format1']))
{
$_SESSION["formatPickleball"] = $_POST['member'];
$_SESSION["Pickleball"] = "hide";
}
if ($_SESSION["formatPickleball"] == "Captain") {
$regCAP = "";
// Submit button is pressed
if (isset($_POST['submitCAP']))
{
$regCAP = "show";
}
$secondCAP = "";
// Submit button is pressed
if (isset($_POST['submit2']))
{
$secondCAP = "show";
}
$thirdCAP = "";
// Submit button is pressed
if (isset($_POST['submit3']))
{
$thirdCAP = "show";
}
} elseif ($_SESSION["formatPickleball"] == "Player") {
$regPlay = "";
// Submit button is pressed
if (isset($_POST['submitPlay']))
{
$regPlay = "show";
}
}
?>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.8.7/chosen.jquery.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.8.7/chosen.min.css">
<script type="text/javascript"></script>
<body>
<div id="mainForm">
<h4>Are you a Captain or a Player on a Team?</h4>
<form method='POST'>
<input type="radio" name="member" value="Captain">Captain
<input type="radio" name="member" value="Player">Player<br>
<input type="submit" name="format1" value="Select">
</form>
</div>
<div id="firstForm-CAP">
<h4>Captain's Registration Form - Page 1</h4>
<form method='POST'>
<input type="submit" name="submitCAP" value="Step 2" Style = "color:white; background-color:blue" required>
</form>
</div>
<br>
<div id="secondForm-CAP">
<h4>Captain Registration Form - Page 2</h4>
<form method='POST'>
<input type="submit" class="pull-left" name="submit2" value="Next Step" Style = "color:white; background-color:blue">
</form>
</div>
<div id="thirdForm-CAP">
<h4>Captain's Registration Form - Page 3</h4>
<form method='POST'>
<input type="submit" class="pull-left" name="submit3" value="Next Step" Style = "color:white; background-color:blue">
</form>
</div>
<div id="paypalForm-CAP">
<h4>Captain's Registration Form - Last Page 4</h4>
</div>
<div id="firstForm-Play">
<h4>Player Registration Form - Page 1</h4>
<form method='POST'>
<input type="submit" name="submitPlay" value="Next" Style = "color:white; background-color:blue" required>
</form>
</div>
<br>
<div id="secondForm-Play">
<h4>Player Registration Form - Last Page 2</h4>
</div>
</body>
<?php
if($_SESSION["Pickleball"]!="" && $_SESSION["formatPickleball"] == "Captain"){
?>
<script type="text/javascript">
$("#mainForm").hide();
$("#firstForm-CAP").show();
$("#secondForm-CAP").hide();
$("#thirdForm-CAP").hide();
$("#paypalForm-CAP").hide();
$("#firstForm-Play").hide();
$("#secondForm-Play").hide();
</script>
<?php
}elseif($regCAP!=""){
?>
<script type="text/javascript">
$("#mainForm").hide();
$("#firstForm-CAP").hide();
$("#secondForm-CAP").show();
$("#thirdForm-CAP").hide();
$("#paypalForm-CAP").hide();
$("#firstForm-Play").hide();
$("#secondForm-Play").hide();
</script>
<?php
}elseif($secondCAP!=""){
?>
<script type="text/javascript">
$("#mainForm").hide();
$("#firstForm-CAP").hide();
$("#secondForm-CAP").hide();
$("#thirdForm-CAP").show();
$("#paypalForm-CAP").hide();
$("#firstForm-Play").hide();
$("#secondForm-Play").hide();
</script>
<?php
}elseif($thirdCAP!=""){
?>
<script type="text/javascript">
$("#mainForm").hide();
$("#firstForm-CAP").hide();
$("#secondForm-CAP").hide();
$("#thirdForm-CAP").hide();
$("#paypalForm-CAP").show();
$("#firstForm-Play").hide();
$("#secondForm-Play").hide();
</script>
<?php
}elseif($_SESSION["Pickleball"]!="" && $_SESSION["formatPickleball"] == "Player"){
?>
<script type="text/javascript">
$("#mainForm").hide();
$("#firstForm-CAP").hide();
$("#secondForm-CAP").hide();
$("#thirdForm-CAP").hide();
$("#paypalForm-CAP").hide();
$("#firstForm-Play").show();
$("#secondForm-Play").hide();
</script>
<?php
}elseif($regPlay!=""){
?>
<script type="text/javascript">
$("#mainForm").hide();
$("#firstForm-CAP").hide();
$("#secondForm-CAP").hide();
$("#thirdForm-CAP").hide();
$("#paypalForm-CAP").hide();
$("#firstForm-Play").hide();
$("#secondForm-Play").show();
</script>
<?php
}else{
?>
<script type="text/javascript">
$("#mainForm").show();
$("#firstForm-CAP").hide();
$("#secondForm-CAP").hide();
$("#thirdForm-CAP").hide();
$("#paypalForm-CAP").hide();
$("#firstForm-Play").hide();
$("#secondForm-Play").hide();
</script>
<?php
}
?>
<script type="text/javascript">
$(".chosen").chosen();
</script>
</html>
When I add a $_SESSION["formatPickleball"] = ""; to the top of the php code, the multi-form fails to work correctly.
I have two questions 1) How can I unset variable without having to delete cookies? 2) is this the most efficient way to write this code in PHP?
Values stored in the session must be discarded at the end of the script execution.
Destroy $_SESSION using unset($ _ SESSION)
and
then destroy the session itself using session_destroy();
I was able to clear the variable by using a windows popup once an if statement was fullfilled.
if ($Num_CTeams > 1 && $_SESSION["Pickleball"] !="") {
echo '<script language="javascript">';
echo 'alert("Sorry, Captains can only captain up to two teams ONLY.")';
echo '</script>';
$_SESSION["formatPickleball"] = "";
}
<?php
session_start();
echo $_SESSION["formatPickleball"];
$_SESSION["Pickleball"] = "";
if (isset($_POST['format1']) && $_POST['format1'] && isset($_POST['member']) && $_POST['member']) {
$_SESSION["formatPickleball"] = $_POST['member'];
$_SESSION["Pickleball"] = "hide";
}
if ($_SESSION["formatPickleball"] == "Captain") {
$regCAP = isset($_POST['submitCAP']) && $_POST['submitCAP'] ? "show": "";
$secondCAP = isset($_POST['submit2']) && $_POST['submit2'] ? "show": "";
$thirdCAP = isset($_POST['submit3']) && $_POST['submit3'] ? "show": "";
}
if ($_SESSION["formatPickleball"] == "Player") {
$regPlay = isset($_POST['submitPlay']) && $_POST['submitPlay'] ? "show" : "";
}
What is the best way to ensure that a logic test on a self-referencing PHP form correctly identifies the HTML button used to submit the form, when that form is actually submitted via jquery.submit() -rather than by a click of the button itself?
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title> Total Tutor </title>
<link type="text/css" rel="stylesheet" href="course.css">
<script src="../jquery.js"></script>
</head>
<body>
<script>
$(document).ready(function() {
//event that triggers the javascript/jquery form submission
$('li').dblclick(function()
{
selectedCourse=$(this).text();
sessionStorage.removeItem('selectedCourse');
sessionStorage.setItem('selectedCourse', selectedCourse);
editForm();
});
//the function called by the normal button submission and the alternative jQuery only submission: note the non jQuery one sets the $-POST variable fine
function editForm() {
var s= confirm( 'Would you like to edit ' +selectedCourse+ '');
if(s)
{
alert('form is called');
}
}
$('#edit-button').click(function() { editForm(); });
});
</script>
<?php
if(!isset($_POST['submit']))
{
?>
<ul>
<li>Maths</li>
<li>English</li>
</ul>
<form id="edit_delete" method="POST" action=" <?php echo $_SERVER['PHP_SELF']; ?>">
<button type="submit" id="edit-button" name="submit" value="edit" ><img src="../images/pencil.png"></button>
<button type="submit" id="delete-button" name="submit" value="delete" ><img src="../images/deleteo.png"></button>
</form>
}
<?php
else
{
if($_POST['submit']=='edit')
{
?>
<p>Thank you for selecting edit</p>
<?php
}
if($_POST['submit']=='delete')
{
?>
<p>Thank you for selecting delete</p>
<?php
}
}
?>
</body>
</html>
Use a variable to indicate how the data was posted.
In your html form:
<input type="hidden" name="wasClicked" id="wasClicked" value="1" />
In your jQuery:
$('#wasClicked').val("0");
Then in your PHP, test $_POST['wasClicked'] to see if it is 0 or 1
Can somebody please explain why this code does not allow my imploded variable separated by commas does not work when I surround it in a table or many div format.
The code works when I remove it from within the table. I also tested it with elements of the form within other divs and that failed to. It only works when its a HTML form on its own.
Summary: I want engineers output like. john,derek,peter et al.... At the moment it only gives my the top line
<?php
$eng = array();
$test = $_POST['test'];
$eng = implode(',',$_POST['engineers']);
?>
<html>
<head>
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.0/jquery-ui.js"></script>
<script>
$(document).ready(function(){
//when the Add Filed button is clicked
$("#add").click(function (e) {
//Append a new row of code to the "#items" div
$("#items").append('<div><input type="text" name="engineers[]"><button class="delete">Delete</button></div>');
});
$("body").on("click", ".delete", function (e) {
$(this).parent("div").remove();
});
});
</script>
</head>
<body>
<?php echo $eng; ?>
<div class="form_table">
<table>
<form method="post">
<tr><th><label for="engineers">Engineers</label></th><td>
<button type="button" id="add">Add Another Engineer</button>
<div id="items">
<div><input type="text" name="engineers[]"></div>
</div>
</td></tr>
<tr><th colspan="2"><input type="submit" name="" value="Add Job" class="submit" /></th></tr>
</form></table>
</body>
</html>
One thing to point out is that always process form input when the form is submitted.
And your markup is a little bit wrong, its the other way around. The table must be inside the form.
<?php
// handle form inputs when the form is submitted
if($_SERVER['REQUEST_METHOD'] == 'POST') {
$eng = implode(',', array_filter($_POST['engineers']));
echo $eng;
}
?>
<div class="form_table">
<!-- form must wrap the table -->
<form method="POST">
<table>
<tr>
<th><label for="engineers">Engineers</label></th>
<td>
<button type="button" id="add">Add Another Engineer</button>
<div id="items">
<div><input type="text" name="engineers[]" /></div>
</div>
</td>
</tr>
<tr>
<th colspan="2">
<input type="submit" name="" value="Add Job" class="submit" />
</th>
</tr>
</table>
</form>
</div>
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.0/jquery-ui.js"></script>
<script>
$(document).ready(function(){
//when the Add Filed button is clicked
$("#add").click(function (e) {
//Append a new row of code to the "#items" div
$("#items").append('<div><input type="text" name="engineers[]"> <button class="delete">Delete</button></div>');
});
$("body").on("click", ".delete", function (e) {
$(this).parent("div").remove();
});
});
</script>
Sample Output
put your form outside the table becase table tag can include tr tags not form tag
Ex:
<?php
$eng = array();
$test = $_POST['test'];
$eng = implode(',',$_POST['engineers']);
?>
<html>
<head>
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.0/jquery-ui.js"></script>
<script> $(document).ready(function(){
//when the Add Filed button is clicked
$("#add").click(function (e) {
//Append a new row of code to the "#items" div
$("#items").append('<div><input type="text" name="engineers[]">
<button class="delete">Delete</button></div>');
});
$("body").on("click", ".delete", function (e) {
$(this).parent("div").remove();
});
});
</script>
</head>
<body><?php
echo $eng;
?>
<div class="form_table">
<form method="post">
<table>
<tr><th><label for="engineers">Engineers</label></th><td>
<button type="button" id="add">Add Another Engineer</button>
<div id="items">
<div><input type="text" name="engineers[]"></div>
</div>
</td></tr>
<tr><th colspan="2"><input type="submit" name="" value="Add Job" class="submit" /></th></tr>
</table>
</form>
I have a php page, wich hase some external links to js files in the head, and on body I have some selectable elements from jquery(sometimes I do not have them, because thouse elements are generated if the user is login). The problem is in the javascript I wrote, I get this error: TypeError: Object [object Object] has no method 'disableSelection'. Even if I put a ".sortable" element in the php, I still get this error. In html looks like it has no problem with that and works fine. The code that gives me the error is this:
Sorry for my english. I can put the hole code if you want but is too big. I think the problem is because the javascript is loading too fast or before of the html is generated.( I tried to put a variable in the js and that function under a if() but is not working)
The javascipt(scripturi.js):
var logat=0;
$(document).ready(function() {
$( ".sortable0" ).sortable();
$( ".sortable0" ).disableSelection();
$( ".sortableIt" ).disableSelection();
$( ".sortableIt" ).sortable(
{
stop: function(event, ui)
{
for(var i=0;i<ui.item.parent().children().length;i++)
{
var x =ui.item.parent().children()[i].id;
//update items din acest sertar
//updateItemServer(x,i)
//alert(x+ " " + i);
}
}
});
$( ".sortable" ).disableSelection();
$( ".sortable" ).sortable({ stop: function(event, ui) {reparaZindex();}});
});
function updateItemServer(x,i){
//alert(x+" "+i);
}
function incarca(){
$(document).ready(function (){
$.getJSON("http://students.info.uaic.ro/~calin.chifan/api/compartiment/list.json", function(data){
var html = [];
/* loop through array */
$.each(data, function(index, d){
addCompartiment(d.nume_comp,d.id);
});
}).error(function(jqXHR, textStatus, errorThrown){ /* assign handler */
alert("error occurred!");
});
});
}
function addCompartiment(nume,id){
$("#sortable0").append('<ul class="sortable" id'+ +'>');
}
function updateIndexServer(x,y){
//alert(x+" "+y);
//trimite id-ul x si pozitia y
}
function reparaZindex(){
$.each($(".sortable > li"), function()
{
if($(this).find('.sertar')[0])
{
$(this).find('.sertar').eq(0).css('z-index',(500-$(this).index()*2));
updateIndexServer($(this).find('.sertar')[0].id,$(this).index())
}
if($(this).find('.sortableIt')[0])
$(this).find('.sortableIt').eq(0).css('z-index',(501-2*$(this).index()));
});
}
window.onload = function() {
//incarca();
//reparaZindex();
}
It's strange that in the html I don't have this problem. After the user is logedin I want to call a function that will append some ul (.selectable) elements but so far it can't even notice that there are some elements. If you want I can give you a link to the page I work.
A little bit of the php:
<?php
ini_set('session.save_path', '/tmp/');
session_start();
$logged=0;
if(isset($_SESSION['autentificat']))
{
if($_SESSION['autentificat']==1)
$logged=1;
}
$user= $_COOKIE['user'];
echo'
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<!DOCTYPE html>
<html>
<head>
<title>Proiect Web</title>
<meta charset="utf8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>jQuery Dropdown Login Freebie | The Finished Box</title>
<link rel="stylesheet" type="text/css" href="main.css">
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script src="login.js"></script>
<script src="scripturi.js"></script>
<script src="dulap.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<script src="login.js"></script>
</head>'
;
if($logged==1)
{
echo'<body onload="loadYeslog()">';
}
else {
echo'<body onload="loadNoLog()">';
}
echo
'<div class="mainbar">
<div id="loginContainer">
<div id="loginButton"><span style="display:block;width:48px;height:27px; ">Login</span></div>
<div id="logoutButton" class="barbutton" style"cursor:pointer;"><span>Logout</span></div>';
if($logged==0)
{
echo'<div id="welcomeLabel" class="barbutton"><span>Not Logged in!</span></div>';
}
else
{
echo '<div id="welcomeLabel" class="barbutton"><span>Welcome '.$user.' !</span></div>';
}
echo '<div style="clear:both"></div>
<div id="loginBox">
<form id="loginForm" action="autentificare2.php" method="POST">
<fieldset id="body">
<fieldset>
<label for="username">
Username</label>
<input type="text" name="user"/>
</fieldset>
<fieldset>
<label for="password">Password</label>
<input type="password" name="password"/>
</fieldset>
<input type="submit" id="login" value="Sign in" />
<label for="checkbox"><input type="checkbox" id="checkbox" />Remember me</label>
</fieldset>
<span>Forgot your password?</span>
<div id="regbut"><span>New user ? </span></div>
</form>
</div>
<div id="regbox">
<form id="registerform" action="register.php" method="POST">
<table style="margin-top:10px;">
<label for="Dusername">
REGISTAR FOARM!!! </label>
<tr>
<td>
<label for="Dusername">
Username: </label>
</td>
<td>';
?>
<input type="text" name="Duser" placeholder="Introduceti numele de cont dorit" onblur="javascript:semnaleazaExistaNume (this.value, '')" />
</td>
<td>
<span class="ascuns" id="eroareNume">Numele deja exista, alegeti altul... </span>
</td>
</tr>
<tr>
<td>
<label for="Dpassword">
Password: </label>
</td>
<td>
<input type="password" name="Dpassword"/>
</td>
</tr>
<tr>
<td>
<label for="Demail">
E-Mail: </label>
</td>
<td>
<input type="text" name="Demail"/>
</td>
</tr>
<tr>
<td>
<input type="submit" id="register" value="Register" />
</td>
</tr>
</fieldset>
</table>
</form>
</div>
</div>
</div>
<div class="box">
<ul class="sortable0" id="sortable0">
<ul class="sortable" id="sortableColona1">
<li id="sertar1" style="z-index:10">
<img id="sertar11" class="sertar" ONCLICK="openS(this)" style="position: relative;z-index:500;aligh:center;" src="img/sertar1.png">
<ul id="ui items1" style="z-index:501;position:relative;visibility:hidden;" class="sortableIt" >
<li id="item1" class="ui-state-default">1</li>
<li id="item2" class="ui-state-default">2</li>
<li id="item3" class="ui-state-default">3</li>
<li id="item4" class="ui-state-default">4</li>
<li id="item5" class="ui-state-default">5</li>
<li id="item6" class="ui-state-default">6</li>
<li id="item7" class="ui-state-default">7</li>
<li id="item8" class="ui-state-default">8</li>
<li id="item9" class="ui-state-default">9</li>
<li id="item10" class="ui-state-default">10</li>
<li id="item11" class="ui-state-default">11</li>
<li id="item12" class="ui-state-default">12</li>
</ul>
</li>
</ul>
</div>
</body>
</html>
You need to place the jQuery code in the $(document).ready(); function and then it will run only when the page loads like so:
$(document).ready(function() {
// your code here
});
This will make sure it only runs when the page and all the DOM elements have completely loaded.
UPDATE:
Can you add the following code in your HTML head section as you need jQuery UI to make the relevant method call:
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
Make sure you include it after you have loaded jQuery, so the head section code should be like:
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<script src="login.js"></script>
<script src="scripturi.js"></script>
<script src="dulap.js"></script>
<script src="login.js"></script>
First thing is to make sure you have jQueryUI loaded since the method you are calling belongs to its API. We can take things forward from there!
Your code does not include jquery ui anywhere! You just include JQuery, not the JQuery UI part. The Sortable is part of the jquery ui. Check it out at: http://jqueryui.com/sortable/ If you include it correctly it is not problem if you have a element on your page which responds to the selector or not. Just make sure, that you include the correct library.
You need to add jQueryUI. Please add below code to after jquery section.
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
I have the following HTML code:
<form method="post" action="the_file.php" id="the-form">
<input type="text" name="the_input" value="<?php if ( isset( $_POST['the_input'] ) echo $_POST['the_input]; ?>">
<button type="submit" name="eat_something" value="TRUE">Eating</button>
<button type="submit" name="eat_something" value="FALSE">Don't Eat</button>
</form>
<textarea id="result"></textarea>
Followed by this JS:
$('#the-form').bind('submit', submitForm);
function submitForm(evt) {
jQuery.post(
$(this).attr('action'),
$(this).serialize(),
function(data) {
$('#result').empty().append(data).slideDown();
});
evt.preventDefault();
}
I also have a PHP script that receives the $_POST value from the input on submit and runs a conditions to test which submit button was clicked.
Like this:
$input = $_POST['the_input'];
$eating = $_POST['eat_something'];
if ( $eating == 'TRUE' ) {
// Do some eating...
} else {
// Don't you dare...
}
If I don't use the jQuery.post() function the submit values from the button are posted. However, for some reason, I can't manage to pass the button value to PHP $_POST with the jQuery.post() function. If I don't use jQuery.post() the output doesn't get appended to the textarea but rather in a text format on a separate page, like a document. I've also tried calling the submit function on the button $('button[type=submit]').bind('submit', submitForm); but this doesn't solve my problem either.
Thanks in advance for you help.
You forget signle quote and ) in the_name input.
<input type="text" name="the_input" value="<?php if (isset($_POST['the_input'])) { echo $_POST['the_input'] ; } ?>">
and for getting form button pressed value you need to append it value manually to serialize.
$form.serialize() + "&submit="+ $('button').attr("value")
Example
<script type="text/javascript">
$(function()
{
$('button[type="submit"]').on('click',function(e)
{
e.preventDefault();
var submit_value = $(this).val();
jQuery.post
(
$(this).attr('action'),
$(this).serialize()+ "&submit="+ submit_value,
function(data)
{
$('#result').empty().append(data).slideDown();
}
);
});
});
</script>
Complete Tested Code
<?php
if(isset($_POST['the_input']))
{
$input = $_POST['the_input'];
$eating = $_POST['eat_something'];
exit;
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<title>StackOverFlow</title>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
$(function()
{
$('button[type="submit"]').on('click',function(e)
{
e.preventDefault();
var submit_value = $(this).val();
jQuery.post
(
$('#the-form').attr('action'),
$('#the-form').serialize()+ "&eat_something="+ submit_value,
function(data)
{
$('#result').empty().append(data).slideDown();
}
);
});
});
</script>
</head>
<body>
<form method="post" action="random.php" id="the-form">
<input type="text" name="the_input" value="<?php if (isset($_POST['the_input'])) { echo $_POST['the_input'] ; } ?>">
<button type="submit" name="eat_something" value="TRUE">Eating</button>
<button type="submit" name="eat_something" value="FALSE">Don't Eat</button>
</form>
<textarea id="result"></textarea>
</body>
</html>
Simplest answer would be:
<form method="post" action="the_file.php" id="the-form">
<input type="text" name="the_input" value="<?php if ( isset( $_POST['the_input'] ) echo $_POST['the_input']; ?>">
<input type="submit" name="eat_something" value="Eating" />
<input type="submit" name="eat_something" value="Don't Eat" />
</form>
Of course, this won't give exactly what you're looking for.
You can also do something like this:
<form method="post" action="the_file.php" id="the-form">
<input id="theInput" type="text" name="the_input" value="<?php if ( isset( $_POST['the_input'] ) echo $_POST['the_input']; ?>">
<button type="button" name="eat_something" data-value="TRUE">Eating</button>
<button type="button" name="eat_something" data-value="FALSE">Don't Eat</button>
</form>
$('#the-form button').bind('click', function(){
jQuery.post($('#the-form').attr('action'),
{
the_input: $('#theInput').val(),
eat_something: $(this).attr('data-value')
},
function(data) { $('#result').empty().append(data).slideDown() },
'json'
});
Change the buttons to this (change w/your form names)..
<input type="hidden" name="eat_something" value="" />
<input type="button" onclick="$('input[name=eat_something]').val('TRUE')" />
<input type="button" onclick="$('input[name=eat_something]').val('FALSE')" />
The Javascript function and the PHP are fine.
Thanks!
#leo