Databases
StackOverflow2013
Postsdbo
POExtjs Paging Toolbar in Grid does not work
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POExtjs Paging Toolbar in Grid does not work
    primarykey
    data
    text
    <p>I have searched high and low for this problem... and I found a lot of people have the same problem but none have a definite solution... Basically I have a grid on extjs... it gets data from sqldb. It loads fine using json. "But"... when trying to implement paging, this is where it gets messy...</p> <ol> <li><p>pagesize is set to 5... which means first page should only show 5 records, but my grid shows the entire records</p></li> <li><p>Even though the "next" button exists, it does not work technically because the entire record is already there on the first page</p></li> <li><p>I set page.loadPage(2)... and the message says "Displaying Second Page", but it's actually displaying the entire records</p></li> <li><p>The page number in "Page _ of 6" is always blank. see below image...</p> <p><img src="https://i.stack.imgur.com/VT2hv.jpg" alt="enter image description here"></p></li> </ol> <p>Below is my store...</p> <pre><code> var store = Ext.create('Ext.data.Store', { storeId: 'myData', pageSize: 5, autoLoad: true, method: "POST", remoteSort: true, fields: [ { name: 'Q1', type: 'int' }, { name: 'Q2', type: 'int' }, { name: 'Q3', type: 'int' }, { name: 'Q4', type: 'int' }, { name: 'Q5', type: 'int' }, { name: 'Improvements', type: 'string' }, { name: 'Comments', type: 'string' } ], sorters: [ { property: 'Q1', direct: 'ASC' } ], proxy: { type: 'ajax', url: 'GridView/writeRecord', reader: { type: 'json', totalProperty: "count", root: "myTable" } }, autoLoad: { params: { start: 0, limit: 5} } }); this.grid = Ext.create('Ext.grid.Panel', { title: ' ', trackMouseOver: true, disableSelection: true, autoHeight: true, store: store, loadMask: true, height: 500, width: 800, renderTo: Ext.getBody(), columns: [ { header: 'Q1', sortable: true, dataIndex: 'Q1' }, { header: 'Q2', sortable: true, dataIndex: 'Q2' }, { header: 'Q3', sortable: true, dataIndex: 'Q3' }, { header: 'Q4', sortable: true, dataIndex: 'Q4' }, { header: 'Improvements', flex: 1, sortable: true, dataIndex: 'Improvements' }, { header: 'Comments', flex: 1, sortable: true, dataIndex: 'Comments' } ], bbar: Ext.create('Ext.PagingToolbar', { store: store, displayInfo: true, preprendButtons: true, displayMsg: 'Displaying Surveys {0} - {1} of {2}', emptyMsg: "No Surveys to display" }) }); </code></pre> <p>and this is my JSON... it has actually 30 records but I trimmed it down...</p> <pre><code> { "count": 30, "myTable": [ { "Q1": "1", "Q2": "1", "Q3": "1", "Q4": "1", "Improvements": "", "Comments": "1" }, { "Q1": "3", "Q2": "2", "Q3": "2", "Q4": "2", "Improvements": "This is A very long comment. What do you think?", "Comments": "Agreed" }, { "Q1": "4", "Q2": "2", "Q3": "4", "Q4": "3", "Improvements": "Hello2", "Comments": "Hello2" }, { "Q1": "3", "Q2": "2", "Q3": "2", "Q4": "1", "Improvements": "Hello4", "Comments": "Hello4" } </code></pre> <p>] }</p> <p>Also if it helps this is how I get my Json</p> <pre><code> string sqlquery = "SELECT Q1, Q2, Q3, Q4, Improvements, Comments FROM ITable"; conn.Open(); SqlDataAdapter cmd = new SqlDataAdapter(sqlquery, conn); SqlCommand comd = new SqlCommand(sqlquery, conn); DataSet myData = new DataSet(); cmd.Fill(myData, "myTable"); comd.CommandText = "SELECT COUNT(*) FROM ITable"; Int32 count = (Int32)comd.ExecuteScalar(); comd.ExecuteNonQuery(); conn.Close(); var results = (new { TotalNumber = count, myTable = myData }); return JsonConvert.SerializeObject(new { count=count, myTable = myData.Tables[0] }, Formatting.Indented, new JsonSerializerSettings { ReferenceLoopHandling = ReferenceLoopHandling.Ignore }); </code></pre> <p>I know my Json is right... and it reads 30 records because is says "Displaying _ of 30"... I just have no clue what I am doing wrong... It cannot be a browser issue... why is it throwing up all in one page? anybody?</p>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. This table or related slice is empty.
    1. USEagleFox
    plurals
    1. This table or related slice is empty.
    1. PL
      singulars
      1. LTLinked
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POExtjs Paging Toolbar in Grid does not work
      1. USEagleFox
      1. VTFavorite
    2. VO
      singulars
      1. POExtjs Paging Toolbar in Grid does not work
      1. USsandeep.gosavi
      1. VTFavorite
    1. COyou have autoLoad property defined twice and you did not show how you configured your grid and paging tool bar.
      singulars
      1. POExtjs Paging Toolbar in Grid does not work
      1. USdbrin
    2. COhi dbrin... eventhough I take one of em off... I still don't get it
      singulars
      1. POExtjs Paging Toolbar in Grid does not work
      1. USEagleFox
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload