如何设置 YUI2 分页器以选择首页以外的页面？

发布于 2024-08-25 16:35:51 字数 1982 浏览 8 评论 0原文

我有一个带有 AJAX 分页的 YUI DataTable (YUI 2.8.0r4)。表中的每一行都链接到详细信息/编辑页面，我想从该详细信息页面链接回包含详细信息页面中的记录的列表页面。所以我必须 a) 正确偏移 AJAX 数据 b) 告诉 YAHOO.widget.Paginator 选择哪个页面。

根据我对 YUI API 文档的阅读，我必须传入 initialPage 配置选项。我已经尝试过这样做，但它不需要（来自 AJAX 的数据正确偏移，但分页器认为我在第 1 页，因此单击“下一步”会将我从第 6 页带到第 2 页。

我是什么没有做（或做错了）？

这是我的数据表构建代码：

(function() {
  var columns = [
    {key: "retailer",    label: "Retailer",    sortable: false, width: 80},
    {key: "publisher",   label: "Publisher",   sortable: false, width: 300},
    {key: "description", label: "Description", sortable: false, width: 300}
  ];

  var source = new YAHOO.util.DataSource("/sales_data.json?");
  source.responseType = YAHOO.util.DataSource.TYPE_JSON;
  source.responseSchema = {
    resultsList: "records",
    fields: [
      {key: "url"},
      {key: "retailer"},
      {key: "publisher"},
      {key: "description"}
    ],
    metaFields: { totalRecords: "totalRecords" }
  };

  var LoadingDT = function(div, cols, src, opts) {
    LoadingDT.superclass.constructor.call(
      this, div, cols, src, opts);
    // hide the message tbody
    this._elMsgTbody.style.display = "none";
  };
  YAHOO.extend(LoadingDT, YAHOO.widget.DataTable, {
    showTableMessage: function(msg) { 
      $('sales_table_overlay').clonePosition($('sales_table').down('table')).
        show();
    },
    hideTableMessage: function() { 
      $('sales_table_overlay').hide();
    }
  });

  var table = new LoadingDT("sales_table", columns, source, {
    initialRequest: "startIndex=125&results=25",
    dynamicData: true,
    paginator: new YAHOO.widget.Paginator({rowsPerPage: 25, initialPage: 6})
  });

  table.handleDataReturnPayload = function(oRequest, oResponse, oPayload) {
    oPayload.totalRecords = oResponse.meta.totalRecords;
    return oPayload;
  };
})();

原文

I have a YUI DataTable (YUI 2.8.0r4) with AJAX pagination. Each row in the table links to a details/editing page and I want to link from that details page back to the list page that includes the record from the details page. So I have to a) offset the AJAX data correctly and b) tell YAHOO.widget.Paginator which page to select.

According to my reading of the YUI API docs, I have to pass in the initialPage configuration option. I've attempted this, but it doesn't take (the data from AJAX is correctly offset, but the paginator thinks I'm on page 1, so clicking "next" takes me from e.g. page 6 to page 2.

What am I not doing (or doing wrong)?

Here's my DataTable building code:

(function() {
  var columns = [
    {key: "retailer",    label: "Retailer",    sortable: false, width: 80},
    {key: "publisher",   label: "Publisher",   sortable: false, width: 300},
    {key: "description", label: "Description", sortable: false, width: 300}
  ];

  var source = new YAHOO.util.DataSource("/sales_data.json?");
  source.responseType = YAHOO.util.DataSource.TYPE_JSON;
  source.responseSchema = {
    resultsList: "records",
    fields: [
      {key: "url"},
      {key: "retailer"},
      {key: "publisher"},
      {key: "description"}
    ],
    metaFields: { totalRecords: "totalRecords" }
  };

  var LoadingDT = function(div, cols, src, opts) {
    LoadingDT.superclass.constructor.call(
      this, div, cols, src, opts);
    // hide the message tbody
    this._elMsgTbody.style.display = "none";
  };
  YAHOO.extend(LoadingDT, YAHOO.widget.DataTable, {
    showTableMessage: function(msg) { 
      $('sales_table_overlay').clonePosition($('sales_table').down('table')).
        show();
    },
    hideTableMessage: function() { 
      $('sales_table_overlay').hide();
    }
  });

  var table = new LoadingDT("sales_table", columns, source, {
    initialRequest: "startIndex=125&results=25",
    dynamicData: true,
    paginator: new YAHOO.widget.Paginator({rowsPerPage: 25, initialPage: 6})
  });

  table.handleDataReturnPayload = function(oRequest, oResponse, oPayload) {
    oPayload.totalRecords = oResponse.meta.totalRecords;
    return oPayload;
  };
})();

分享到QQ

分享到微博