Masked Input for inline grid editing

5 posts, 1 answers
  1. Anthony
    Anthony avatar
    6 posts
    Member since:
    Jul 2012

    Posted 07 Apr 2014 Link to this post

    I am looking for some guidance for this application of the Masked Input Box. Simply stated I want to use it in conjunction with the Kendo grid. The research I have done reveals that row templates are not supported for grids with inline editing, and that eliminates one possible straightforward approach. I would be interested if anyone has made this scenario work.

    Cheers
  2. Answer
    Alexander Valchev
    Admin
    Alexander Valchev avatar
    2875 posts

    Posted 09 Apr 2014 Link to this post

    Hi Anthony,

    If I understood correctly you would like to use the Masked Input Box as an editor in the Grid. If that is the case please follow this example:
    Demo page demonstrates how to create DropDownList editor but the same approach applies for MaskedInput.

    Regards,
    Alexander Valchev
    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
  4. Anthony
    Anthony avatar
    6 posts
    Member since:
    Jul 2012

    Posted 09 Apr 2014 in reply to Alexander Valchev Link to this post

    Thanks for the help! The Dojo is great!
  5. Gerry
    Gerry avatar
    7 posts
    Member since:
    Sep 2012

    Posted 14 Jul 2014 Link to this post

    Hmm;

    I have tried and this idea does not retain the original value.

    Here is my code as of right now:

    function GeneratePostalCode_EditMask(container, options) {
        $('<input id="postalCodeEditMask" "value=' + options.model.PostalCode + '"/>')
                .appendTo(container)
                .kendoMaskedTextBox({mask: "L0L 0L0"});
    }










  6. Gerry
    Gerry avatar
    7 posts
    Member since:
    Sep 2012

    Posted 14 Jul 2014 in reply to Gerry Link to this post

    Sorry for the bother.

    This works:

        $('<input id="postalCodeEditMask" data-text-field="PostalCode" data-value-field="PostalCode" data-bind="value:' + options.field + '"/>')
                .appendTo(container)
                .kendoMaskedTextBox({
                    mask: "L0L 0L0",
                    value: options.model.PostalCode
                });
Back to Top
Kendo UI is VS 2017 Ready