多个jQuery日期输入在一个剃刀页面
本文关键字:一个 剃刀 日期 jQuery 输入 多个 | 更新日期: 2023-09-27 17:53:41
因此,我在mvc页面内的多个项目上生成日期拾取器(基于前页数据的未定义数量)。
目前只有最后一个文本框上有日期选择器。
我首先为每个项目生成一个日期选择函数。
@for (int p = 0; p < Model.InputParameters.Count; p++)
{
if (Model.InputParameters[p].DatePicker))
{
var name2 = "#datepicker"+p;
<script type="text/javascript">
var jsondetail2 = '@Html.Raw(Json.Encode(name2))';
var newname2 = JSON.parse(jsondetail2);
$(function () {
$(newname2).datepicker();
});
</script>
}
}
然后把它们抽出来。
var id = "datepicker" + i;
@Html.TextBoxFor(modelitem => Model.InputParameters[i].Value, DateTime.Now.ToString("dd/MM/yyyy"), new { @id = id})
在firebug中没有错误,javascript会为每个日期摘取器生成,但只会触发最后一个绘制的日期摘取器。我被难住了,还在学习javascript,所以任何解释和答案都会很感激!谢谢。
你的脚本正在执行,但找不到任何文本框上绑定的DatePicker(即脚本触发之前的输入已经生成,所以jQuery选择器找不到输入)。您需要重新构建,例如:
@for (int p = 0; p < Model.InputParameters.Count; p++)
{
if (Model.InputParameters[p].DatePicker))
{
var id = "datepicker" + p.ToString();
@Html.TextBoxFor(modelitem => Model.InputParameters[p].Value, DateTime.Now.ToString("dd/MM/yyyy"), new { @id = id})
<script type="text/javascript">
//var jsondetail2 = '@Html.Raw(Json.Encode(name2))';
var newname2 = "#@(Html.Raw(id))";//JSON.parse(jsondetail2);
$(function () {
$(newname2).datepicker();
});
</script>
}
}
在谷歌上搜索了很多之后,这个问题解决了。
在for循环中生成每个文本框,如下所示。
var id = "datepicker" + i;
@Html.TextBoxFor(modelitem => Model.InputParameters[i].Value,DateTime.Now.ToString("dd/MM/yyyy"), new { @id = id, @class = "datepicker"})
和新的javascript (IE6,7需要doc ready)
$(document).ready(function () {
$('.datepicker').each(function () {
$(this).datepicker({ dateFormat: "dd/mm/yy" });
});
});