Custom popup editor - Kendo UI grid

Question

Is possible to have a user defined popup editor for kendo grid?? If yes how to add that editor??

i want below editor to popup when i click the edit button on the grid,

<div class="modal inmodal fade" id="myModal5" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header" style="padding-top: 10px;">
                </div>
                <div class="modal-body">


                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-white" data-dismiss="modal">Close</button>
                    <button type="button" class="btn btn-primary" ng-click="SaveZone()">Save</button>
                </div>
            </div>
        </div>
    </div>

Ademar Ademar · Accepted Answer · 2016-04-07T09:03:01

You need to specify kendo template like this:

<script id="custom_editor" type="text/x-kendo-template">
    <div>
        <label> some label </label>
    </div>
    <div>
        <input type="text" name="Name" />
    </div>
</script>

Note, that name parameter is needed to correctly map input to your field in model.

Then in your grid specifiy editable like this

...    
editable: {
    mode: "popup",
    template: kendo.template($("#custom_editor").html())
},
...

Custom popup editor - Kendo UI grid

1 Answers