본문 바로가기
Work/jquery

jqGrid + json + jsp 리스트 갱신

by 승수 2012. 1. 5.
jqGrid 리스트를 화면에서 갱신을 하려고 하니 안된다....

이거 때문에 또 삽질 했다 그래서 정리 합니다.

물론 처음에 리스트 불러 올때는 잘 나온다 .

처음엔 그냥 생각에 
 

function fn_search() {
 
$("#gridList").jqGrid({ url:"User.do?cmd=jsonUserInfoList"+param, datatype: "json", mtype:'POST', width: clientwidth-15, jsonReader : { page: "page", total: "total", root: "user", records: function(obj){return obj.length;}, repeatitems: false, id: "no" }, colNames:['번호','아이디', '이름', '사용권한','사용자정보'], colModel:[ {name:'no',index:'no', width:"10%", sorttype:"int"}, {name:'id',index:'id', width:"20%" }, {name:'name',index:'name', width:"20%"}, {name:'login_level',index:'login_level', width:"20%"}, {name:'login_info',index:'login_info', width:"30%"} ], rowNum:10, // 한 화면에 보여줄 갯수 rowList:[10,20,30], pager: '#pager2', viewrecords: true, multiselect: true, loadonce: true, caption:"" // 챠트 제목 });


fn_search () 요넘을 호출 하면 그리드가 갱신 될줄 알았는데 .....

안되서 

인터넷 검색 해 보니 

grid.base.js 파일에

$.fn.jqGrid = function( pin ) {
if (typeof pin == 'string') {
//var fn = $.fn.jqGrid[pin];
var fn = $.jgrid.getAccessor($.fn.jqGrid,pin);
if (!fn) {
throw ("jqGrid - No such method: " + pin);
}
var args = $.makeArray(arguments).slice(1);
return fn.apply(this,args);
}
return this.each( function() {
if(this.grid) {return;} <<-------------------------



기존에 그리드가 존재 하면 팅기는 모양 이다...... 망할.....

$(function() { $("#keyfield").val("${UserForm.keyfield}"); $("#keyword").val("${UserForm.keyword}"); var keyfield = $("#keyfield").val(); var keyword = $("#keyword").val(); var param = "&keyfield="+keyfield; param += "&keyword="+encodeURIComponent(keyword); fn_defaultContent(param); }); // end onload
// 온로드 에서 처음에 그리드를 한번 뿌려 준다.  fn_defaultContent() 호출 
 

function fn_defaultContent(param) {

$("#pcimg").css("display","");

var clientwidth = $(window).width();

    $("#gridList").jqGrid({  

        url:"User.do?cmd=jsonUserInfoList"+param,    

        datatype: "json",       

        mtype:'POST',  

        width: clientwidth-15,    

        jsonReader : { 

page: "page", 

total: "total", 

root: "user", 

records: function(obj){return obj.length;},

repeatitems: false, 

id: "no"

},

        colNames:['번호','아이디', '이름', '사용권한','사용자정보'],

    colModel:[

    {name:'no',index:'no', width:"10%", sorttype:"int"},

    {name:'id',index:'id', width:"20%" },

    {name:'name',index:'name', width:"20%"},

    {name:'login_level',index:'login_level', width:"20%"},

    {name:'login_info',index:'login_info', width:"30%"}

    ],

  rowNum:10, // 한 화면에 보여줄 갯수

    rowList:[10,20,30],  

    pager: '#pager2',  

    viewrecords: true,

    multiselect: true,

loadonce: true,

    caption:"" // 챠트 제목

});  

//jQuery("#gridList").jqGrid('navGrid','#pager2',{edit:false,add:false,del:false});

$("#pcimg").css("display","none");

}

// 조회

function fn_search() {

var keyfield = $("#keyfield").val();

var keyword = $("#keyword").val();

var param = "&keyfield="+keyfield;

param += "&keyword="+encodeURIComponent(keyword);

fn_ajaxList(param);

}


// 리스트

function fn_ajaxList(param) {

$("#gridList").clearGridData();  // 이전 데이터 삭제

    $("#gridList").setGridParam({ url:"User.do?cmd=jsonUserInfoList"+param, datatype:"json" }).trigger("reloadGrid"); 

}


아래에서 검색 버튼 누르면  fn_search() 호출 

 





'Work > jquery' 카테고리의 다른 글

jqGrid + jsp + json 예제  (0) 2012.01.04
jquery 동영상 강좌  (0) 2009.09.02