datatables 給字段設置默認值,屏蔽沒有字段的錯誤

咱們返回的數據不能保證都是正常的,可能包含 null ,顯然這個對於最終用戶來講是不友好的,那麼咱們能夠這麼處理html

先有以下數據格式:spa

//示例數據
 { data:[ {"id":1,"email":"thxopen@datatables.club","office":"Chengdu","first_name":null} ] } $('#example').DataTable( { "columns": [ null, null, null, { "data": "first_name", // 爲 null 或者 undefined 給出友好的提示, 尚未設置

      "defaultContent": "<i>尚未設置</i>" } ] } );

或者更簡單,粗暴的處理:code

$('#example').DataTable( { "columns": [ null, null, null, { "data": "office", // 若是上面數居中office對於的值爲 null 或者 undefined 則直接顯示爲空字符串

      "defaultContent": "" } ] } );

固然 defaulContent 的用法還能夠再強大點,好比給最後一列添加編輯按鈕htm

//使用 columnDefs 指定
 $('#example').DataTable( { "columnDefs": [ { "data": null, "defaultContent": "<button>編輯</button>", "targets": -1  // 這裏 -1 表明最後一列
 } ] } ); // 使用 columns 指定
 $('#example').dataTable( { "columns": [ null, null, null, { "data": null, "defaultContent": "<button>編輯</button>" } ] } );

參考網址:http://datatables.club/manual/daily/2016/05/04/option-columns-defaultContent.htmlblog

相關文章
相關標籤/搜索