PHP представляет форму с несколькими кнопками отправки с помощью jQuery .post ()

У меня есть следующий код HTML:

<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> 

Вслед за этим 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(); } 

У меня также есть PHP-скрипт, который получает значение $ _POST из ввода на submit и запускает условия для проверки нажатия кнопки отправки.

Как это:

 $input = $_POST['the_input']; $eating = $_POST['eat_something']; if ( $eating == 'TRUE' ) { // Do some eating... } else { // Don't you dare... } 

Если я не использую функцию jQuery.post (), отправляются значения из кнопки. Однако по какой-то причине я не могу передать значение кнопки в PHP $ _POST с помощью функции jQuery.post (). Если я не использую jQuery.post (), вывод не добавляется в текстовое поле, а скорее в текстовом формате на отдельной странице, например в документе. Я также попытался вызвать функцию отправки на кнопку $('button[type=submit]').bind('submit', submitForm); но это тоже не решает мою проблему.

Заранее спасибо за вашу помощь.

Вы забыли прописную запись и ) в the_name .

 <input type="text" name="the_input" value="<?php if (isset($_POST['the_input'])) { echo $_POST['the_input'] ; } ?>"> 

и для получения нажатой кнопки кнопки формы вам необходимо добавить значение вручную для сериализации.

 $form.serialize() + "&submit="+ $('button').attr("value") 

пример

 <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> 

Полный протестированный код

 <?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> 

Самый простой ответ:

 <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> 

Конечно, это не даст точно то, что вы ищете.

Вы также можете сделать что-то вроде этого:

 <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' }); 

Измените кнопки на это (измените w / ваши имена форм).

 <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')" /> 

Функция Javascript и PHP в порядке.

Благодаря!

@Лео