javascript - 如何在动态表中使用日期选择器选择日期？

Question

我的问题是如何在列的动态行中使用日期选择器。我在输入文本字段中使用了日期选择器，但它仅出现在日期列的第一行中。通过选择日期，不会选择日期。

 <table class="table table-bordered table-striped table-xxs" id="tb3">
                            <thead>
                                <tr>
                                    <th></th>
                                    <th>Bank Name</th>
                                    <th>Chq No</th>
                                    <th>Chq Date</th>
                                    <th>Amount</th>
                                    <th></th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr >
                                    <td><a href='javascript:void(0);' class='remove3'><span class='glyphicon glyphicon-remove'></span></a></td>
<td>

                                    <input style="width:100px" type="text" id="Product_Code"  class="form-control input-xs Product_Code "name="name[]"></td>

                                    <td ><input style="width:100px" type="text" id="Product_Name" class="form-control input-xs" name = "no[]"   > </td>


                                    <td><input type="text" class="form-control input-xs datepicker-dates" placeholder="Pick a date&hellip;" id="TDate" name="TDate" value="<?php echo date('d/m/Y') ?>"</td>

                                    <td><input style="width:80px" type="text" id="Rate"  class="form-control input-xs" value="" name="rate[]"></td>

                                    <td><a href="javascript:void(0);" style="font-size:18px;" id="addMore3" title="Add More Person"><span class="glyphicon glyphicon-plus"></td>



                                </tr>
                            </tbody>
                        </table>

这是表代码............

    <script>
$(function(){
    $('#addMore3').on('click', function() {
              var data = $("#tb3 tr:eq(1)").clone(true).appendTo("#tb3");
              data.find("input").val('');
     });
     $(document).on('click', '.remove3', function() {
         var trIndex = $(this).closest("tr").index();
            if(trIndex>0) {
             $(this).closest("tr").remove();
           } else {
             alert("Sorry!! Can't remove first row!");
           }
      });
});      
</script>

这是用于创建动态行和列的 JavaScript 代码。

Answer 1

试试这个:

<input type="text"  name="TDate" class="form-control" value="" id="datepicker">     
<script type="text/javascript">
    $(function () {
        $('#datepicker').datepicker();
    });</script>