I have a grid that is in batch edit mode and I'm including the ability to mass update the current filtered view. What I can't seem to get to work is the addition of the css class k-dirty-cell to those changed cells and even the previously adjusted batch edit cells lose their red triangle as well. Any ideas?
The grid:
@(Html.Kendo().Grid<AELIS3.ShuttleCust.Entities.ActivePlan>()
.Name("ActivePlan")
.Columns(columns =>
{
columns.Bound(p => p.Account)
.Filterable(filterable => filterable.UI("accountFilter").Extra(false))
.Width(100);
columns.Bound(p => p.Origin)
.Filterable(filterable => filterable.UI("originFilter").Extra(false))
.Width(85);
columns.Bound(p => p.CustomerName)
.Filterable(filterable => filterable.UI("customerFilter").Extra(false))
.Width(250);
columns.Bound(p => p.City)
.Filterable(filterable => filterable.UI("citiesFilter").Extra(false))
.Width(125);
columns.Bound(p => p.State)
.Filterable(filterable => filterable.UI("statesFilter").Extra(false))
.Width(85);
columns.Bound(p => p.Sun)
.Filterable(filterable => filterable.UI("warehouseFilter").Extra(false))
.ClientTemplate("#if(SunLock === true){#<span class='red'>#: Sun #</span>#} else {#<span class='black'>#: Sun#</span>#}#")
.EditorTemplateName("_WRHS_Sunday");
columns.Bound(p => p.Mon)
.Filterable(filterable => filterable.UI("warehouseFilter").Extra(false))
.ClientTemplate("#if(MonLock === true){#<span class='red'>#: Mon #</span>#} else {#<span class='black'>#: Mon#</span>#}#")
.EditorTemplateName("_WRHS_Monday");
columns.Bound(p => p.Tue)
.Filterable(filterable => filterable.UI("warehouseFilter").Extra(false))
.ClientTemplate("#if(TueLock === true){#<span class='red'>#: Tue #</span>#} else {#<span class='black'>#: Tue#</span>#}#")
.EditorTemplateName("_WRHS_Tuesday");
columns.Bound(p => p.Wed)
.Filterable(filterable => filterable.UI("warehouseFilter").Extra(false))
.ClientTemplate("#if(WedLock === true){#<span class='red'>#: Wed #</span>#} else {#<span class='black'>#: Wed#</span>#}#")
.EditorTemplateName("_WRHS_Wednesday");
columns.Bound(p => p.Thu)
.Filterable(filterable => filterable.UI("warehouseFilter").Extra(false))
.ClientTemplate("#if(ThuLock === true){#<span class='red'>#: Thu #</span>#} else {#<span class='black'>#: Thu#</span>#}#")
.EditorTemplateName("_WRHS_Thursday");
columns.Bound(p => p.Fri)
.Filterable(filterable => filterable.UI("warehouseFilter").Extra(false))
.ClientTemplate("#if(FriLock === true){#<span class='red'>#: Fri #</span>#} else {#<span class='black'>#: Fri#</span>#}#")
.EditorTemplateName("_WRHS_Friday");
columns.Bound(p => p.Sat)
.Filterable(filterable => filterable.UI("warehouseFilter").Extra(false))
.ClientTemplate("#if(SatLock === true){#<span class='red'>#: Sat #</span>#} else {#<span class='black'>#: Sat#</span>#}#")
.EditorTemplateName("_WRHS_Saturday");
})
.Editable(editable => editable.Mode(GridEditMode.InCell))
.DataSource(dataSource => dataSource
.Ajax()
.Batch(true)
.ServerOperation(false)
.PageSize(18)
.Group(groups => groups.Add(p => p.WeekBegin))
.Read(read => read.Action("ActivePlan_Read", "ShuttleCustomer").Data("weekReturn"))
.Update(update => update.Action("ActivePlan_Update", "ShuttleCustomer"))
.Model(model =>
{
model.Id(p => p.AccountID);
model.Field(p => p.Account).Editable(false);
model.Field(p => p.Origin).Editable(false);
model.Field(p => p.CustomerName).Editable(false);
model.Field(p => p.City).Editable(false);
model.Field(p => p.State).Editable(false);
model.Field(p => p.WeekBegin).Editable(false);
model.Field(p => p.WeekNo).Editable(false);
model.Field(p => p.Sun).Editable(true);
model.Field(p => p.SunLock).Editable(false);
model.Field(p => p.Mon).Editable(true);
model.Field(p => p.MonLock).Editable(false);
model.Field(p => p.Tue).Editable(true);
model.Field(p => p.TueLock).Editable(false);
model.Field(p => p.Wed).Editable(true);
model.Field(p => p.WedLock).Editable(false);
model.Field(p => p.Thu).Editable(true);
model.Field(p => p.ThuLock).Editable(false);
model.Field(p => p.Fri).Editable(true);
model.Field(p => p.FriLock).Editable(false);
model.Field(p => p.Sat).Editable(true);
model.Field(p => p.SatLock).Editable(false);
})
)
.Pageable(pageable => pageable.ButtonCount(5))
.Events(e => e.FilterMenuInit("FilterMenuFunc"))
.ToolBar(toolbar => {
toolbar.Save();
})
.Selectable(selectable => selectable.Mode(GridSelectionMode.Multiple))
.Filterable(filtering => filtering.Enabled(true))
.Groupable(grouping => grouping.Enabled(true))
.Sortable(sorting => sorting.Enabled(true))
.Scrollable(scrolling => scrolling.Enabled(true).Height("auto"))
)
The mass batch update function:
function iterateAll()
{
var col = document.getElementById('dow').value;
var value = document.getElementById('warehouses').value;
var grid = $('#ActivePlan').data('kendoGrid');
grid.select(grid.tbody.find(">tr"));
var selected = grid.select();
var days = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
var colIdx = days.indexOf(col);
for (var i = 0, max = selected.length ; i < max ; i++) {
grid._data[i].set(col, value); //works perfects
grid.tbody.find('td:nth-child(' + (colIdx + 7) + ')').addClass('k-dirty-cell'); //I can add other classes here but they're only temporary additions and the k-dirty-cell doesn't work at all
}
}
1 Answer, 1 is accepted
Hello Steve,
In order to show a dirty indicator for specific cell a span element with 'k-dirty' class value should be added to the cell element. Please refer to Preserve the dirty indicator in incell editing and client operations article for a demo.
Regards,
Boyan Dimitrov
Telerik