I have a shield-ui grid with a hidden column. Once I modify the data source ie perform a filter or do a sort my column sizes get messed up.
My problem can be seen on the demo website as well
Just sort the grid no problem, then hide a column and sort again and you will see the issue
https://demos.shieldui.com/aspnet/grid-columns/columns-show-hide
jQuery(function($) {
$("#grid").shieldGrid({
dataSource: {
data: gridJson
},
sorting: {
multiple: true
},
paging: {
pageSize: 5,
pageLinksCount: 4
},
selection: {
type: "row",
multiple: false,
toggle: true
},
columns: [
{ field: "ServiceMarketingId", title: "ServiceMarketingId", width:"20%" },
{ field: "Code", title: "Code" , width:"20%"},
{ field: "Name", title: "Name", width:"20%" },
{ field: "MarketingName", title: "MarketingName", width:"20%" },
{ field: "Description", title: "Description" , width:"20%"}
],
resizing: true
});
var dataSource = $("#grid").swidget().dataSource,
timeout;
$("#searchInput").on("keyup", function() {
var val = $(this).val();
console.log(val);
clearTimeout(timeout);
timeout = setTimeout(function() {
dataSource.filter = dataSource.filter = {
or: [
{ path: "Code", filter: "contains", value: val },
{ path: "Name", filter: "contains", value: val }
]
}
dataSource.read();
}, 300);
});
$("#grid").swidget().hideColumn("ServiceMarketingId");
});
The Shield UI developers are working on fixing this bug and a fix should be available shortly.