JQuery Datepicker for multiple .NET MVC Input Fields not working

牧云@^-^@ 提交于 2019-12-11 17:34:39

问题


I have simplified my work for this question but the same problem remains. I am using the Textbox HTML helper to display empty textboxes as I loop through the items in this model.

<% foreach (var item in Model) { %>

<tr>
<td><%: item.ID %></td>
<td><%: Html.TextBox("usernames", null, new { @class = "datepicker" }) %></td>
<td><%: item.Password %></td>
<td> <%: item.Race %></td>
</tr>

<% } %>

Because I have several rows this produces several fields all with the class "datepicker". I am applying the following JQuery for the datepicker:

$(document).ready(function () {
$('input').filter('.datepicker').datepicker({
dateFormat: "dd/mm/yy",
onSelect: function (value, date) {
alert(this.value);
}
});
});

When the page renders, every textbox creates a calendar as expected but it always puts the date into the textbox on line one. I need the date to go into the textbox the calendar appeared next to. The html for the code above looks fine:

<tr>
<td>6</td>
<td><input class="datepicker" id="usernames" name="usernames" type="text" value="" /></td>
<td>dinosaur</td>
<td> 1</td>
</tr>

Interstingly, if I simply create 4 of class "datepicker" everything is fine. Its the way the html helpers create the for you.

Please Help!


回答1:


The answer is to give the textboxes being generated unique id's like below otherwise it will not work.

<% foreach (var item in Model) { %>

<tr>
<td><%: item.ID %></td>
<td><%: Html.TextBox("usernames", null, new { ID=item.ID @class = "datepicker" }) %></td>
<td><%: item.Password %></td>
<td> <%: item.Race %></td>
</tr>

<% } %>


来源:https://stackoverflow.com/questions/3112787/jquery-datepicker-for-multiple-net-mvc-input-fields-not-working

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!