2013-07-18 54 views
0

我的代码如下所示。我正在使用结构操作来从服务器端提取json记录。它正在返回记录,我可以用数据查看表格。分页链接创建罚款。当我点击下一步,每次点击分页上的任何链接时都会调用数据源。如果我也点击colum header,数据源被调用。为什么我的YUI 2服务器端分页,Datasouce没有被每个分页链接点击呼叫

我的问题是:

1)当数据源被调用时。因为我看到某个时间被叫,有时候没有。就像我从1页到2页一样,数据源被称为罚款。当我通过点击'prev'链接回到前一页时,数据源被调用。但之后,如果我再点击旁边去第二页,数据源不被调用。何时调用完整的数据源以及调用多少次。是否用于分页调用数据源中的每个链接?

2)如果我的数据源返回100个数据记录并且每页的记录数设置为25,那么我是否会看到这4个页面。我在这里与服务器端分页和数据源调用混淆。每个页面链接和下一个或prev链接点击都不会调用datasource?如果没有,当数据源被调用?请解释我。我知道最初有多少记录,当用户点击页码或下一页或上一页链接时,我的要求是每页显示25条记录。我有能力根据服务器端的页码提供相应的25条记录。

3)如何捕获分页上的'下'和'上'点击。

我的要求是每当用户点击页码链接或next或prev时,使用数据源从服务器动态获取json数据。

请帮我解决这个问题。我是YUI的新手。我只有用户YUI 2,因为我们已经在使用它。

<div id="dynamicdata"></div> 

<script type="text/javascript"> 

YAHOO.example.DynamicData = function() { 
    var myColumnDefs = [ // sortable:true enables sorting 
    {key:"PIN", label:"PIN", sortable:true}, 
    {key:"CODE", label:"CODE", sortable:true} 
]; 

// Customize request sent to server to be able to set total # of records 
var generateRequest = function(oState, oSelf) { 
    // Get states or use defaults 
    oState = oState || { pagination: null, sortedBy: null }; 
    var sort = (oState.sortedBy) ? oState.sortedBy.key : "PIN"; 
    var dir = (oState.sortedBy && oState.sortedBy.dir === YAHOO.widget.DataTable.CLASS_DESC) ? "desc" : "asc"; 
    var startIndex = (oState.pagination) ? oState.pagination.recordOffset : 0; 
    var results = (oState.pagination) ? oState.pagination.rowsPerPage : 25; 

    var total = YAHOO.util.Dom.get("total").value *1; 
    // Validate input 
    if(!YAHOO.lang.isNumber(total) || total < 0 || total > 200) { 
     YAHOO.util.Dom.get("total").value = 0; 
     total = 0; 
     alert("Total must be between 0 and 200."); 
    } 

    // Build custom request 
    return "sort=" + sort + 
      "&dir=" + dir + 
      "&startIndex=" + startIndex + 
      "&results=" + (startIndex + results) + 
      "&total=" + total; 
}; 


// DataTable configuration 
var myConfigs = {  
    generateRequest: generateRequest, 
    initialRequest: generateRequest(), // Initial request for first page of data 
    dynamicData: true, // Enables dynamic server-driven data 
    sortedBy : {key:"PIN", dir:YAHOO.widget.DataTable.CLASS_ASC}, // Sets UI initial sort arrow 
    paginator: new YAHOO.widget.Paginator({ rowsPerPage:10 }) // Enables pagination 
}; 


var myDataSource = new YAHOO.util.DataSource("<%=request.getContextPath()%>/results.do?startIndex="+localStartIndex+"&rowsPerPage="+rowsPerPage); 
myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSON; 

myDataSource.responseSchema = { 
    resultsList: "data",  
    fields: [ 
     {key:"SSN"}, 
     {key:"PIN"}    
    ] 
} 

var myDataTable = new YAHOO.widget.DataTable("dynamicdata", myColumnDefs, myDataSource, myConfigs); 
// DataTable instance 
var myDataTable = new YAHOO.widget.DataTable("dynamicdata", myColumnDefs, myDataSource, myConfigs); 
// Update totalRecords on the fly with values from server 
myDataTable.doBeforeLoadData = function(oRequest, oResponse, oPayload) { 
    oPayload.totalRecords = 200; 
    return oPayload; 
}; 

return { 
    ds: myDataSource, 
    dt: myDataTable 
};   
}(); 

回答

0

据我所知,只要DataTable改变页面或按不同的列排序,DataTable就会一直要求输入新的数据。它不会缓存先前的请求,也不会跟踪它提出的要求。如果您没有看到请求到达服务器端,可能是因为缓存,但不是在DataTable或DataSource中,而是由浏览器本身发出,这是在服务器上发布适当的头文件以告诉浏览器不要缓存的问题。

如果我没有弄错,这是由你描述的行为支持。第一页被请求两次,第一次当你第一次绘制表格时,再次从第2页返回时,所有其他页面都不会被请求两次。为什么?由于第一次形成的URL与返回时的URL略有不同。浏览器缓存只知道URL。