[Solved] Checkbox not displayed in ClientDetailTemplate

[Shreesh]

Hello,

CheckBox is not displayed in the clientdetailtemplate. If I comment the .clienttemplate for checkbox then true or false is shown.
I am unable to find out why is this happening. However,  I can get checkbox working in the main grid (not part of clientdetailtemplate) in some other code/ place


The code for clientdetail template is given and I want IsReminder and IsPrivate to be checkboxes and this is not working...
------------------------------
<script id = "clientTab-template" type="text/kendo-templ">

@(Html.Kendo().TabStrip()
    .Name("tabStrip1")
    .SelectedIndex(0)
    .Animation(animation => animation.Open(open => open.Fade(FadeDirection.In)))
    .Items(items =>
    {
        items.Add().Text("Information").HtmlAttributes(new { @style = "font-size:x-small" }).Content(
       
       "<div id=Information >" +
            "<table class='table-thinborder100'>" +
                
                "<tr  style= 'border-bottom-style:solid; border-bottom-width:thin'>" +
                    "<td  class='col-width15'>" +
                            "<label> Street </label>"   +
                    "</td>" +
                    "<td class = 'col-width30 ls-label-field-ucase' >" +
                            " #=Address1# "  +
                    "</td>" +

                    "<td class='col-width20'>" +
                            "<label> Home Phone 2 </label>"   +
                    "</td>" +
                    "<td class = 'col-width35 ls-label-field-ucase' >" +
                            " #=Phone2#  "  +
                    "</td>" +
                "</tr>" +

                 "<tr>" +
                    "<td class='col-width15'>" +
                            "<label> EmpHomeAdd </label>"   +
                    "</td>" +
                    "<td class = 'col-width30 ls-label-field-ucase' >" +
                            " #=Address2# "  +
                    "</td>" +

                    "<td class='col-width20'>" +
                            "<label> Home Email 2 </label>"   +
                    "</td>" +
                    "<td class = 'col-width35 ls-label-field-ucase' >" +
                            " #=HomeEmail# "  +
                    "</td>" +
                "</tr>" +


                "<tr>" +
                    "<td class='col-width15'>" +
                            "<label> Status </label>"   +
                    "</td>" +
                    "<td class = 'col-width30 ls-label-field-ucase' >" +
                            " #=PartyStatus.StatusName# "  +
                    "</td>" +

                    "<td class='col-width20'>" +
                            "<label> Emp-ID </label>"   +
                    "</td>" +
                    "<td class = 'col-width35 ls-label-field-ucase' >" +
                            " #=EmployeeId# "  +
                    "</td>" +
                "</tr>" +

             "</table>" +
        "</div>"


       //     "<div  >" +
         //   "<label> EmpHomeAdd: </label>#=Address2# " + "," +
          // " <label> HomePhone2: </label>#=Phone2# " + " ," +
            //" <label> Status: </label>#=PartyStatus.StatusName# " +

            //"</div>"
            );


       items.Add().Text("Events").HtmlAttributes(new { @style = "font-size:x-small" }).Content(obj =>
           Html.Kendo().Grid<ERPLiteModelsServices.Areas.Home.Models.EventModel>()
            .Name("grid2")
            .Columns(columns =>
            {
                columns.Bound(o => o.EventStartDateTime).Title("Start").Width("8%").Format("{0:dd/MM/yyyy}").HtmlAttributes(new { @style = "font-size:x-small" });
                columns.Bound(o => o.EventEndDateTime).Title("End").Width("8%").Format("{0:dd/MM/yyyy}").HtmlAttributes(new { @style = "font-size:x-small" });
                columns.Bound(o => o.Customer.CustomerName).Title("Event-Cust").Width("8%").HtmlAttributes(new { @style = "font-size:x-small" });//.ClientTemplate("#=Customer.CustomerName#");
                columns.Bound(o => o.EventTitle).Title("Event-Title").Width("8%").HtmlAttributes(new { @style = "font-size:x-small" });
                columns.Bound(o => o.Description).Title("Description").Width("8%").HtmlAttributes(new { @style = "font-size:x-small" });
                columns.Bound(c => c.IsReminder).Title("Reminder").Width("3%").HtmlAttributes(new { @style = "font-size:x-small" }) .ClientTemplate("<input type='checkbox'> #= IsReminder ? checked='checked' : ''# disabled='disabled'></input>");
                columns.Bound(c => c.IsPrivate).Title("Private").Width("3%").HtmlAttributes(new { @style = "font-size:x-small" }) .ClientTemplate("<input type='checkbox' #= IsPrivate ? Checked='Checked' : ''# > </input>");
                columns.Bound(o => o.Category.CategoryName).Title("Event-Cust").Width("8%").HtmlAttributes(new { @style = "font-size:x-small" }); //.ClientTemplate("#=Category.CategoryName#");

                //columns.Command(commands =>
                //{
                  //   commands.Edit();

                //}).Title("Commands").Width("10%").HtmlAttributes(new { @style = "font-size:x-small" });
            })
             //.Editable(editable => editable.Mode(GridEditMode.InLine))
            .DataSource(source => source
               .Ajax()
                 //.PageSize(3)
               .Model(model =>
               {
                   model.Id(m => m.EventId);

               })
                   .Read(read => read.Action("Fetch", "Events", new { area = "DashBoard"}))  //SKK: Id of employee can be passed here
               //.Read(read => read.Action("GetwithId", "Employees", new { area = "People", id = "#=PartyId#" }))  //SKK: Id of employee can be passed here
                // .Update(update => update.Action("UpdateDetail", "Employees", new { area = "People" , id = "#=PartyId#"}))
               //.Update(update => update.Action("Update", "Employees", new { area = "People" }))
           )
                //.Pageable()
           .Sortable()
           .ToClientTemplate()

       );

       items.Add().Text("Projects").HtmlAttributes(new { @style = "font-size:x-small" }).Content(obj =>
           Html.Kendo().Grid<ERPLiteModelsServices.Areas.Home.Models.ProjectModel>()
            .Name("grid3")
            .Columns(columns =>
            {
                columns.Bound(o => o.ProjectName).Title("Name").Width("8%").HtmlAttributes(new { @style = "font-size:x-small" });
                columns.Bound(o => o.Description).Title("Description").Width("8%").HtmlAttributes(new { @style = "font-size:x-small" });
                columns.Bound(o => o.StartDate).Title("StartDate").Width("8%").Format("{0:dd/MM/yyyy}").HtmlAttributes(new { @style = "font-size:x-small" });
                columns.Bound(o => o.EndDate).Title("EndDate").Width("8%").Format("{0:dd/MM/yyyy}").HtmlAttributes(new { @style = "font-size:x-small" });
                columns.Bound(o => o.ProjManager.EmployeeName).Title("Projects-Manager").Width("8%").HtmlAttributes(new { @style = "font-size:x-small" });//.ClientTemplate("#=Customer.CustomerName#");
                                
                
                //columns.Command(commands =>
                //{
                  //   commands.Edit();

                //}).Title("Commands").Width("10%").HtmlAttributes(new { @style = "font-size:x-small" });
            })
             //.Editable(editable => editable.Mode(GridEditMode.InLine))
            .DataSource(source => source
               .Ajax()
                 //.PageSize(3)
               .Model(model =>
               {
                   model.Id(m => m.ProjectId);

               })
                   .Read(read => read.Action("Fetch", "Projects", new { area = "DashBoard"}))  //SKK: Id of employee can be passed here
               //.Read(read => read.Action("GetwithId", "Employees", new { area = "People", id = "#=PartyId#" }))  //SKK: Id of employee can be passed here
                // .Update(update => update.Action("UpdateDetail", "Employees", new { area = "People" , id = "#=PartyId#"}))
               //.Update(update => update.Action("Update", "Employees", new { area = "People" }))
           )
                //.Pageable()
           .Sortable()
           .ToClientTemplate()

       );



    })
    .ToClientTemplate()



    )
   
     


</script>

[Dimiter Madjarov]

Hello Shreesh,


You should escape the hash symbols (#) which are part of the client templates. Otherwise the Grid will try to retrieve the properties IsReminder and IsPrivate from it's parent.
E.g.

.ClientTemplate("<input type='checkbox'> \\#= IsReminder ? checked='checked' : ''\\# disabled='disabled'></input>");

Regards,
Dimiter Madjarov
Telerik