This is a migrated thread and some comments may be shown as answers.

[Solved] Complex Client Side Templates Simplified

0 Answers 38 Views

General Discussions

This is a migrated thread and some comments may be shown as answers.

This question is locked. New answers and comments are not allowed.

Jason Tully asked on 20 Apr 2012, 02:59 PM

How many times have you created the following monster:

@(Html.Telerik().Grid<Sbc.UI.Web.Admin.Models.TenantModel>().Name("Tenants")

.Columns(columns =>

{

columns.Bound(x => x.TenantName);

columns.Bound(x => x.Description);

columns.Bound(x => x.Configuration.Tenant.IsEnabled).ClientTemplate("<span style='margin-right:25px'>"+Html.Buttons().Secondary("<#=ToggleText#>", "javascript:Toggle( <#=Configuration.Tenant.TenantID#>,'<#=IsEnabled#>')").ToHtmlString() + "</span><span>"+ Html.Buttons().Tertiary("Recycle", "javascript:Recycle( <#=Configuration.Tenant.TenantID#>)").ToHtmlString()+"</span>").Title(""); columns.Bound(x => x.CreationDate);

columns.Bound(x => x.Configuration.Tenant.IsEnabled).ClientTemplate(buttonTemplate(null).ToString()).Title("");

})

My eyes are bleeding. There must be a better way. Alas, Delegated Razor Templates.

At the top of your razor template

@{

    Func<dynamic, object> buttonTemplate = @<div>

        <span style='margin-right: 25px'>

            @Html.Buttons().Secondary("<#=ToggleText#>", "javascript:Toggle( <#=Configuration.Tenant.TenantID#>,'<#=IsEnabled#>')")

        </span><span><#if(IsEnabled)

                if( IsActive)

                 { #>

                                    @Html.Buttons().Secondary("Recycle", "javascript:Recycle( <#=Configuration.Tenant.TenantID#>)")

                           <# } else { #>

                               @Html.Buttons().Tertiary("Start", "javascript:Recycle( <#=Configuration.Tenant.TenantID#>)")

            <# } }#></span>

    </div>;

Then update your code

@(Html.Telerik().Grid<Sbc.UI.Web.Admin.Models.TenantModel>().Name("Tenants")

.Columns(columns =>

{

columns.Bound(x => x.TenantName);

columns.Bound(x => x.Description);

columns.Bound(x => x.Configuration.Tenant.IsEnabled).ClientTemplate(buttonTemplate(null).ToString())Title("");

columns.Bound(x => x.CreationDate);

columns.Bound(x => x.Configuration.Tenant.IsEnabled).ClientTemplate(buttonTemplate(null).ToString()).Title("");

})

Monster contained. Let the healing begin.

I hope this helps someone.