views:

185

answers:

2

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;
  };
})();
A: 

From YUI Paginator Doc:

setPage void setPage ( newPage , silent ) Set the current page to the provided page number if possible.

Parameters: newPage the new page number silent whether to forcibly avoid firing the changeRequest event

Returns: void

the setPage method can be used to force YUI paginator current page. the second parameter "<silent>" may be useful to you since you don't want the ajax data to be reloaded.

dweeves
A: 

If you want to initialize the Paginator to a different page, you also need to provide a (temporary) value for totalRecords. This forum thread provides more detail:

http://yuilibrary.com/forum/viewtopic.php?f=90&amp;t=1913&amp;start=0&amp;hilit=initialPage

Luke