Question

有一个包含两个按钮的表单。然后我想当我点击不同的按钮时，会弹出一个相关的消息框。单击按钮后，将触发另一个名为＆＃34; Approval＆＃34;的操作。

但是，在当前情况下，警报框仅显示一个状态。我知道当前状态是获得相同的ID，这是一个错误的操作。但我现在不知道解决方案。有谁可以帮助我？

我查看了这个参考：Form onSubmit determine which submit button was pressed，但不太了解解决方案提供的概念。

<script type="text/javascript" language="javascript"> 

function ConfirmOnDelete() {

    var a = document.getElementById('a_action').value; //I want to change this
    if (a == "Approve")
    {
        if (confirm("Are you sure to approve?") == true)
            return true;
        else
            return false;
    }
    else
    {
        if (confirm("Are you sure to delete?") == true)
            return true;
        else
            return false;
    }
}
</script>
<form id="Batch" action="Approval" method="post" onsubmit="return ConfirmOnDelete();">      
        @<text>               


            @If ViewBag.unapprovedCount > 0 Then
                @<div style="float: left;">
                    <br />                       
                    <input type="hidden" name="batch_action" value="Delete" />
                    <input type="hidden" id="a_action" name="additional_action" value="Delete" />
                    <input type="submit" id="submit4" name="submit" class="button" value="Delete" style="width:100px;">
                </div>
            End If


            @If ViewBag.unapprovedCount > 0 Then                
                @<div style="float: right;">
                    <br />                       
                    <input type="hidden" name="batch_action" value="Approve" />
                    <input type="hidden" id="a_action2" name="additional_action" value="Approve" />
                    <input type="submit" id="submit3" name="submit" class="button" value="@ViewBag.batch_action" style="width:100px;">
                </div>
            End If

        </text>        
</form>

Answer 1

注意代码中添加了{和}。这是javascript if语句的正确语法。

<强>更新

您要调用ConfirmOnDelete()，具体取决于提交来自哪个按钮，即批准或删除。原谅我使用jquery

＆＃13;

$("#Batch").on("submit", function() { 
    // Does the element have focus:
    var hasApproveFocus = $("input[id='submit3']").is(':focus');
    var hasDeleteFocus = $("input[id='submit4']").is(':focus');

  //checking which of the submit button has focus to determine which was click on submit
  if (hasApproveFocus == true) {
    if (confirm("Are you sure to approve?") == true) {
      return true;
    }  else {
      return false;
    }
  } else if (hasDeleteFocus == true){
    if (confirm("Are you sure to delete?") == true) {
      return true;
    } else {
      return false;
    }
  }
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<form id="Batch" action="Approval" method="post">

  <div style="float: left;">
    <input type="submit" id="submit4" name="submit" class="button" value="Delete" style="width:100px;">
  </div>

  <div style="float: right;">
    <br />
    <input type="submit" id="submit3" name="submit" class="button"  value="Approve" style="width:100px;">
  </div>
</form>

＆＃13;

Answer 2

您获得一个身份的原因是因为 var a = document.getElementById('a_action').value; //get by Button click 根据ID检索值。 ID应该是唯一的，但您的两个输入都具有ID a_action。因此getElementById仅返回第一个值，在这种情况下为Delete。

您可以做的是以下

而不是绑定`ConfirmOnDelete＆＃39;在表单上，您可以绑定按钮并将操作作为参数传递。

请参阅此小提琴https://jsfiddle.net/j3rvter5/1/

Answer 3

在#a_action元素上，您可以添加data-*属性，做一些魔术。

<input type="hidden" id="a_action" name="additional_action" value="Delete" data-value="Approve" />

最后请注意data-value="Approve"。现在你可以像这样抓住这个值：

var a = document.getElementById('a_action').getAttribute('data-value');

并检查值是否等于某事，就像在您的示例中一样。

if (a == "Approve") {
    //This would be true in this example, as data-value == "Approve"
}

这是你在寻找吗？

Answer 4

这是我实现的解决方案。

<script type="text/javascript">
function question_submit(input) {

    if (input == 1)
    {
        if (confirm('Are you sure you want to delete?')) {
            document.getElementById("action").value = "Delete";

            $('#Batch').submit();
        }
        else {
            alert('You have not submitted this form');
        }
    }
    else {
        if (confirm('Are you sure you want to approve?')) {
            document.getElementById("action").value = "Approve";
            $('#Batch').submit();
        }
        else {
            alert('You have not submitted this form');
        }
    }
}
</script>

<form id="Batch" name="myform" action="BatchApproval" method="post" >
    <input id="action" type="hidden" name="batch_action" /> 
    <div style="float: left;">
    <br />                      
    <input type="button" id="submit4" name="submit4" class="button" value="Delete" style="width:100px;" onclick="question_submit(1)">
                </div>

   <div style="float: right;">
   <br />                                  
   <input type="button" id="submit3" name="submit3" class="button" value="Approve" style="width:100px;" onclick="question_submit(2)">
   </div>

</form>

如何根据按钮单击条件弹出消息框？

4 个答案: