EasyUI-Datagrid 中formatter和group-formatter的使用


 

1.在表格屬性設置函數那塊寫以下內容:

groupFormatter:function(value,rows){

  //這里可以看到每一條導入表格中的數據,可以返回group的總結值

},

columns: [
  [{
  field: 'SEX',
  title: '性別',
  width: 100,
  align: 'center',
  formatter: function(value,row,index){

  //可以將數據庫中返回的數據進行轉換(將數字代號0,1分別轉換為男和女)
  var str = '';
  if(value==0)
  {
    str="女";
  }
  else
  {
    str="男";
  }
  return str;
  }
},
{
  field: 'do',
  title: '鏈接',
  width: 150,
  align: 'center',

  //可以拼接一個鏈接按鈕,鏈接函數為:UrlDetail();
  formatter: function(value,row,index){
    selectedRow = row;
    var str = '';
    str = '<a class="easyui-linkbutton detail_more" href="javascript:UrlDetail();"'+ "style='width:100%;height:100%;'data-options='iconCls:\"icon-search\",plain:true'></a>"
    return str;
  }
}],
],

2.在表格屬數據加載完成后需要激活控件並且寫一個點擊鏈接事件:
onLoadSuccess:function(data){
  //激活內部控件
  $.parser.parse($(".detail_more").parent());
  $(".task_detail_more").on("click",function(){
  var id = $(this).attr("id");
  var title= $(this).attr("title");
  //打開查看詳情的窗口
  $("#url_detail_dlg").dialog("open");
  $("#url_detail_frame").attr("src","url_detail.jsp?id="+id+"&title="+title); //外聯到一個頁面

  //如果是中文字符的變量 需要編碼后再傳輸

  //$("#url_detail_frame").attr("src","url_detail.jsp?id="+id+"&title="+ encodeURI(title)); //外聯到一個頁面
  });
},

3.url_detail.jsp 頁面需要接收傳入的參數 :id, title

 //在該頁面head部分導入 解碼類頭文件

<%@ page language="java" contentType="text/html; charset=utf-8" import="java.net.URLDecoder"
pageEncoding="utf-8"%>

//此外 在head部門的最下方寫以下代碼:

<%
   String id = request.getParameter("id");

  String title= request.getParameter("title");//如果title是中文 需要傳入前進行編碼,傳入后解碼

  title= URLDecoder.decode(title, "UTF-8");//進行解碼

%>

//在<script>  </script>中寫進行轉換接收到的變量的代碼

<script>
var baseCtx = "${pageContext.request.contextPath}"//本地路徑
var id_new = '<%=id%>';//新變量id_new 就可以為新的頁面使用

var title_new= '<%=title%>';//新變量title_new 就可以為新的頁面使用

</script>


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM