docs extjs extjs4

docs - extjs 4 panel



paginación en la cuadrícula extjs 4 no está funcionando (3)

Los elementos por página se han establecido en 10 y también he creado la barra de herramientas de paginación como x tipo en elementos acoplados en el extremo frontal.

No hay parámetros de inicio y límite en la consulta de Oracle. ¿Cómo hago para recuperar los registros de la base de datos Oracle?

¡Por favor ayuda!

Aquí está mi código:

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) { } }); } } }); });


Debe gestionar la paginación desde el servidor, Ext js solo le proporciona los elementos necesarios para la paginación.

por cada clic en siguiente o anterior, Ext js envía automáticamente dos parámetros start y limit donde start es el siguiente índice de la última repetición de la página y limit (itemsPerPage) es su número de registros por página.

por ejemplo, supongamos que tiene 100 registros y ha implementado la paginación en la cuadrícula y los elementos por página son 10.

Inicialmente start = 0 y limit será 10, si hace clic en next y start será 11 y el límite será 10 ... de manera similar si hace clic en start anterior será 0 y el límite será 10

Usando estos dos parámetros, debe enmarcar su consulta para cargar registros y enviar los registros como respuesta.


Lo que también puede hacer es buscar todos los registros de la base de datos y ponerlos en una matriz. Después de eso en la matriz puede establecer el punto de inicio y final para recuperar los registros.


Tiene que manejar la paginación en el lado del servidor, lo que puede hacer es enviar dos parámetros Página y RecsPerPage. Luego, en el servidor Sql puede establecer el primer registro y el último registro en función de estos dos parámetros.

@FirstRec = (@Page - 1) * @RecsPerPage); @LastRec = (@Page * @RecsPerPage + 1);

entonces su consulta SQL será como =

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 será toda tu tabla de datos