在datatable中单击按钮将表列更改为jquery日历

我有以下数据表：

代码如下：

HTML:

 <table id="rentals" class="table table-bordered table-hover">
        <thead  bgcolor="#ADD8E6">
        <tr>                   

            <th>Book Name</th>
            <th>Date Rented</th>
            <th>Estimated Return Date</th>
            <th></th>

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

table = $("#rentals").DataTable({
    ajax: {
              url: query,
              dataSrc: ""
          },

          columns: [
                    {
                        {
                        data: "book.title"
                    },
                    {
                        data: "dateRented",
                        render: function (data) {
                            returnDate = data;
                    },
                     {
                        data: "estimatedReturnDate",
                        render: function (data) {
                                var date = new Date(data);
                                var month = date.getMonth() + 1;
                                var day = date.getDay();
                            return date.getDate() + "/" + month + "/" + date.getFullYear();
                     }
          ]
});

我希望“预计返回日期”列更改为jquery datepicker，默认值等于用户单击“单击我”按钮时该列的日期值，并在用户单击取消按钮时更改回文本字段

---

我怎样才能做到这一点

我认为一个简单的事件侦听器应该完成这项工作。试试这个：

$（文档）。在（'click'，'button'，function（）上{
var td=$（this.closest（'tr'）.find（'.date'）；
var picker=td.find（'.datepicker'）；
if（选择器长度）{
html（picker.val（））；
}否则{
td.html（“”）；
var picker=td.find（'.datepicker'）；
picker.datepicker（）；
}
})

书名
租用日期
预计返回日期
书
20/12/2017
20/12/2017
点击我

非常感谢。我必须稍微旋转一下它才能使它与datatable一起工作。如果我想取消“单击我”按钮并在列本身上切换datepicker。。如何访问td？只需将一些类添加到此列，并在事件处理程序

$（文档）中使用此类。在（'click'，'some class'，function（）{..

）。