[英]Filling out a form using javascript
I want to fill out a form when opening a page (it's a page where you edit your profile information).我想在打开一个页面时填写一个表格(这是一个您编辑个人资料信息的页面)。
Here is my code:这是我的代码:
<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>
When loading a page, it doesn't fill out the information, and I can't find the mistake.加载页面的时候,没有填写信息,我也找不到错误。
Is there a better way of doing this?有没有更好的方法来做到这一点?
The rendered JavaScript looks like:呈现的 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;
}
You missed setting the id
for some of the <input/>
elements.您错过了为某些<input/>
元素设置id
。
<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>
Hope this helps,希望这可以帮助,
I think the problem is a combination of things, as highlighted in a couple of comments / answers.我认为问题是多种因素的组合,正如一些评论/答案中所强调的那样。
password
and lastname
don't have IDs)为所有输入添加 ID( password
和lastname
没有 ID)ViewBag
is accessed with the @
prefix确保使用@
前缀访问ViewBag
I believe the following code should handle ViewBag
and JavaScript literals:我相信以下代码应该处理ViewBag
和 JavaScript 文字:
<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>
Note that all of the literal values are quoted.请注意,所有文字值都被引用。 You may need to handle additional escaping to prevent any of the ViewBag
properties from causing an error due to a '
in the property value.您可能需要处理额外的转义以防止任何ViewBag
属性由于属性值中的'
而导致错误。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.