How to compine ClientRowTemplate and ClientDetailTemplateId

6 posts, 0 answers
  1. Joseph
    Joseph avatar
    5 posts
    Member since:
    Sep 2015

    Posted 09 Jun Link to this post

    Hello,

     

    I've a kendo Grid in MVC that used ClientRowTemplate for coloring rows depending on the given data. Now we want to add details grid while keeping the current row template.

    I've followed your example in http://demos.telerik.com/aspnet-mvc/grid/detailtemplate

    and I was able to add the details grid while I've to remove ClientRowTemplate  in order to have the grid rendered.

    I need an example showing how to use the ClientRowTemplate in both main grid and the details one, in MVC.

     

    Thanks You!

  2. Radoslav
    Admin
    Radoslav avatar
    1564 posts

    Posted 13 Jun Link to this post

    Hi Joseph,

    I am sending you a simple example which demonstrates the desired functionality. Please check it out and let me know if it helps you. Also please note that in order to have client template in the details grid, you need to escape the # sing in the details grid client template:
    ClientRowTemplate(
                 "<tr data-uid='#: uid #'>" +          
                "<td class='details'>" +
                        "<span class='title'>\\#: ProductName \\#</span>" +
                "</td>" +
                       "<td class='UnitPrice'>\\#: UnitPrice \\#" +
                    "</td>" +
                "<td class='employeeID'>" +
                            "\\#: UnitPrice \\#" +
                "</td>" +
             "</tr>"     
        )

    Also in order hierarchy to work as expected you need to add the expand icon and set the k-master-row as row’s class:
    .ClientRowTemplate(
                 "<tr data-uid='#: uid #' class='k-master-row'><td class='k-hierarchy-cell'><a class='k-icon k-plus' href='\\#' tabindex='-1'></a></td>" +
             
                
                "<td class='details'>" +

    If you need further assistance, do not hesitate to contact us again.

    Regards,
    Radoslav
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  3. UI for ASP.NET MVC is VS 2017 Ready
  4. Joseph
    Joseph avatar
    5 posts
    Member since:
    Sep 2015

    Posted 13 Jun in reply to Radoslav Link to this post

    Perfect Radoslav, Thank you!

    But I've another issue that I want to include all details grids in the search result.

    I'm currently have the following JS function to search in the main grid only:

         function searchKeyUp() {
                var selectedItem = $('#searchFilter').val(),
                    grid = $("#grid").data("kendoGrid"),
                    filter,
                    i;

                if (selectedItem) {
                    filter = { logic: "or", filters: [] };

                    filter.filters.push({ field: grid.columns[1].field, operator: "contains", value: selectedItem });


                    grid.dataSource.filter(filter);
                }
                else {
                    grid.dataSource.filter({});
                }



            }

  5. Radoslav
    Admin
    Radoslav avatar
    1564 posts

    Posted 15 Jun Link to this post

    Hello Joseph,

    Can you please elaborate a bit more on the desired functionality? Do you want to use the same filter criteria for the parent grid and for the child grids? If this is the case you can use the same logic (adding filter object and calling filter function) for the parent and child grids.

    Or you want to expand automatically all details grids when master grid is filtered? In this case you can iterate over grid rows and call expandRow function:

    Looking forward for your reply.

    Regards,
    Radoslav
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  6. Joseph
    Joseph avatar
    5 posts
    Member since:
    Sep 2015

    Posted 15 Jun in reply to Radoslav Link to this post

    Hello Radoslav,

    I want to use the same filter criteria for the parent grid and for the child grids, I've tried to do that while I faced the following:

    1- All child grids have to be expanded otherwise I can't filter as they are rendered on the run time once row expanded.

    2- If I filtered the parent with the same criteria, that will override the child grids result and even a child grid contains the filtered value it will be disappeared if its parent doesn't fit the filter criteria, as the parent itself will be disappeared. 

  7. Radoslav
    Admin
    Radoslav avatar
    1564 posts

    Posted 16 Jun Link to this post

    Hello Joseph,

    To achieve the desired functionality you can get the filter from the parent grid and apply it to the child grid datasource filter option. On the following link I created a small example which demonstrates this approach:
    http://dojo.telerik.com/OJUzo
    Please check it out and let me know if it helps you.

    Looking forward for your reply.

    Regards,
    Radoslav
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Back to Top
UI for ASP.NET MVC is VS 2017 Ready