I'm working with a kendo grid in which a column consists of kendodatetimepicker
.
User will be able to edit date and time for only yesterday and today.
So, when he clicks the edit button on the grid the datetimepicker
should first show current date and time as default
My grid looks like this--
columns: [
{ field: "EntryType", title: "Entry Type", width: "50px", editor: $scope.typeDropDownEditor, template: "#=EntryType#" },
{ field: "Chemical", title: "Chemical Name", width: "50px", editor: $scope.chemicalDropDownEditor,template: "#=Chemical.ChemicalName#" },
{ field: "Facility", title: "Facility Name", width: "50px", editor: $scope.facilityDropDownEditor, template: "#=(Facility.FacilityName==null)? '' : Facility.FacilityName #" },
{ field: "RecordedDate", title: "Date - Time", format: 'yyyy-mm-dd HH:mm:ss', editor: dateTimeEditor, width: "50px" },
{ field: "Remarks",title:"Remarks",width:"60px"},
{ field: "Volume", title: "Volume", width: "50px" },
{
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: "50px"
}],
editable: "inline",
datetimepicker
editor--
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({
value: $scope.tdate,
dateInput: true,
max: new Date(),
min: $scope.ydate,
//template: "#= kendo.toString(kendo.parseDate(value), 'yyyy-mm-dd HH:mm:ss') #"
});
}
tdate and ydate are defined as--
var today = new Date();
var yday = today.getDate() - 1;
var tday = today.getDate();
var month = today.getMonth();
var year = today.getFullYear();
var hour = today.getHours();
var minute = today.getMinutes();
var seconds = today.getSeconds();
$scope.ydate = (new Date(year, month, yday, hour, minute, seconds));
$scope.tdate = (new Date(year, month, tday, hour, minute, seconds));
Putting current date in value field is not giving the required output
You can try for this.: StartDate is the id of kendoDatePicker, where you want to show the default date:
Html:
<input id="datepickerjQuery">
<script>
var todayDate = kendo.toString(kendo.parseDate(new Date()), 'MM/dd/yyyy');
$("#datepickerjQuery").data("kendoDatePicker").value(todayDate);
</script>