顯示具有 jqGrid 標籤的文章。 顯示所有文章
顯示具有 jqGrid 標籤的文章。 顯示所有文章

2017年4月27日 星期四

[jqGrid]欄位日期格式化

colModel: [
                 
                     {
                        name: 'CreateDate', width: 1, align: 'center', sortable: false,
                        formatter: "date",
                        formatoptions: { srcformat: "ISO8601Long", newformat: "Y/m/d A h:i" }
                      }
                   ]

顯示結果:2017/04/27 上午 11:22

2016年12月22日 星期四

[jqGrid] jqGrid在Bootstrap Tab 自動寬度作法

$('a[data-toggle=tab]').click(function () {
        //將list寬度 設定為tab頁面寬度
        $("#list").setGridWidth($('div.active').width());
        $('.ui-jqgrid .ui-jqgrid-btable').attr('style', 'width:' + $('div.active').width());
    });

//縮放時自動調整寬度
$(window).resize(function () {
        $("#listCaseOfficerRequestStudids").jqGrid('setGridWidth', $('div.active').width());
 });

2016年9月8日 星期四

[jqGrid]百分比顯示並排序

jqGrid將數值格式化為百分比顯示,並可排序 。

colModel: [
                   { name: 'Enrollment', width: 1, align: 'center', formatter: 'currency', formatoptions: { suffix: '%' }, sorttype: 'currency' }
        ]

2015年12月3日 星期四

[jqGrid]判斷有無資料

loadComplete: function(xhr) {
       var rowNum = parseInt($(this).getGridParam("records"), 10);
       if (rowNum <= 0) {
           alert("目前無資料");
       }
}  

2015年4月16日 星期四

[jqGrid]讓groupHeaders不重複載入

//從新載入時繼續使用這個GroupHeaders
    $("#list").jqGrid("destroyGroupHeader", false);

    //自訂合併表頭
    jQuery("#list").jqGrid('setGroupHeaders', {
        useColSpanStyle: true,
        groupHeaders: [
          { startColumnName: 'MaleQuantity', numberOfColumns: 2, titleText: '正式學籍之在學學生總人數' }
        ]
    });

2014年6月25日 星期三

jqGrid自訂按鈕

展示畫面  


 $("#list").jqGrid({
        //略
    }).navGrid('#pager', { add: false, edit: false, del: false, search: false, refresh: true })
      //新增自訂按鈕
      .navSeparatorAdd("#pager")
      .jqGrid('navButtonAdd', "#pager", {
      caption: "新增人員", //按鈕名稱
      buttonicon: "ui-icon-newwin",
      onClickButton: test,
      position: "last",
      title: "新增人員",
      id: "add1", //一定要加不然重新載入時按鈕會一直生出來
      cursor: "pointer"
});

2014年6月10日 星期二

jqGrid reloadGrid無法刷新

今天下午整個很蠢
在使用jqGrid的時候
點選資料列使用jquery dialog開窗,按下儲存時
再一次呼叫server傳回json資料,
頁面怎都不會刷新,這功能我之前實作都沒問題,
試了老半天,是我老了嗎???
後來發現在這一段有問題-,-
$('#list').setGridParam({ page: 1, url: '/SpaceControl/GetRoomBookingList/', postData: { page: jQuery('#pager')} }).trigger("reloadGrid");

==================================================================
原來是我自作聰明搞成一行
以下這樣才行
$('#list').setGridParam({ page: 1, url: '/SpaceControl/GetRoomBookingList/', postData: { page: jQuery('#pager')} });
  $('#list').trigger("reloadGrid");

Visual Studio JS intellisense 失效解決方式

  試了好久,發現到工具>選項>IntelliCode js項目設定啟用,重新開啟VS就正常了! 後來發現是TypeScript3.2版有問題停用,使用4.3版的TypeScript即可