Question

我有一个设置表单，我想确保用户不会错误地进行更改。当用户完成后，他们将点击保存按钮，弹出一个模态（Bootstrap模态），提示用户输入密码继续处理原始表格。

如果输入的密码正确，则提交第一个表单，否则页面将重新加载/重定向回自身。第一个表单将包含许多字段，但我只是使用它来进行测试。

<form action="http://localhost.testing/render_confirm_with_password.php" method="POST" id="validation-form" class="form-horizontal confirm-form">
    <div class="form-group">
        <label for="deletion_reason" class="col-xs-3 col-lg-4 control-label">Enter Your Value</label>
        <div class="col-sm-9 col-lg-6 controls">
            <input type="text" name="value" placeholder="yourname@email.com" class="form-control" />
        </div>
    </div>
    <div class="form-group">
        <div class="col-sm-9 col-sm-offset-3 col-lg-6 col-lg-offset-4">
            <!-- <button type="submit" class="btn btn-primary"><i class="icon-ok"></i> Process</button> -->
            <button type="submit" class="btn btn-primary" data-toggle="modal" data-target="#password_confirm_modal" data-modal-type="password_confirm" data-modal-title="Delete Transaction" data-modal-text="Are you sure you want to delete this transaction?"><i class="icon-ok"></i> Process</button>
        </div>
    </div>
</form>

当用户点击“保存”时，会弹出内部窗体的模式，如下所示。此表单使用jQuery $ .ajax（）

进行处理

<form action="#" method="POST" id="validation-form" class="form-horizontal">
  <div class="modal-body">
        <div class="form-group">
            <label for="deletion_reason" class="col-xs-3 col-lg-4 control-label">Password</label>
            <div class="col-sm-9 col-lg-6 controls">
                <input type="text" name="password" id="password" placeholder="your password" class="form-control" />
            </div>
        </div>
        <p>PASSWORD RESULT -> <span id="password_result"></span></p>
  </div>
  <div class="modal-footer">
    <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
    <button id="password_confirm_submit" class="btn btn-primary">Process</button>
  </div>
</form>

ajax代码如下所示。单击模态处理按钮后，它会在将密码发布到要处理的php页面之前设置密码。在php中，我检查密码是否与存储的密码匹配，并回显MATCH或NO MATCH，它在模态中显示。如果ajax结果等于MATCH I，则使用$（'。confirm-form'）处理第一个表单.submit（）;我确定我没有以安全的方式做到这一点。

$('#password_confirm_submit').click(function(e){
    var password = $('#password').val();
    e.preventDefault();
    $.ajax({
        type: 'POST',
        data: {password: password},
        url: 'http://localhost.testing/process_confirm_with_password.php',
        success: function(result){
            $('#password_result').html(result);
            if(result == "MATCH"){
                // process form_1
                $('.confirm-form').submit();
            }else{
                // back to form_1
            }
        }
    })
});

我尝试从PHP中重定向，如果密码不匹配但仍然处理形式之一。别担心，它的硬编码仅用于测试

$password = "password";

if(isset($_POST['password'])){
    $pw = $_POST['password'];
    if($password == $pw){
        // process form_1
        echo "MATCH";
    }else{
        // return to form_1
        header('Location: http://localhost.testing/confirm_with_password.html');
        echo "NO MATCH";
    }
}else{
    // return to form_1
    echo "NOT SET";
}

Answer 1

处理AJAX请求的PHP代码中的头函数是什么，它只重定向AJAX请求而不是浏览器中的页面。删除重定向，因为它不会返回到表单1。

如果要在输入密码错误时关闭引导模式框，则需要调用$("#password_confirm_modal").modal("hide");或location.reload();从您的else语句中的AJAX回调中刷新/重新加载页面您处理的密码响应不正确，但使用后者会丢失输入表单的所有数据。

您可以在模式框中显示有关输入错误的密码的警告，并让用户再次尝试输入密码，而不是执行其中任何一项操作。至于安全方面，您可能希望在提交之前将正确的密码作为隐藏字段添加到原始表单中，以便在保存实际数据时可以验证密码。

处理ajax帖子的结果

1 个答案: