1

这就是这种情况，我有一个根据 DB 的结果动态生成的表，并且我有一个使用 JQuery 显示日历的输入字段，我的问题是，如果我有多行结果，如果我更改 a 的值例如第 3 行中的日期，我看到要更改的第一行的值。

我想这是因为在我的 JQuery 函数中我得到 ElementByClass 而不是 ID，所以我认为我必须找到一种方法来 1）为每行/td 结果创建 id，然后 2）为每一行调用 JQUery 函数。

我怎样才能做到这一点？

按照代码：

<table border ="1">
                <tr>
                    <th>Project name</th>
                    <th>Project Description</th>
                    <th>Customer for this project</th>
                    <th>Project Amount</th>
                    <th>Project Start Date</th>
                    <th>Project End Date</th>
                    <th>Payment Method</th>
                    <th>Payment Action</th>


                </tr>
               <c:forEach items="${cpayments}" var="payment" >

                   <tr>
                    <form method="post" action="myController" onSubmit="return confirm('are you sure you want to update this record?')">
                        <td><input value="${payment.getPaymentId().getMyproject().getProjectName()}" name="projectNameEdit"/></td>
                        <td><input value="${payment.getPaymentId().getMyproject().getProjectDescription()}" name="projectDescriptionEdit"/></td>
                        <td><input value="${payment.getPaymentId().getMyproject().getFkCustomer().getCustomerName()}" name="customerNameEdit"/></td>

                        <td><input value="${payment.amount}" name="amount"/></td> 
                        <fmt:formatDate value="${payment.getPaymentId().getPaymentDate()}" 
                        type="date" 
                         pattern="MM-dd-yyyy"
                             var="theFormattedStartDate" />
                        <fmt:formatDate value="${payment.paymentExpire}"  
                        type="date" 
                         pattern="MM-dd-yyyy"
                             var="theFormattedExpireDate" />
                        <td><input value="${theFormattedStartDate}" id="payment_date" name="startDate" class="datepicker"/></td>
                        <td><input value="${theFormattedExpireDate}"   id="paymentToDate" name="endDate" class="datepicker"/></td>
                        <td><input value="${payment.paymentMethod}" name="paymentMethod" /></td>
                        <td><input value="${payment.getPaymentId().getMyaction().getActionName()}" name="paymentAction"/></td>
                        <td><input  name="edit" type="submit" value="Edit" style="background-color:green;font-weight:bold;color:white;" ></td>
                         <td><input  name="edit" type="submit" value="Delete" style="background-color:red;font-weight:bold;color:white;" ></td>
                         <input type="hidden" name="<%=WebParamsList.FROMPAGE%>" value="resultPage">


                       <input type="hidden" name="actionIdForEdit" value="${payment.getPaymentId().getMyaction().getActionId()}"> 
                       <input type="hidden" name="projectIdForEdit" value="${payment.getPaymentId().getMyproject().getProjectId()}">
                        <input type="hidden" name="<%=WebParamsList.ACTION_NAME%>" value="editProject">
                    </tr>
                    </form>



               </c:forEach>
            </table>

<script>

            $(document).ready(function() {
                $(".datepicker").datepicker();
            });


    </script>
4

1 回答 1

1

为了在 c:forEach 循环中为每个 td put 属性 varStatus="status" 生成动态 id。

与 datePicker 同名是问题所在。您需要为每个 datePicker 创建动态 id。

下面是修改后的代码。

 <c:forEach items="${cpayments}" var="payment" varStatus="status">

                   <tr>
                    <form method="post" action="myController" onSubmit="return confirm('are you sure you want to update this record?')">
                        <td><input value="${payment.getPaymentId().getMyproject().getProjectName()}" name="projectNameEdit"/></td>
                        <td><input value="${payment.getPaymentId().getMyproject().getProjectDescription()}" name="projectDescriptionEdit"/></td>
                        <td><input value="${payment.getPaymentId().getMyproject().getFkCustomer().getCustomerName()}" name="customerNameEdit"/></td>

                        <td><input value="${payment.amount}" name="amount"/></td> 
                        <fmt:formatDate value="${payment.getPaymentId().getPaymentDate()}" 
                        type="date" 
                         pattern="MM-dd-yyyy"
                             var="theFormattedStartDate" />
                        <fmt:formatDate value="${payment.paymentExpire}"  
                        type="date" 
                         pattern="MM-dd-yyyy"
                             var="theFormattedExpireDate" />
                        <td><input value="${theFormattedStartDate}" id="payment_date${status.index}" name="startDate${status.index}" class="datepicker"/></td>
                        <td><input  value="${theFormattedExpireDate}"   id="paymentToDate${status.index}" name="endDate${status.index}" class="datepicker"/></td>
                        <td><input value="${payment.paymentMethod}" name="paymentMethod" /></td>
                        <td><input value="${payment.getPaymentId().getMyaction().getActionName()}" name="paymentAction"/></td>
                        <td><input  name="edit" type="submit" value="Edit" style="background-color:green;font-weight:bold;color:white;" ></td>
                         <td><input  name="edit" type="submit" value="Delete" style="background-color:red;font-weight:bold;color:white;" ></td>
                         <input type="hidden" name="<%=WebParamsList.FROMPAGE%>" value="resultPage">


                       <input type="hidden" name="actionIdForEdit" value="${payment.getPaymentId().getMyaction().getActionId()}"> 
                       <input type="hidden" name="projectIdForEdit" value="${payment.getPaymentId().getMyproject().getProjectId()}">
                        <input type="hidden" name="<%=WebParamsList.ACTION_NAME%>" value="editProject">
                    </tr>
                    </form>



               </c:forEach>

你的 jQuery 选择器应该是

$("[id^=payment_date]").datepicker();
$("[id^=paymentToDate]").datepicker();
于 2013-08-22T11:04:32.570 回答