Enable/Disable

Kendo Grid columns Hide Show, Enable/Disable

I am going to share the code sample for show/hide, enable/disable columns using kendo ui grid as given below.

Table of Contents

1. Kendo ui code sample using MVC 4
2. jQuery code sample

Kendo ui code sample using MVC 4

model IEnumerable<PCX.Models.Contract>
@{
    PCX.Models.UserSession userSession = (PCX.Models.UserSession)Session["userSession"];
}

@(Html.Kendo().Grid(Model)
            .Name("CSGrid")
            .Pageable()
            .Sortable()
            .Resizable(e => e.Columns(true))
            .Columns(columns =>
            {
                columns.Bound(clm => clm.CompanyName).Title("Company Name")
                        .Filterable(flt => flt.UI("CompanyFilter"));
                columns.Bound(clm => clm.name).Title("Contract Name");
                columns.Bound(clm => clm.installationdate).Title("IDate")
                       .Format("{0:dd MMM yyyy}").Filterable(false);
                columns.Bound(clm => clm.startdate).Title("SDate");
                columns.Bound(clm => clm.enddate).Title("EndDate").Filterable(false);
                columns.Template(clm => @Ajax.ActionLink("Renewal"
                                 "Create", "ServiceContract"
                                   new { ID = clm.ContractID }, 
                                   new AjaxOptions { HttpMethod = "Post" }, 
                                   new { @class = "btn btn-primary" })).Width(100);
            })
         .Filterable(filterable => filterable
         .Extra(false)
    )
)

jQuery Code Sample

<script type="text/javascript">
    $(document).ready(function () {
        var role = '@User.IsInRole(userSession.TenantID + "_Admin")';
        if (role) {
            var grdView = $('#ContractExpiration').data('kendoGrid');
            grdView.hideColumn("CompanyName"); //By Using Columns Name.
            grdView.hideColumn(3);//By Using Index of columns.
        }
    });

</script>

ANIL SINGH

Hey! I'm Anil Singh. I author this blog. I'm Active Blogger, Programmer. I love learning new technologies, programming, blogging and participating the forum discussions more...
My Blogs - http://www.code-sample.com and http://www.code-sample.xyz
My Books - Google Amazon and Flipkart Book Store!

You Might Also Like
Post a Comment
www.code-sample.com/. Powered by Blogger.
ASK Questions
SQL Server NodeJs TypeScript JavaScript Angular SQL Server My Book