Question

我的代码中有一个表单

<form class="validate form-horizontal" role="form" id="formLogin" action='actions.php' method="post" enctype="multipart/form-data">
    <input type="hidden" name="id" value="<?php echo @$selectedUser['id'];?>" />
    <input type="hidden" name="j" value="<?php echo "3"; ?>" />

    <div class="form-group clearfix">
        <div class="col-lg-offset-4 col-lg-9">
            <button type="submit" class="btn btn-success">&nbsp;&nbsp;&nbsp;Save&nbsp;&nbsp;&nbsp;</button>
            <a class="btn btn-default" href="index.php">Cancel</a>
        </div>
    </div>

    <div class="form-group clearfix">
        <div class="col-lg-offset-4 col-lg-9">
            <button type="submit" class="btn btn-success">&nbsp;&nbsp;&nbsp;Approve&nbsp;&nbsp;&nbsp;</button>
            <input style="margin-left: 10px;" type="checkbox" name="emailCheckBox" style="height: 25px">
            <label style="margin-left: 10px;" class="control-label">Email Tami</label>
        </div>
    </div>
</form>

我这里有两个不同的按钮，Save and Approve。此表单中还有至少7个输入字段。现在我想要它，所以当点击保存按钮时，它应该发送j = 3的值，如果按下批准，它应该发送j的值为4

如何覆盖表单活动，并且可能在javascript中编写一些代码来实现这一点，请记住其他7个输入字段的数据也正在发送，并且两个按钮的数据相同

Answer 1

您只需为此目的添加必要的属性：

<button type="submit" name="action" value="save" class="btn btn-success">&nbsp;&nbsp;&nbsp;Save&nbsp;&nbsp;&nbsp;</button>
<button type="submit" name="action" value="approve" class="btn btn-success">&nbsp;&nbsp;&nbsp;Approve&nbsp;&nbsp;&nbsp;</button>

在此示例中，为每个按钮添加name="action"及其各自的值：

value="save"
value="approve"

然后在PHP中：

if($_SERVER['REQUEST_METHOD'] == 'POST') {
    $action = $_POST['action']; // the value here will be either "save" or "approve"
    // so now your next course will depend on this value
    $j = null;
    if($action == 'save') {
        $j = 3;
    } elseif ($action == 'approve') {
        $j = 4;
    }
}

或者，如果你不想走这条路，那么你可以在客户端操纵它：

$('button[name="action"]').on('click', function(e){
    e.preventDefault();
    var action = $(this).attr('value');
    if(action == 'save') {
        $('input[name="j"]').attr('value', 3);
    } else if(action == 'approve') {
        $('input[name="j"]').attr('value', 4);
    }
    $('#formLogin').submit();
});

然后在PHP中，通常只需访问$_POST['j'];

Answer 2

设置表单的名称

<form class="validate form-horizontal" role="form" name="form" id="formLogin" action='actions.php' method="post" enctype="multipart/form-data">

纯粹的香草javascript将是

var button = document.querySelectorAll('.btn-success');
var input = document.forms['form'].j;

document.forms['form'].addEventListener('submit', function(e) {
    e.preventDefault();
}) 

button[1].addEventListener('mousedown', function() {
    input = parseInt(input.value) +1;
    console.log(input);
    document.forms['form'].submit();
})

button[0].addEventListener('mousedown', function() {
    document.forms['form'].submit();
})

使用php格式的不同按钮发送不同的输入值

2 个答案:

JSFIDDLE：http://jsfiddle.net/TRNCFRMCN/2aa52wak/2/。