Auto open KendoDatePicker in editable KendoGrid control

2 posts, 0 answers
  1. Ian
    Ian avatar
    12 posts
    Member since:
    Feb 2016

    Posted 25 Feb Link to this post

    Hi,

    I'm having some trouble getting the KendoDatePicker control to automatically open when its cell is selected in my editable Kendo Grid control while using AngularJs.

    My editable column is defined as so:

    gridColumns.push({
        field: currentField.FieldName.replace(/ /g, "_"),
        title: currentField.FieldName,
        format:"{0:yyyy-MM-dd}",
        editor: $scope.dateTimeCmtEditor,
        template: "#= (" + currentField.FieldName.replace(/ /g, "_") + " == null || (typeof " + currentField.FieldName.replace(/ /g, "_") + " == 'undefined')) ? ' ' : kendo.toString(kendo.parseDate(" + currentField.FieldName.replace(/ /g, "_") + ", 'yyyy-MM-dd'), 'yyyy-MM-dd') #",
        width: 150
    });

     

    And my editor is defined like so:

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

     

    I would like the date picker to open automatically when the user either clicks in the cell or navigates to the cell using the keyboard and hits Enter.

    Thanks,

    Ian

  2. Alexander Popov
    Admin
    Alexander Popov avatar
    1416 posts

    Posted 01 Mar Link to this post

    Hi Ian, 

    This behavior is not supported out of the box. You could however, try utilizing the Grid's navigate event and the editCell method

    Regards,
    Alexander Popov
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Kendo UI is VS 2017 Ready
Back to Top