2011-08-16 7 views
0

jqgrid를 사용하여 데이터를 한 번로드하고 로컬에서 정렬 및 필터링 한 다음 각 업데이트/삽입/삭제 후에 새로 고침을 수행합니다. 괜찮아요, 그 외에 필터를 사용하는 경우 (그리드 상단), 필터는 새로 고친 후 동일하게 유지되지만 필터가 새로로드 된 데이터에 다시 적용되지 않습니다. 트리거 ('reloadGrid')를 사용하여 그리드를 다시로드 한 후 mygrid [0] .triggerToolbar()를 호출하려고했지만 아무 효과가 없습니다.jqgrid는 다시로드 한 후 필터를 적용 하시겠습니까?

어떤 도움 주셔서 감사 또는 포인터 :-) 아래

코드 :

var lastsel; 
var mygrid; 
var currentLang; 

//setup grid with columns, properties, events 
function initGrid(lang, productData, resellerData, resellerSearchData) { 


    mygrid = jQuery("#list2").jqGrid({ 
    //data loading settings 
    url: '/public/Gadgets/LinkGadget/ProductLinks/' + lang, 
    editurl: "/public/Gadgets/LinkGadget/Edit/" + lang, 
    datatype: "json", 
    mtype: 'POST', 
    jsonReader: { 
     root: "rows", 
     cell: "", 
     page: "currpage", 
     //total: "totalrecords", 
     repeatitems: false 
    }, 
    loadError: function (xhr, status, error) { alert(status + " " + error); }, 
    //column definitions 
    colNames: ['Id', 'ProductId', 'Reseller Name', 'Link', 'Link Status'], 
    colModel: [ 
    { name: 'Id', index: 'Id', width: 40, sortable: false, resizable: true, editable: false, search: false, key: true, editrules: { edithidden: true }, hidden: true }, 
    { name: 'ProductId', index: 'ProductId', width: 190, sortable: true, sorttype: 'text', resizable: true, editable: true, search: true, stype: 'select', edittype: "select", editoptions: { value: productData }, editrules: { required: true} }, 
    { name: 'ResellerName', indexme: 'ResellerName', width: 190, sortable: false, sorttype: 'text', resizable: true, editable: true, search: true, stype: 'select', edittype: "select", editoptions: { value: resellerData }, editrules: { required: true }, searchoptions: { sopt: ['eq'], value: resellerSearchData} }, 
    { name: 'Link', index: 'Link', width: 320, sortable: true, sorttype: 'text', resizable: true, editable: true, search: true, edittype: "textarea", editoptions: { rows: "3", cols: "50" }, editrules: { required: true }, searchoptions: { sopt: ['cn']} }, 
    { name: 'LinkStatus', index: 'LinkStatus', width: 100, sortable: false, resizable: true, editable: false, search: false, formatter: linkStatusFormatter}], 
    //grid settings 
    //rowList: [10, 25, 50], 
    rowNum: 20, 
    pager: '#pager2', 
    sortname: 'ProductId', 
    sortorder: 'asc', 
    height: '100%', 
    viewrecords: true, 
    gridview: true, 
    loadonce: true, 
    viewsortcols: [false, 'vertical', true], 
    caption: " Product links ", 
    //grid events 
    onSelectRow: function (id) { 
     if (id && id !== lastsel) { 
      if (lastsel == "newid") { 
       jQuery('#list2').jqGrid('delRowData', lastsel, true); 
      } 
      else { 
       jQuery('#list2').jqGrid('restoreRow', lastsel); 
      } 
      jQuery('#list2').jqGrid('editRow', id, true, null, afterSave); //reload on success 
      lastsel = id; 
     } 
    }, 
    gridComplete: function() { 
     //$("#list2").setGridParam({ datatype: 'local', page: 1 }); 
     $("#pager2 .ui-pg-selbox").val(25); //changing the selected values triggers paging to work for some reason 
    } 
}); 

//page settings 
jQuery("#list2").jqGrid('navGrid', '#pager2', 
     { del: false, refresh: false, search: false, add: false, edit: false } 
); 

//refresh grid button 
jQuery("#list2").jqGrid('navButtonAdd', "#pager2", { caption: "Refresh", title: "Refresh grid", buttonicon: 'ui-icon-refresh', 
    onClickButton: function() { 
     reload(); 
    } 
}); 

//clear search button 
jQuery("#list2").jqGrid('navButtonAdd', "#pager2", { caption: "Clear search", title: "Clear Search", buttonicon: 'ui-icon-refresh', 
    onClickButton: function() { 
     mygrid[0].clearToolbar(); 
    } 
}); 

//add row button 
jQuery("#list2").jqGrid('navButtonAdd', '#pager2', { caption: "New", buttonicon: 'ui-icon-circle-plus', 
    onClickButton: function (id) { 
     var datarow = { Id: "newid", ProductId: "", ResellerName: "", Link: "" }; 
     jQuery('#list2').jqGrid('restoreRow', lastsel); //if editing other row, cancel this 
     lastsel = "newid"; // id; 
     var su = jQuery("#list2").addRowData(lastsel, datarow, "first"); 
     if (su) { 
      jQuery('#list2').jqGrid('editRow', lastsel, true, null, afterSave); //reload on success 
      jQuery("#list2").setSelection(lastsel, true); 
     } 
    }, 
    title: "New row" 
}); 

//delete row button 
jQuery("#list2").jqGrid('navButtonAdd', "#pager2", { caption: "Delete", title: "Delete row", buttonicon: 'ui-icon-circle-minus', 
    onClickButton: function() { 
     if (lastsel) { 
      if (confirm('Are you sure you want to delete this row?')) { 
       var url = '/public/Gadgets/LinkGadget/Edit/' + currentLang; 
       var data = { oper: 'del', id: lastsel }; 
       $.post(url, data, function (data, textStatus, XMLHttpRequest) { 
        reload(); 
       }); 
       lastsel = null; 
      } 
      else { 
       jQuery("#list2").resetSelection(); 
      } 
     } 
     else { 
      alert("No row selected to delete."); 
     } 
    } 
}); 
jQuery("#list2").jqGrid('filterToolbar'); 
} 

//Used by initGrid - formats link status column by adding button 
function linkStatusFormatter(cellvalue, options, rowObject) { 
if (rowObject.Id != "newrow") 
    return "<input style='height:22px;width:90px;' type='button' " + "value='Check link' " + "onclick=\"CheckLink(this, '" + rowObject.Id + "'); \" />"; 
else 
    return ""; 
} 

//Used by initGrid - reloads grid 
function reload() { 

//jqgrid setting "loadonce: true" will reset datatype from json to local after grid has loaded. "datatype: local" 
// does not allow server reloads, therefore datatype is reset before trying to reload grid 
$("#list2").setGridParam({ datatype: 'json' }).trigger('reloadGrid'); 
//mygrid[0].clearToolbar(); 
lastsel = null; 

//Comments: after reload, toolbar filter is not applied to refreshed data. Tried row below without luck 
//mygrid[0].triggerToolbar(); 
} 

    //after successful save, reload grid and deselect row 
function afterSave() { 
    reload(); 
} 
+0

을 마련하지 않았 삭제 저장 진짜 솔루션 그래서 내가 못생긴 해결 방법을하고 있어요 - 격자를 다시로드 한 후 어떤 필터가 적용되었는지 확인한 다음 몇 가지 이유로 필터를 다시 적용하는 헤더에 클릭을 시뮬레이트합니다. 클릭은 또한 일종의 정렬을 수행하지만 이미 등호 필터가 적용 되었기 때문에 사용자는이를 알지 못합니다. js 타이머는 그리드가 다시로드되었음을 "확실하게"만듭니다. – Markus

+0

코드를 잊어 버렸습니다 : // 일부 ex code // 링크 헤더를 정렬하려면 : clickSort ("# jqgh_list2_Link"); } function clickSort (선택기) { if (선택기 && selector! = "") var t = setTimeout ("$" '+ selector + "') .click();"1500); } – Markus

답변

0
귀하의 데이터가 다시 그리드에 바인더 제본 점점되지

후/업데이트

관련 문제