Question

我正在使用Asp .Net MVC3以下是视图页面，

<link rel="stylesheet" href="@Url.Content("~/Content/CSS/jquery-ui.css")">  
<script src="@Url.Content("~/Content/Scripts/jquery-1.9.1.js")"></script>  
<script src="@Url.Content("~/Content/Scripts/jquery-ui-1.10.4.js")"></script>  
<script type="text/javascript">
    $(function () {
        $("#Reqrecdt").datepicker();
        $("#Docsreqdt").datepicker();
    });
</script>

@for(i = 0; i <= 3; i++) {
    <tr>
        <td><input type="text" name="ReqrecdDate" id="Reqrecdt" /></td>
        <td><input type="text" name="DocsreqDate" id="Docsreqdt" /></td>
    </tr>
}

在运行解决方案时，我只为第一行文本框获取了Datepicker。我需要更改以使用jquery在动态行上获取datepicker？

Answer 1

由于id必须是唯一的，因此您需要使用class：

@for(i = 0; i <= 3; i++) {
    <tr>
        <td><input type="text" name="ReqrecdDate" class="Reqrecdt" /></td>
        <td><input type="text" name="DocsreqDate" class="Docsreqdt" /></td>
    </tr>
}

然后您可以使用.按类名来定位元素：

$(function () {
    $(".Reqrecdt").datepicker();
    $(".Docsreqdt").datepicker();
});

Answer 2

id属性在页面中必须是唯一的。考虑到这一点，您需要使用class代替：

<script type="text/javascript">
    $(function () {
        $(".Reqrecdt").datepicker();
        $(".Docsreqdt").datepicker();
    });
</script>

@for(i = 0; i <= 3; i++) {
    <tr>
        <td><input type="text" name="ReqrecdDate" class="Reqrecdt" /></td>
        <td><input type="text" name="DocsreqDate" class="Docsreqdt" /></td>
    </tr>
}

Answer 3

您的结果标记将具有多个具有相同ID的元素，因此第一个是脚本将命中的所有元素。使用class class =“Reqrecdt”并将脚本更改为$（“。Reqrecdt”）。datepicker（）;

如何将datepicker用于动态填充的行？

3 个答案: