在jquery数据表中插入一个datepicker

Posted 2021-05-03

我有一个项目数据表，我想在一行中插入一个datepicker。我有这个，但它只显示输入而不是datepicker：

"render": function(data, type, full, meta){
                    var $tb = $("<input type='text' class='inlineevaldate' style='width:50px;'></input>");
                    $tb.attr("id", "etxt" + full[0]);
                    $("#etxt" + full[0]).val(full[12]);
                    return $tb.prop("outerhtml");
                }

我可以用这个更新日期：

initComplete : function(settings, json){
            $(".inlineevaldate").datepicker({
                changeMonth: true,
                changeYear: true,
                modal: false,
                autoClose: true,
                onSelect: function () {
                    $("#btnUpdateProject").focus();
                    var whichrow = $(this);
                    var id = whichrow[0].id;
                    var val = whichrow[0].value;
                    var projectid = whichrow[0].id.substring(4);
                    $.ajax({
                        type: 'POST',
                        data: { projectid : projectid, date : val },
                        url: '@Url.Action("SetProjectEvalDate")',
                        success: function(data){
                            if (data === "ERROR") {
                                ErrorDialog("#MessageDialog", "#lblError", "The was an error encountered, please try again later.", "Error");
                                return false;
                            }
                        }
                    });
                }
            });

但我无法设置输入的初始值。有任何想法吗？

答案

我用这个渲染列：

"render": function(data, type, full, meta){
                    var $tb = $("<input type='text' class='inlineevaldate' value='" + full[12] + "' style='width:50px;'></input>");
                    $tb.attr("id", "etxt" + full[0]);
                    return $tb.prop("outerHTML");
                }

然后在初始化表之后配置datepicker：

initComplete : function(settings, json){
            $(".inlineevaldate").datepicker({
                changeMonth: true,
                changeYear: true,
                modal: false,
                autoClose: true,
                onSelect: function () {
                    $("#btnUpdateProject").focus();
                    var whichrow = $(this);
                    var id = whichrow[0].id;
                    var val = whichrow[0].value;
                    var projectid = whichrow[0].id.substring(4);
                    $.ajax({
                        type: 'POST',
                        data: { projectid : projectid, date : val },
                        url: '@Url.Action("SetProjectEvalDate")',
                        success: function(data){
                            if (data === "ERROR") {
                                ErrorDialog("#MessageDialog", "#lblError", "The was an error encountered, please try again later.", "Error");
                                return false;
                            }
                        }
                    });
                }
            });