如何重置由php設置的復選框？

Question

我有一個帶有無數復選框的Web表單。 如果表格填寫不正確，則不會重置所有復選框（作為防挫折功能）。

問題是，如果以前提交過表單，則重置按鈕無法取消所有復選框的選中。 我該如何解決？

如果表單是事先提交的，則document.getElementById("form").reset()也不起作用。

下面的示例代碼：

<body>

<script>
function resetData() {
    document.getElementById("deleteContactFlag").checked=false;
    document.getElementById("userAdministrationFlag").checked=false;
}
</script>

<form action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>" method="post" id="form">
    <input type="checkbox" name="deleteContactFlag" id="deleteContactFlag" <?php if (isset($_POST["deleteContactFlag"])) echo 'checked="checked"'; ?>/> Delete Contacts<br>
    <input name="userAdministrationFlag" type="checkbox" id="userAdministrationFlag" <?php if (isset($_POST["userAdministrationFlag"])) echo 'checked="checked"'; ?>/> User Administration<br><br>

    <input type="submit" name="submit" id="submit" value="Submit">
    <button type="button" onClick="resetData()">Reset</button>
</form>

</body>

Answer 1

表單重置不會清除表單中的所有值，而是將表單設置回其初始狀態，即頁面首次加載時的初始狀態。 （在此初始狀態下，某些復選框已被選中。）

嘗試手動重置所有復選框：

var inputs=document.getElementsByTagName("input");
for (var i in inputs)
    if (inputs[i].type=="checkbox") inputs[i].checked=false;

或者，如果您使用jQuery：

$("input[type=checkbox]").each(function() { this.checked=false; });

Answer 2

嘗試在html元素之外使用Php代碼

HTML

<form action="<?php echo htmlspecialchars($_SERVER['PHP_SELF']); ?>"method="post" id="form">

    <input type="checkbox" name="deleteContactFlag" id="deleteContactFlag" /> Delete Contacts
    <input name="userAdministrationFlag" type="checkbox" id="userAdministrationFlag" /> User Administration

    <input type="submit" name="submit" id="submit" value="Submit">
    <button type="button" onClick="resetData()">Reset</button>
</form>

Answer 3

如果您發現表單重置功能不可靠，則可以使用JavaScript來選中和取消選中checkbox輸入。 （我相信重置表單應該將其設置為頁面加載時的初始狀態，這就是為什么您可能會遇到此問題的原因？）。 這是一個例子：

function checkAll(formname, checktoggle)
{
  var checkboxes = new Array(); 
  checkboxes = document[formname].getElementsByTagName('input');

  for (var i=0; i<checkboxes.length; i++)  {
    if (checkboxes[i].type == 'checkbox')   {
      checkboxes[i].checked = checktoggle;
    }
  }
}

<a onclick="javascript:checkAll('form', true);" href="javascript:void();">check all</a>
<a onclick="javascript:checkAll('form', false);" href="javascript:void();">uncheck all</a>

來自此處的代碼（那里也有一個jQuery示例）： http : //www.webdevdoor.com/javascript-ajax/javascript-function-check-uncheck-checkboxes/

如何重置由php設置的復選框？

問題描述

3 個解決方案

解決方案1
4 2014-06-26 11:27:41

解決方案2
1 2014-06-26 11:24:26

解決方案3
0 2014-06-26 11:30:03

如何重置由php設置的復選框？

問題描述

3 個解決方案

解決方案1 4 2014-06-26 11:27:41

解決方案2 1 2014-06-26 11:24:26

解決方案3 0 2014-06-26 11:30:03

解決方案1
4 2014-06-26 11:27:41

解決方案2
1 2014-06-26 11:24:26

解決方案3
0 2014-06-26 11:30:03