Question

每页的项目数已设置为10，我还在前端的停靠项目中创建了分页工具栏作为xtype。

oracle查询中没有启动和限制参数。如何从oracle数据库中获取记录

请帮忙！

这是我的代码：

 Ext.Loader.setConfig({enabled: true});
Ext.Loader.setPath('Ext.ux', 'ux/');

Ext.require(['*']);

 Ext.onReady(function()
 {
     var itemsPerPage = 10;
     var store=Ext.create('Ext.data.Store',
       {
           autoload: true,
           autosync: true,
           pageSize: itemsPerPage,
           data: [],
           fields:
                   [
                        {name: 'firstname', id:'firstname'},
                        {name: 'email', id:'email'},
                        {name: 'mobileno', id:'mobileno'}
                   ]
       });  

     var panel = Ext.create('Ext.grid.Panel',
       {
            layout: 'fit',
            store:store,
            id: 'grid1',
            dockedItems:
                    [
                        {
                            xtype: 'pagingtoolbar',
                            store:store,
                            dock:'bottom',
                            displayInfo:true
                        }
                    ],
            renderTo: Ext.getBody(),
                        columns:
                    [
                        {
                            header:'Firstname',
                            id:'firstname',
                            dataIndex:'firstname',
                            //autoSizeColumn : true,
                            flex: 1, 
                            editor: {
                                        xtype: 'textarea'
                                    }
                        },
                        {
                            header:'Action',
                            id:'action',
                            align:'center',
                            xtype:'actioncolumn',
                            autoSizeColumn : true,
                            //flex: 1, 
                            sortable:false,

                            items:
                                    [
                                        {
                                            icon:'images/view_icon.gif',
                                            tooltip:'View',
                                            handler: function(grid,rowIndex,colIndex)
                                            {
                                                var rec= grid.getStore().getAt(rowIndex);
                                                var email=rec.get('email');
                                                location.href="RegistrationFormGridView.jsp?email="+email;
                                            }
                                        },
                                        {
                                            icon:'images/edit_icon.gif',
                                            tooltip:'Edit',
                                            handler: function(grid,rowIndex,colIndex,e)
                                            {
                                                var rec= grid.getStore().getAt(rowIndex);
                                                var email = rec.get('email');
                                                location.href="GetRecords.jsp?email="+email; 
//                                                alert(JSON.stringify(rec.get('email')));
//                                                window.location='GetFormData?key1='+email;                                               
                                            }
                                        },
                                        {
                                            icon:'images/icons/cancel.png',
                                            tooltip:'Delete',
                                            handler: function(grid,rowIndex,colIndex)
                                            {   
                                                var rec= grid.getStore().getAt(rowIndex);
                                                var email = rec.get('email');
                                                Ext.Ajax.request(
                                                {
                                                    url:'./deleteRecords',
                                                    params:{email:email},
                                                    method:'GET',

                                                    success: function(response)
                                                    {
                                                        Ext.Msg.alert("successfully deleted" +" " + response.status);
                                                        window.location.reload();
                                                    },
                                                    failure: function(response)
                                                    {
                                                        Ext.Msg.alert("failed" + response.status);
                                                    }
                                                });
                                            }
                                        }
                                    ]
                        }
                    ],

                   listeners: 
                    {
                        afterrender:function()
                         {
                             Ext.Ajax.request(
                           {
                               params:{email:email},
                               url:'./RetrieveRecords',
                               success: function(response)
                               {  
                                   data = [];
                                   data = Ext.JSON.decode(response.responseText);
                                   Ext.getCmp('grid1').getStore().loadData(data);
                               },
                               failure: function(response)
                               {
                               }
                           });
                         }
                    }           
       });
 });

Answer 1

您必须在服务器端处理分页，Ext js仅为您提供分页所需的必要内容。

对于下一个或上一个的每次点击，Ext js自动发送两个参数start和limit其中start是页面最后一个reocord的下一个索引，limit（itemsPerPage）是你每页的记录数。

例如，假设您有100条记录，并且您已在网格中实现了分页，每页的项目数为10。

初始启动= 0且限制为10，如果单击“下一步”，则启动将为11，限制为10 ..如果单击上一个启动将为0，限制将为10

使用这两个参数，您必须构建查询以加载记录并将记录作为响应发送。

Answer 2

您还可以做的是从数据库中获取所有记录并将其放入数组中。在数组之后，您可以设置起点和终点来获取记录。

Answer 3

你必须在服务器端处理分页，你可以做的是发送两个参数Page和RecsPerPage。然后在Sql server上你可以根据这两个参数设置第一条记录和最后一条记录。

@FirstRec =（@ page - 1）* @RecsPerPage）; @LastRec =（@ Page * @RecsPerPage + 1）;

然后你的SQL查询就像=

select top (@LastRec -1)* from

（select cast(ROW_NUMBER() OVER(ORDER BY ID) as numeric)

ROWID, * from TempResult
    WHERE ROWID > @FirstRec   AND ROWID < @LastRec     
    order by temp.ID desc                                 
    ) temp

TempResult将是您的整个表数据

extjs 4网格中的分页不起作用

3 个答案: