最近使用jqGrid的場景


/*初始化表格*/
initGrid: function(contacts){
  var self = this;
  var queryResultObject = $("#queryResult_allContacts",self.el);
  queryResultObject.jqGrid({
    datatype:"local",
    data	: contacts,
    colNames:["ID","分組管理","姓名","好友分組","機構大類","機構名稱","聯繫人類型標識","職務","個性簽名","固定電話","手機","E-mail","MSN","QQ","機構地址","郵編","傳真","生日","自我介紹"],
    colModel:[
       {name:'id' ,width:30,jsonmap:"username",align:"right",search:false,hidden:true,sorttype:"int"},
       {name:'anonymousProp' ,width:60,search:false,sortable:false,formatter:self.myLink},
       {name:'username',width:80,search:false},
       {name:'group' ,width:80,search:false,sorttype:"int"},
       {name:'institution.fullName',width:160,search:false},
       {name:'institution.fullName',width:300,search:false},			           
       {name:'contactTypeID',width:80,hidden:true,search:false},
       {name:'customerInfo.title',width:80,search:false},
       {name:'customerInfo.signature',width:160,search:false,hidden:true},
       {name:'customerInfo.telephone1',width:90,sortable:false,search:false},
       {name:'customerInfo.cellphone1',width:90,sortable:false,search:false},
       {name:'customerInfo.email1',width:100,sortable:false,search:false},
       {name:'customerInfo.msn1',width:100,sortable:false,search:false},
       {name:'customerInfo.qq1',width:80,sortable:false,search:false},
       {name:'customerInfo.address',width:160,sortable:false,search:false},
       {name:'customerInfo.zipCode',width:50,sortable:false,search:false},
       {name:'customerInfo.fax',width:80,sortable:false,search:false},
       {name:'customerInfo.birthDay',width:80,sorttype:"date",datefmt:"Y-m-d",search:false},
       {name:'customerInfo.selfIntroduction',width:160,sortable:false,search:false}
   ],
	  caption:"通訊錄",
	  sortname:"id",
    sortorder:"desc",
	  hidegrid:true,
	  viewrecords: true,
	  loadonce: true,
	  rownumbers: true,
	  rownumWidth: 20,
	  height:200,
	  gridview: true,
	  loadtext:"loading......",
	  rowNum:20,
	  rowList:[20,50,80],
	  pager: '#pagerDiv',
	  onSelectRow:function(rowID,flag,event) {self.selectContact(rowID,flag,event,self);
	  onCellSelect:self.selectCell
});

/*分頁*/
queryResultObject.jqGrid('navGrid','#pagerDiv', {edit:false,add:false,del:false,search:false});

	/*選擇聯繫人*/
	selectContact:function(rowID,flag,event,contactListView){		
	},

	selectCell:function(rowID,columnID,text,event){
	},
	
	/*自定義連接,鏈接上綁定事件。自定義formatter返回一個html的元素用來填充表格中某一列*/
	myLink:function(cellValue,opts,rowData){
		return "<a href=#?contactID="+opts.rowId+"&contactType="+ rowData.contactTypeID +">" + cellValue + "</a>";
	}


jqGrid的onSelectRow默認參數只有三個:

rowID:分別是選中行的id(不是行號);
flag:選中還是取消、點擊事件;
event:要傳其他參數給響應的方法;

如果需要在響應函數中需要其他參數,可以直接給onSelectRow指定一個匿名函數,然後再傳入其他參數,調用自己的響應函數。

當前場景中傳入了self,self實際上是一個View對象。
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章