CODEWITHSUNDEEP
javascriptangularjskendo-uikendo-griddatetimepicker
KGP
KGP

Reputation: 350

How to set Min/Max for date picker in KendoDateTimePicker using AngularJs

I'm working with a kendo grid which has a datetimepicker as a column in every row.

The datetimepicker should only allow user to pick yesterday's and today's dates and time is flexible.

I've tried in many ways but I'm not able to get it done.

My grid columns are-

 { field: "Fac", title: "Fac Name", width: "100px", editor: $scope.facDropDownEditor, template: "#=(FacFacyName==null)? '' : Fac.FacName #" },
          { field: "RecordedDate", title: "Date - Time", format: "{0:yyyy-MM-dd HH:mm}", editor: dateTimeEditor, width: "100px" },
          { field: "Remarks",title:"Remarks",width:"120px"},
        { field: "Volume", title: "Volume", width: "100px" },
    {
        command: [
           {
               name: "edit", title: "Edit", "template": "<a class='k-button k-grid-edit' href='' style='min-width:40px;' title=\"Edit\"><span class='k-icon k-i-edit'></span></a>"
           },
        ], field: "Actions",title:"Actions", width: "60px"
    }

My datetimeEditor is-

function dateTimeEditor(container, options) {
    $('<input data-text-field="' + options.field + '" data-value-field="' + options.field + '" data-bind="value:' + options.field + '" data-format="' + options.format + '"/>')
            .appendTo(container)
            .kendoDateTimePicker({});
}

How to edit datepicker so that I get only today's and yesterday's dates selectable

Upvotes: 2

Views: 1818

Answers (1)

Pratik Thube
Pratik Thube

Reputation: 134

hope this will help! 

function dateTimeEditor(container, options) {
        $('<input data-text-field="' + options.field + '" data-value-field="' + options.field + '" data-bind="value:' + options.field + '" data-format="' + options.format + '"/>')
                .appendTo(container)
                .kendoDateTimePicker({
                     max:new Date();//todays day
                     var yestarday= new Date();
                     yestarday.setDate(dt.getDate() - 1);
                     min:yestarday;//yestardays date
             });
}

Upvotes: 1

Related Questions