Tabulator 通し行番号取得

 

 

 

TabulatorのFormatterのrownumで行番号が取得できますが、ページを変えると1に戻ってしまうので自作してみました。

< コード例 >

Formatter


// 行番号 //
        {
          // 各表の //
          title: "No.",
          field: "__",
          //frozen: true,
          width: 16,
          hozAlign: "right",
          cssClass: "cell_num",
          //formatter: "rownum",
          formatter: function (cell, formatterParams, onRendered) {

            // 反転させて強調 //
            const cellelm = cell.getElement()
            $(cellelm).on("mouseover", function (e) {
              $(this).addClass("text_reverse")

            })
            $(cellelm).on("mouseout", function (e) {
              $(this).removeClass("text_reverse")
            })

            // 通し行番号 //
            return new TableUtil().getRowNum(cell)


          },

テーブルユーティリティクラス


class TableUtil {
  
  // クリップボード設定 //
  static
          clipboardCopyConfig = {
            columnHeaders: true, //do not include column headers in clipboard output
            columnGroups: false, //do not include column groups in column headers for printed table
            rowGroups: false, //do not include row groups in clipboard output
            columnCalcs: true, //do not include column calculation rows in clipboard output
            dataTree: false, //do not include data tree in printed table
            formatCells: false //show raw cell values without formatter
          }
  
  /**
   * コンストラクタ
   * @returns {TableUtil}
   */
  constructor() {

  }

  /**
   * 通し行番取得
   * @param {type} cell
   * @returns {Number}
   */
  getRowNum(cell) {

    const tbl = cell.getTable()
    const page = tbl.getPage()
    const pageSize = tbl.getPageSize()
    //console.log("# page # " + page + ":" + pageSize)

    let num = (page - 1) * pageSize
    num += cell.getRow().getPosition(true)

    return num
  }

コメントを残す