我想使用Kendo DatePicker将结束日期设置为在Kendo网格中的开始日期之后

时间:2015-05-21 04:56:00

标签: jquery kendo-ui kendo-grid kendo-datepicker

    function dateEditor(container, options) {

        $("<input data-bind='value:" + options.field + "' />")
               .appendTo(container)
               .kendoDatePicker({
                   format: "dd MMMM yyyy",
                   min:new Date(2000,0,1),
                   change: function (e) {
                       $('div[data-container-for=' + options.field + ']').find('div[class="k-widget k-tooltip k-tooltip-validation k-invalid-msg field-validation-error"]').remove();

                   }
               });

    }

startdate和enddate都使用相同的功能 这是Kendo代码,这里是网格表示 任何人都可以帮我解决这个问题吗?

  {
                field: "StartDate",
                title: "Subsidy starts",
                hidden: true,
                type: "date",
                format: "{0:dd MMMM yyyy}",
                editor: dateEditor,

            },
            {
                field: "EndDate",
                title: "Subsidy ends",
                type: "date",
                format: "{0:dd MMMM yyyy}",

                editor: dateEditor,

            },

2 个答案:

答案 0 :(得分:0)

你可以这样做

  function startChange() {
    var startPicker = $("#datepickerStart").getKendoDatePicker();
    var endPicker = $("#datepickerEnd").getKendoDatePicker();
                var startDate = startPicker.value(),
                endDate = endPicker.value();

                if (startDate) {

                    startDate = new Date(startDate);
                    startDate.setDate(startDate.getDate());
                    endPicker.min(startDate);
                } else if (endDate) {
                    startPicker.max(new Date(endDate));
                } else {
                    endDate = new Date();
                    startPicker.max(endDate);
                    endPicker.min(endDate);
                }

            }
$("#datepickerStart").kendoDatePicker({
                change: startChange
            }).data("kendoDatePicker"); 
    });

  function dateEditor(container, options) {

$("<input data-bind='value:" + options.field + "' />")
       .appendTo(container)
       .kendoDatePicker({
           format: "dd MMMM yyyy",
           min:new Date(2000,0,1)

});
}

参考working demo here

答案 1 :(得分:0)

 $("<input data-bind='value:" + options.field + "' />")

               .appendTo(container)
               .kendoDatePicker({
                   format: "dd MMMM yyyy",
                 value: new Date(),
                   change: function (e) {
                       $('div[data-container-for=' + options.field + ']').find('div[class="k-widget k-tooltip k-tooltip-validation k-invalid-msg field-validation-error"]').remove();


                       var Start = $("input[data-bind='value:StartDate']").data("kendoDatePicker").value();
                       var end = $("input[data-bind='value:EndDate']").data("kendoDatePicker").value();
                       $("input[data-bind='value:EndDate']").data("kendoDatePicker").min(Start);
                       if(Start>end)

                           $("input[data-bind='value:EndDate']").data("kendoDatePicker").value(Start);


                   }
               });
        }

    function endDateEditor(container, options) {
        $("<input data-bind='value:" + options.field + "' />")
               .appendTo(container)
               .kendoDatePicker({
                   format: "dd MMMM yyyy",

                   change: function (e) {
                       $('div[data-container-for=' + options.field + ']').find('div[class="k-widget k-tooltip k-tooltip-validation k-invalid-msg field-validation-error"]').remove();

                   }
               });

    }

我使用新的Date()来获取值