使用 javascript 填写表单
我想在打开页面时填写表格（这是您编辑个人资料信息的页面）。
这是我的代码：
<head>
<script type="text/javascript">
function addValues() {
document.getElementById("datePicker").value = ViewBag.b.DateOfBirth.ToShortDateString();
document.getElementById("name").value = ViewBag.b.Username;
document.getElementById("username").value = ViewBag.b.Username;
document.getElementById("password").value = ViewBag.b.Password;
document.getElementById("lastname").value = ViewBag.b.Lastname;
}
</script>
</head>
<body onload="addValues()">
<h2>EditProfile</h2>
<form action="~/Authentication/EditProfile" method="post">
<table>
<tr>
<td>Username:</td>
<td><input type="text" name="username" id="username" /></td>
</tr>
<tr>
<td>Password:</td>
<td><input type="text" name="password" /></td>
</tr>
<tr>
<td>Name:</td>
<td><input type="text" name="name" id="name" /></td>
</tr>
<tr>
<td>Last name:</td>
<td><input type="text" name="lastname" /></td>
</tr>
<tr>
<td>Date of birth:</td>
<td><input type="date" name="dateofbirth" id="datePicker" /></td>
</tr>
<tr>
<td colspan="2">
<input type="submit" value="Save" />
</td>
</tr>
</table>
</form>
</body>
加载页面时，没有填写信息，我找不到错误。
有更好的方法吗？
呈现的 JavaScript 如下所示：
function addValues() {
document.getElementById("datePicker").value = 11.9.2001. 00:00:00;
document.getElementById("name").value = Mirko;
document.getElementById("username").value = micro;
document.getElementById("password").value = 123456789;
document.getElementById("lastname").value = Mijanovic;
}
qq_笑_172回答
-
慕妹3146593
id您错过了为某些元素设置的<input/>。<head> <script type="text/javascript"> // Example data const ViewBag = { b: { DateOfBirth: '2020-09-30', Username: 'username', Password: 'password', Lastname: 'lastname' } }; function addValues() { document.getElementById("datePicker").value = ViewBag.b.DateOfBirth; document.getElementById("name").value = ViewBag.b.Username; document.getElementById("username").value = ViewBag.b.Username; document.getElementById("password").value = ViewBag.b.Password; document.getElementById("lastname").value = ViewBag.b.Lastname; } </script></head><body onload="addValues()"> <h2>EditProfile</h2> <form action="~/Authentication/EditProfile" method="post"> <table> <tr> <td>Username:</td> <td><input type="text" name="username" id="username" /></td> </tr> <tr> <td>Password:</td> <td><input type="text" name="password" id="password" /></td> </tr> <tr> <td>Name:</td> <td><input type="text" name="name" id="name" /></td> </tr> <tr> <td>Last name:</td> <td><input type="text" name="lastname" id="lastname" /></td> </tr> <tr> <td>Date of birth:</td> <td><input type="date" name="dateofbirth" id="datePicker" /></td> </tr> <tr> <td colspan="2"> <input type="submit" value="Save" /> </td> </tr> </table> </form></body></html> -
收到一只叮咚
我认为问题是多种因素的结合，正如一些评论/答案中所强调的那样。将 ID 添加到所有输入（password并且lastname没有 ID）确保ViewBag使用@前缀访问确保正确呈现 JavaScript 文字我相信以下代码应该处理ViewBagJavaScript 文字：<script type="text/javascript"> function addValues() { document.getElementById("datePicker").value = '@ViewBag.b.DateOfBirth.ToShortDateString()'; document.getElementById("name").value = '@ViewBag.b.Username'; document.getElementById("username").value = '@ViewBag.b.Username'; document.getElementById("password").value = '@ViewBag.b.Password'; document.getElementById("lastname").value = '@ViewBag.b.Lastname'; }</script>请注意，所有文字值都被引用了。您可能需要处理额外的转义，以防止任何属性ViewBag由于'属性值中的 a 而导致错误。
随时随地看视频慕课网APP
相关分类
JavaScript