使用提交按钮选择多个表单

时间:2018-10-10 18:26:22

标签: javascript php html

<form action="' . htmlentities($_SERVER['PHP_SELF']) . '" method="post">
    <input type="hidden" name="delid" value="delid">
</form>

<form action="' . htmlentities($_SERVER['PHP_SELF']) . '" method="post">
    <input type="hidden" name="addid" value="addid">
</form>

<select name="option" id="option">
    <option value="delete">Delete</option>
    <option value="add">Add</option>
</select> 
<input type="submit" name="submit" value="Choose Option"/>

我想在选择框中选择一个选项,然后单击“提交”。然后,它将根据所选选项在顶部的两个表单之一上执行发布。我不知道如何做到这一点。谢谢!

2 个答案:

答案 0 :(得分:0)

HTML

<form name="delid" action="' . htmlentities($_SERVER['PHP_SELF']) . '" method="post">
<input type="hidden" name="delid" value="delid">
</form>

<form name="addid" action="' . htmlentities($_SERVER['PHP_SELF']) . '" method="post">
<input type="hidden" name="addid" value="addid">
</form>

<select name="option" id="option">
<option value="delete">Delete</option>
<option value="add">Add</option>
</select> 
<input id="btnSubmit" type="submit" name="submit" value="Choose Option"/>

JavaScript

var btn = document.getElementById("btnSubmit");
var forms = document.getElementsByTagName("form"); 

btn.addEventListener('click', function() {
    let selectedValue = document.getElementById("option").value,
      inputName = selectedValue.toLowerCase().substring(0,3) + "id",
      inputElement =  document.querySelector('input[name="'+ inputName +'"]');

  if (inputElement && inputElement.parentNode && inputElement.parentNode.tagName === "FORM")
      inputElement.parentNode.submit();
});

答案 1 :(得分:0)

<!DOCTYPE html>
<html>
<body>

<form name="delid" action="" method="post">
    <input type="hidden" name="del" value="del">
    <input type="hidden" name="blah" value="asdf">
</form>
<form name="addid" action="" method="post">
    <input type="hidden" name="add" value="add">
</form>

<select name="option" id="option">
    <option value="delid">Del</option>
    <option value="addid">Add</option>
</select>
<input id="myBtn" type="submit" name="submit" value="Choose Option"/>

<script>
    var myBtn = document.getElementById("myBtn");

    myBtn.addEventListener("click", function(){
        var selectedValue = document.getElementById("option").value; // This is the selected option value
        var formName = document.getElementsByName(selectedValue);
        formName[0].submit();
    });
</script>

</body>
</html>

我修改了上一个答复,并提出了这个建议,并使其起作用。谢谢!