[.net mvc]Grid 페이지 이동 후 이전페이지로 돌아왔을 때 Grid 필터값 유지하는 방법
@(Html.Kendo().Grid< Model.View.DetailModel >()
.Name("GridListBRB")
.Columns(columns =>
{
columns.Bound(c => c.IsChkYn).ClientTemplate("< input type='checkbox' #= IsChkYn ? checked='checked':'' # class='chkbx' />")
.Width("1%").Title("< input type='checkbox' id='checkAll' onclick='fnCheckAll(this)'/>").Sortable(false).Filterable(false);
columns.Bound(p => p.CodeIdx).Hidden(true);
columns.Bound(p => p.RowNum).Title("No").Width("2%").Sortable(false);
columns.Bound(p => p.FileName).Title("파일명").Width("30%").HtmlAttributes(new { style = "text-align:left;" }).Sortable(false).ClientTemplate(@Html.ActionLink("#=FileName#", "DetailPage", new { CodeIdx = "#=CodeIdx#" }).ToHtmlString());
columns.Bound(p => p.RegName).Title("작성자").Width("10%").Sortable(false);
columns.Bound(p => p.LastUpdateDate).Title("등록일").Width("10%").Sortable(false);
})
.Pageable(pageable => pageable.ButtonCount(10))
.Selectable(selectable => selectable.Mode(GridSelectionMode.Single))
.DataSource(ds => ds.Ajax()
.PageSize(20)
.Model(model =>
{
model.Id(p => p.CodeIdx);
})
.Read(read => read.Action("GetDetailList", "Center").Data("FnTopSearchCondition"))
)
.Events(events => events
.DataBound("fnGridDataBound")
.Change("fnSaveGridOption")
)
)
function fnSaveGridOption() {
saveGridState('GridListBRB');
}
■검색조건 유지
$(window).load(function () {
loadGridState('GridListBRB');
});
■리스트 화면: 검색조건 값 불러오기 : localStorage
function loadGridState(gridId) {
var json = localStorage[gridId];
if (!json) { return; }
var grid = $('#' + gridId).data('kendoGrid');
var gridState = JSON.parse(json);
if (grid != null) {
grid.dataSource.query(gridState);
}
}
■리스트 화면: 검색조건 값 저장하기 : localStorage
function saveGridState(gridId) {
var grid = $('#' + gridId).data('kendoGrid');
var dataSource = grid.dataSource;
var state = {
columns: grid.columns,
page: dataSource.page(),
pageSize: dataSource.pageSize(),
sort: dataSource.sort(),
filter: dataSource.filter(),
group: dataSource.group()
};
var json = JSON.stringify(state);
localStorage[gridId] = json;
}
■조회버튼 클릭시 검색조건을 저장
$("#btnSearch").click(function () {
var grid = $('#GridListBRB').data().kendoGrid;
grid.dataSource.page(1);
grid.dataSource.read();
saveGridState('GridListBRB');
});
■다른 메뉴 클릭시 localStroage 초기화
function clearLocalStorage() {
localStorage.clear();
}
function FnTopSearchCondition() {
return {
SearchText: $("#SearchText").val()
, SearchGubun: $("#SearchGubun").val()
};
}
function fnGridDataBound(e) {
var grid = $('#GridListBRB').data().kendoGrid;
var data = grid.dataSource.view();
var dataCnt = $("#GridListBRB").data("kendoGrid").dataSource.total();
//조건에 따라 칼럼 히든 처리
if ($('input:radio[name=DisplayFlag]:checked').val() == 1) {
grid.hideColumn("LastUpdateDate");
} else {
grid.showColumn("LastUpdateDate");
}
}