Javascript InvalidStateError:DOM异常11和未捕获的TypeError:Cannotcallmethod';提交';空的
我寻找了一个可能的答案,并通过了一些帖子,包括 但他们似乎都不能解决我的问题。 将数据从html表单保存到mysql数据库的save按钮工作正常,直到页面开始出现两个错误Javascript InvalidStateError:DOM异常11和未捕获的TypeError:Cannotcallmethod';提交';空的,javascript,html,dom,Javascript,Html,Dom,我寻找了一个可能的答案,并通过了一些帖子,包括 但他们似乎都不能解决我的问题。 将数据从html表单保存到mysql数据库的save按钮工作正常,直到页面开始出现两个错误 页面上的下拉列表使用ajax从数据库动态更新。它们仍然工作正常,并根据所选的选项自动更新,但当我单击任何下拉列表时,错误控制台显示“未捕获错误:InvalidStateError:DOM异常11 on createoptions.js第37行即xmlhttp.send(); 当我单击save按钮时,会出现一个错误,显示的不是任
xmlhttp.send();
uncaughttypeerror:cannotcallmethod“submit”为null
。为了谨慎起见,调用submit()方法的对象已经存在。我使用了document.getElementById('studentdata')。submit()
和表单studentdata存在于同一页上function setdepartment(value){
var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("departmentselect1").innerHTML=xmlhttp.responseText;
}
}
switch(value){
case "Allied Health Sciences" : xmlhttp.open("GET","deptahs.php",true); break;
case "Engineering and Inter-disciplinary sciences" : xmlhttp.open("GET","depteids.php",true); break;
case "HIMSR" : xmlhttp.open("GET","depthimsr.php",true); break;
case "Islamic Studies and Social Sciences" : xmlhttp.open("GET","deptisss.php",true); break;
case "Management and Information Technology" : xmlhttp.open("GET","deptmanagement.php",true); break;
case "Medicine (Unani)" : xmlhttp.open("GET","deptmedicine.php",true); break;
case "Nursing" : xmlhttp.open("GET","deptnursing.php",true); break;
case "Pharmacy" : xmlhttp.open("GET","deptpharmacy.php",true); break;
case "Science" : xmlhttp.open("GET","deptscience.php",true); break;
}
xmlhttp.send();
}
php,引用的行是
拯救
选择一个选项
选择一个选项
您的第一个错误“未捕获错误:InvalidStateError:createoptions.js第37行上的DOM异常11
是由操作DOM引起的。我认为这可能与以下事实有关:您有两个id为departmentselect1
的元素,或者具有相同id的div是无效语法,因为它不能是select
元素的子元素。您可以单击Chrome中此错误旁边的箭头,并将其跟踪到实际发生的位置
未捕获类型错误:无法调用null的方法“submit”
意味着文档。getElementById('studentdata')
与任何元素都不匹配,因此返回null
null
没有方法,因此它将抛出此错误。这很奇怪,但由于表单具有双id且语法无效,因此可能具有未定义的行为。尝试解决第一个问题,它可能会神奇地解决另一个问题
编辑:
我仍然认为您应该调试
setdepartment
函数中的value
值,以使菜单不起作用。如果值与任何情况都不匹配,函数会有什么行为?菜单的哪些响应数据不起作用?可以显示savedata.php,但我认为不需要它。doconsole.log(value)代码>在设置部门
功能中。它是否真的与您的任何“case”值匹配?我在第二个下拉列表中得到了这些值,这应该说明setdepartment函数工作正常。我更关心的是在单击提交按钮时出现的第二个错误。我注意到两个元素具有相同的id。id应该始终是唯一的,因此使用iddepartmentselect1来更改其中一个元素。是的,但如果使用相同的id,我以前可以将数据保存到数据库中。此处“Cannot call method“submit”为null”的可能原因是什么。很抱歉,我犯了一个小错误,现在提交工作正常,幸运的是它与重复的id无关。是的,DOM异常可能只是由于重复的id造成的。我会设法解决的。谢谢你的帮助。
<div class="navbutton">
<aside>
<ul>
<li><a class="button black" href="logout.php">Logout</a></li>
<li><a class="button black" onclick="addRow()">Add Row</a></li>
<li><a href="#searchbox" class="button black" onclick="showsearch()">Search</a></li>
<li><a href="#promotediv" class="button black" onclick="showpromote()">Promote</a></li>
<li><a class="button black" form="studentdata" onclick="document.getElementById('studentdata').submit()">Save</a></li>
</ul>
</aside>
</div>
<form id="studentdata" action="savedata.php" method="POST">
<div style=" padding-left:350px; ">
<div class="dropdown dropdown-dark">
<select name="facultyselect1" id="facultyselect1" style="width:300px;" class="dropdown-select " onfocus="setdepartment(this.value)" onchange="setdepartment(this.value)" required>
<option value="">Select an option</option>
<div id="facultyselect1">
<?php
@ $db = mysql_connect("localhost", "root", "");
mysql_select_db("university");
$strSQL = "SELECT facultyname FROM faculty";
$rs = mysql_query($strSQL);
$nr = mysql_num_rows($rs);
for ($i=0; $i<$nr; $i++) {
$r = mysql_fetch_array($rs);
echo "<OPTION VALUE=\"".$r["facultyname"]."\">".$r["facultyname"]."</OPTION>";
}
?>
</div>
</SELECT>
</div>
<div class="dropdown dropdown-dark">
<select name="departmentselect1" id="departmentselect1" class="dropdown-select" onchange="setcourse(this.value)" onfocus="setcourse(this.value)" required>
<option value="">Select an option</option>
<div id="departmentselect1">
</div>
</select>
</div>
</div>
</form>