Here is what I have changed my code to look like. I can set the header to locked and unlocked like you show above and I can inspect it using the developers tab console and see that the value for locked does change to true or false as desired. However, the columns on the grid do not freeze or unfreeze on the page. If I have the "Design Integration" header locked upon initialization it is locked on the page properly. When I check the box and execute the code $("#DIStatusGrid").data("kendoGrid").unlockColumn("Design Integration"); I inspect and see that the value for lock did indeed change to false but the columns still remain locked on the grid when scrolling. I know I have to be overlooking something simple but I just have not been able to figure it out.
@(Html.Kendo().Grid<DIStatus.Models.DistatusForGrid>
()
.Name(componentName: "DIStatusGrid")
.DataSource(dataSource => dataSource
.Ajax()
.Model(model => model.Id(p => p.Id))
.Read(read => read.Action(actionName: "DIStatusGrid_Read", controllerName: "Home"))
.Update(update => update.Action("DIStatusGrid_Update", "Home"))
.PageSize(pageSize: 50)
)
.Columns(columns =>
{
columns.Command(command =>
{
command.Custom("Edit").Text("Edit Page").Click(handler: "btnEdit");
command.Custom("Delete").Text("Delete").Click(handler: "btnDelete");
command.Edit().Text("Inline Edit").HtmlAttributes(new { id = "btnInlineEdit" });
}).Width(85).Locked(true).Lockable(true).HtmlAttributes(new { @style = "text-align:center;background-color:mistyrose;" }).HeaderHtmlAttributes(new { style = "background-color:mistyrose;" });
columns.Group(g0 => g0.Title("Ship").HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign", style = "font-weight:900;color:lime;" }).Locked(true).Lockable(true)
.Columns(si =>
{
si.Bound(p => p.Id).Title(text: "Id").Width(pixelWidth: 70).Filterable(value: false).Visible(false);
si.Bound(p => p.ShipId).Title(text: "Ship Id").Width(pixelWidth: 60).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
})
);
columns.Group(g1 => g1.Title("Design Integration").HtmlAttributes(new { id = "headerDI", name = "headerDI" }).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign", style = "font-weight:900;height:25px;" }).Locked(false).Lockable(true)
.Columns(di =>
{
di.Bound(p => p.UnitId).Title(text: "Unit Id").Width(pixelWidth: 60).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
di.Bound(p => p.AuthorityTypeId).Title(text: "Authority Type").Width(pixelWidth: 100).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
di.Bound(p => p.Milestone).Title(text: "Milestone").Width(pixelWidth: 80).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
di.Bound(p => p.TrackingNumber).Title(text: "Tracking # (IFC, A/I, etc.)").Width(pixelWidth: 150).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
di.Bound(p => p.ReferenceNumber).Title(text: "Related / Ref # / Drawing #").Width(pixelWidth: 125).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
di.Bound(p => p.Description).Title(text: "Description").Width(pixelWidth: 300).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
di.Group(di1 => di1.Title("Model Impacter").HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign", style = "font-weight:900;" })
.Columns(mi =>
{
mi.Bound(p => p.RespDrawings).Title(text: "Resp Drawings").Width(pixelWidth: 100).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
mi.Bound(p => p.AffectedDrawings).Title(text: "Affected Drawings").Width(pixelWidth: 100).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
})
);
di.Bound(p => p.Compartment).Title(text: "Compartment").Width(pixelWidth: 100).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
di.Bound(p => p.Originator).Title(text: "Originator or D.I. Checker").Width(pixelWidth: 100).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
di.Bound(p => p.DateEntered).Title(text: "Date Entered").Width(pixelWidth: 85).Editable("IsDIEditable").Format(value: "{0:MM/dd/yyyy}").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
di.Bound(p => p.DisciplineId).Title(text: "Discipline").Width(pixelWidth: 100).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
di.Bound(p => p.AssignedTo).Title(text: "Assigned to Person").Width(pixelWidth: 100).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
di.Bound(p => p.NeedDate).Title(text: "Need Date").Width(pixelWidth: 100).Editable("IsDIEditable").Format(value: "{0:MM/dd/yyyy}").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
di.Bound(p => p.ViolationId).Title(text: "YES=1 Clr Violation, Other or Hard Hit").Width(pixelWidth: 100).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
di.Bound(p => p.PresidentsGoal).Title(text: "Pres Goal").Width(pixelWidth: 70).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
})
);
columns.Group(g2 => g2.Title("Transfer Info").HeaderHtmlAttributes(new { @class = "DIStatusGridOrangeHeader CenterAlign", style = "font-weight:900;" }).Locked(false).Lockable(true)
.Columns(ti =>
{
ti.Group(ti1 => ti1.Title("Email Required").HeaderHtmlAttributes(new { @class = "DIStatusGridOrangeHeader CenterAlign FontColRed", style = "font-weight:900;" })
.Columns(er =>
{
er.Bound(p => p.TransferDisciplineId).Title(text: "Disc IFC Is being transfered to").Width(pixelWidth: 100).Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridOrangeHeader CenterAlign" });
er.Bound(p => p.TransferDesigner).Title(text: "Designer Name").Width(pixelWidth: 85).Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridOrangeHeader CenterAlign" });
er.Bound(p => p.TransferDate).Title(text: "Designer Date Accepted").Width(pixelWidth: 85).Format(value: "{0:MM/dd/yyyy}").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridOrangeHeader CenterAlign" });
})
);
})
);
columns.Group(g3 => g3.Title("Discipline Currently Assigned To").HeaderHtmlAttributes(new { @class = "DIStatusGridYellowHeader CenterAlign", style = "font-weight:900;" }).Locked(false).Lockable(true)
.Columns(dcat =>
{
dcat.Bound(p => p.ClearedBy).Title(text: "Cleared by / Assigned to (Name)").Width(pixelWidth: 100).Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridYellowHeader CenterAlign" });
dcat.Bound(p => p.ActionTaken).Title(text: "Action Taken / Clearance Comments").Width(pixelWidth: 400).Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridYellowHeader CenterAlign" });
dcat.Bound(p => p.Status).Title(text: "Status").Width(pixelWidth: 85).Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridYellowHeader CenterAlign" });
dcat.Bound(p => p.PentRelatedItem).Title(text: "Pent Related Item").Width(pixelWidth: 85).Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridYellowHeader CenterAlign" });
dcat.Group(g2 => g2.Title("Manager Approval").HeaderHtmlAttributes(new { @class = "DIStatusGridYellowHeader CenterAlign", style = "font-weight:900;" })
.Columns(ma =>
{
ma.Bound(p => p.SatAsIs).Title(text: "Sat As Is").Width(pixelWidth: 80).Editable("IsManagerEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridRoseHeader CenterAlign" });
ma.Bound(p => p.ManagerApproval).Title(text: "Sat as is (Email reqd)").Editable("IsManagerEditable").Width(pixelWidth: 85).Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridRoseHeader CenterAlign" });
ma.Bound(p => p.ManagerApprovalDate).Title(text: "Manager Approval Date").Editable("IsManagerEditable").Width(pixelWidth: 85).Format(value: "{0:MM/dd/yyyy}").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridRoseHeader CenterAlign" });
ma.Bound(p => p.ManagerApprovalExplanation).Title(text: "Manager Approval Explanation").Editable("IsManagerEditable").Width(pixelWidth: 250).Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridRoseHeader CenterAlign" });
})
);
dcat.Bound(p => p.ClearanceCompleteDate).Title(text: "Clearance Complete Date").Width(pixelWidth: 85).Format(value: "{0:MM/dd/yyyy}").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridYellowHeader CenterAlign" });
dcat.Bound(p => p.Reserved).Title(text: "Reserved").Width(pixelWidth: 85).Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridYellowHeader CenterAlign" });
})
);
columns.Group(g4 => g4.Title("Des Int").HeaderHtmlAttributes(new { @class = "DIStatusGridSeaGreenHeader CenterAlign", style = "font-weight:900;" }).Locked(false).Lockable(true)
.Columns(compt =>
{
compt.Group(compt1 => compt1.Title("Compt").HeaderHtmlAttributes(new { @class = "DIStatusGridSeaGreenHeader CenterAlign", style = "font-weight:900;" })
.Columns(cpt =>
{
cpt.Bound(p => p.IfcbackChecker).Title(text: "IFC Back Check Compl (Name)").Width(pixelWidth: 100).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridSeaGreenHeader CenterAlign" });
cpt.Bound(p => p.IfcbackCheckerDate).Title(text: "IFC Back Check Compl (Date)").Width(pixelWidth: 100).Editable("IsDIEditable").Format(value: "{0:MM/dd/yyyy}").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridSeaGreenHeader CenterAlign" });
cpt.Bound(p => p.DesignChangeToFix).Title(text: "Did Design Change to Fix IFC").Width(pixelWidth: 100).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridSeaGreenHeader CenterAlign" });
})
);
compt.Group(g2a => g2a.Title("Reject").HeaderHtmlAttributes(new { @class = "DIStatusGridSeaGreenHeader CenterAlign FontColRed", style = "font-weight:900;" })
.Columns(rej1 =>
{
rej1.Bound(p => p.RejectedBy).Title(text: "IFC Back Check Rejected (Name)").Width(pixelWidth: 125).Editable("IsDIEditable").Filterable(value: true).Visible(true).HtmlAttributes(new { @class = "FontColRed", Style = "text-align:left;" }).HeaderHtmlAttributes(new { @class = "DIStatusGridSeaGreenHeader CenterAlign RedHeaderFont" });
})
);
compt.Group(g2b => g2b.Title("Reject").HeaderHtmlAttributes(new { @class = "DIStatusGridSeaGreenHeader CenterAlign FontColRed", style = "font-weight:900;" })
.Columns(rej1 =>
{
rej1.Bound(p => p.RejectedDate).Title(text: "IFC Back Check Rejected (Date)").Width(pixelWidth: 85).Editable("IsDIEditable").Format(value: "{0:MM/dd/yyyy}").Filterable(value: true).Visible(true).HtmlAttributes(new { @class = "FontColRed", Style = "text-align:left;" }).HeaderHtmlAttributes(new { @class = "DIStatusGridSeaGreenHeader CenterAlign RedHeaderFont" });
})
);
})
);
columns.Group(g5 => g5.Title("Disc").HeaderHtmlAttributes(new { @class = "DIStatusGridYellowHeader CenterAlign", style = "font-weight:900;" }).Locked(false).Lockable(true)
.Columns(disc =>
{
disc.Bound(p => p.DiscBackFixName).Title(text: "Disc Back Fix Compl (Name)").Width(pixelWidth: 85).Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridYellowHeader CenterAlign" });
disc.Bound(p => p.DiscBackFixDate).Title(text: "Disc Back Fix Compl (Date)").Width(pixelWidth: 85).Format(value: "{0:MM/dd/yyyy}").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridYellowHeader CenterAlign" });
})
);
columns.Bound(p => p.Remarks).Title(text: "Remarks / RFS #").Width(pixelWidth: 200).Filterable(value: true).Locked(false).Lockable(true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridCyanHeader CenterAlign" });
columns.Group(g6 => g6.Title("Des Int").HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign", style = "font-weight:900;" }).Locked(false).Lockable(true)
.Columns(loc =>
{
loc.Bound(p => p.Location).Title(text: "Location").Width(pixelWidth: 75).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
loc.Bound(p => p.OptSeq).Title(text: "Opt Seq").Width(pixelWidth: 75).Editable("IsDIEditable").Filterable(value: true).Visible(true).HeaderHtmlAttributes(new { @class = "DIStatusGridLimeHeader CenterAlign" });
})
);
})
.Events(e => e.DataBound("dataBound"))
.HtmlAttributes(new { style = "height:800px;border:solid;border-width:thin;width:auto;" })
.Pageable(pageable => pageable
.Input(enabled: true)
.Numeric(enabled: false)
.Refresh(enabled: true)
)
.Sortable()
.Resizable(resize => resize.Columns(true))
.Reorderable(reorder => reorder.Columns(false))
.Scrollable(scr => scr.Height(pixelHeight: 400))
.Selectable(selectable => selectable.Mode(GridSelectionMode.Single).Type(GridSelectionType.Row))
.Filterable()
.ColumnMenu()
.Editable(editable => editable.Mode(GridEditMode.InLine))
)