多个.NET MVC输入字段的jQuery Datepicker不起作用 [英] JQuery Datepicker for multiple .NET MVC Input Fields not working

问题描述

我已经简化了此问题的工作，但仍然存在相同的问题.当我遍历此模型中的项目时，我正在使用Textbox HTML帮助器显示空的文本框.

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>

<% } %>

因为我有几行，所以产生了所有带有"datepicker"类的字段.我将以下JQuery应用于datepicker:

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);
}
});
});

页面呈现时，每个文本框都会按预期方式创建日历，但始终将日期放在文本框中的第一行.我需要日期才能进入日历旁边的文本框.上面代码的html看起来不错:

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>

有趣的是，如果我简单地创建4类"datepicker"，那么一切都很好.这是html帮手为您创建的方式.

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

请帮助！

推荐答案

答案是给生成的文本框唯一的ID，如下所示，否则将不起作用.

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>

<% } %>

这篇关于多个.NET MVC输入字段的jQuery Datepicker不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！