一个表单中的两个提交按钮，具有不同的操作答案

【问题标题】：Two submit buttons in one form with different actions一个表单中的两个提交按钮，具有不同的操作
【发布时间】：2017-03-13 23:31:35
【问题描述】：

我有一个要编辑的页面，该页面包括一个带有两个按钮（确定和删除）的表单。我通过 PHP SELF 发送表单。在页面顶部有两个函数可以测试在 POST 中收到的内容，如果收到 OK，则执行此操作，如果收到 DELETE，则执行其他操作。按下 DELETE 按钮，我正在弹跳 CONFIRMATION 消息，以及这个问题。如果用户在 CONFIRMATION 窗口中单击 OK，我尝试使用 Jquery 函数提交表单，但它不起作用。

    <?
     if(isset($_POST["delete_page"])){
       echo "DELETE PAGE";
     }
     if(isset($_POST["submit"])){
       echo "SUBMIT PAGE";
     }
    ?>


 <form role="form" data-toggle="validator" method="post" action="<?echo "$_SERVER[REQUEST_URI]";?>" id="update_page_frm">
    <button type="submit" class="btn btn-success" name="submit">אישור</button>
    <button type="button" class="btn btn-danger" name="delete_page" id="delete_page">הסר עמוד</button>
</form>

custom.js：

$(document).ready(function() {
$('#delete_page').click(function() {
bootbox.confirm("Are you sure want to delete?", function(result) {
    if (result) {
        $("#update_page_frm").submit();
    }

     });
   });
 });

【问题讨论】：

你有小提琴吗？

标签： javascript php jquery html forms

【解决方案1】：

将多个操作关联到一个表单是很常见的。更灵活的方法是不使用本机提交类型按钮，而是使用 AJAX 请求处理这两个操作。例如：

function callAction(action, callback) {
     $.ajax({
         url: '/path/to/submit/to',
         data: {
              action: action,
              form: $('#update_page_frm').serialize()
         },
         success: function(response) {
             callback(response);
         }
    });
};

$('#update_page').on('click', function(e) {
    e.preventDefault();
    callAction('update', function(response) {
         console.log('All done!');
    });
});

$('#delete_page').on('click', function(e) {
    e.preventDefault();
    callAction('delete', function(response) {
         console.log('All done!');
    });
});

请注意，上面的代码是在 SO 上即时编写的，未经测试。不过应该相当接近。

【讨论】：

【解决方案2】：

这可能是引号的问题，您的代码没有正确打开/关闭引号。试试这种方式：

<form role="form" data-toggle="validator" method="post" action="<?php echo $_SERVER['REQUEST_URI']; ?>" id="update_page_frm" >
    <button type="submit" class="btn btn-success" name="submit">אישור</button>
    <button type="button" class="btn btn-danger" name="delete_page" id="delete_page">הסר עמוד</button>
</form>

【讨论】：

【解决方案3】：

使用jquery调用文件时必须使用ajax

$("#delete_page").click(function(){

data1=$("#input").val();

$.ajax({
        type:"post",
        url:"file.php",
        data:"data1="+data1,
        beforeSend: function(){
                        $('#msj').html('<img src="img/Loading.gif"/> Loading...');                          
                    },
        success:function(result){

                alert(result);
                $("#msj").html('');

        }
     });
 });

【讨论】：