Editor Template w/Kendo Grid - How?

2 posts, 0 answers
  1. GCS
    GCS avatar
    20 posts
    Member since:
    Apr 2013

    Posted 24 Nov 2015 Link to this post

    I'm trying to place a Kendo Grid inside of an EditorTemplate. I'll be using this as a select list, so to speak. 

     However, nothing I do seems to get my grid to display. Any examples on how to do something like this?  All the examples I see are basically simple control types.

     So given: 

     

    <script type="text/x-kendo-template" id="schedulerTemplate">
        <!-- What do I put here. -->
    </script>

    I thought the following would work inside of a $(function() {} block

    // Workout Grid
     $("#workoutgrid").kendoGrid({
         dataSource: {
     
             transport: {
                 read: {
                     url: "/Workout/GetWorkoutList/",
                     dataType: "json"
                 },
                 create: {
                     url: "/Workout/Create/",
                     type: "POST",
                     dataType: "json"
                 }
             },
             batch: true,
             pageSize: 20,
             schema: {
                 model: {
                     id: "Id",
                     fields: {
                         Id: { editable: false, nullable: true },
                         Name: { type: "string" },
                         Description: { type: "string" }
                     }
                 }
             }
         },
         pageable: true,
         sortable: true,
         silectable: true,
         selectable: true,
         reorderable: true,
         resizable: true,
         pageable: true,
         filterable: {
             mode: "row"
         },
         toolbar: [{
             template:
                 '<a class="k-button k-grid-custom-command" href="/Admin/Movement/Edit/#=0#">Add New</a>'
         }],
         columns: [
             { hidden: true, field: "Id" },
             {
                 field: "Name", title: "Workout", filterable: {
                     cell: {
                         operator: "contains"
                     }
                 }
             },
             {
                 field: "Description", title: "Description", filterable: {
                     cell: {
                         operator: "contains"
                     }
                 }
             },
             {
                 field: "WorkoutTypeId", title: "WorkoutType", filterable: {
                     cell: {
                         operator: "contains"
                     }
                 }
             }]
         //{ title: "Action", width: 80, template: '<a href="/Admin/Movement/Edit/#=Id#">Edit</a>' }]
     });

    No dice, however.  Any suggestions? 

     

  2. Vladimir Iliev
    Admin
    Vladimir Iliev avatar
    2172 posts

    Posted 26 Nov 2015 Link to this post

    Hi Dave,

    Currently we have no such example for the Scheduler, however you can check the following one which shows valid approach that can be used in your case:

    Regards,
    Vladimir Iliev
    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