Gelmiş geçmiş en büyük porno sitemiz olan 2pe de her zaman en kaliteli pornoları sunmayı hedefledik. Diğer video sitemiz olan vuam da ise hd porno ağırlıklı çalışmalara başladık.

  1. #1
    Ext User
    Join Date
    Apr 2009
    Posts
    11
    Vote Rating
    0
    Zeus_Apollo is on a distinguished road

      0  

    Default GridPanel not displaying until all rows are loaded, what to see it fill row by row

    GridPanel not displaying until all rows are loaded, what to see it fill row by row


    Hi All,

    This is my first post and I am new to ExtJS so please go easy on me

    I have a large non-paged GridPanel that I want to display. The problem is that with 500+ rows the browser just sits there empty for many seconds and then all of a sudden the entire table appears. What I would like to do is have the GridPanel title and headers show up immediately and then have the table fill in row by row as the data is processed and added to the store.

    I am creating the GridPanel with a Store that initially only has one recored. I then call render on my grid and THEN add the additional rows - but they still only appear all at once. Please tell me what I am doing wrong! I've been banging my head on this all day.

    Here is my code (and if this is helpful to understand it, the data is all in html divs which I am grabbing and then putting into the datastore)

    Code:
    var DataRecord = Ext.data.Record.create([
        fields
    ]);
    var store = new Ext.data.Store({
                  proxy: new Ext.data.MemoryProxy([rowData]), //only has one row at this point
                  reader: new Ext.data.ArrayReader({},fields)
    });
    
    var grid = new GridPanel({
                store: store,
                columns: headers,
                stripeRows: true,
                autoHeight: true,
                clicksToEdit: 1,
                title: title,
                enableColumnHide: true,
                constrain: true,
                viewConfig: { 
                    forceFit: true,
                    scrollOffset: 0             
    });
    
    grid.render(tableName);
    store.load();
    
    //Now here is where I'm attempting to add the bulk of the data
            for (var r = 0; r < rows; r++) {
                var values = {};
                for (var c = 0; c < cols; c++) {
                   var elemId = tableName + "Row" + r + "Column" + c;
                   var element = document.getElementById(elemId);
                   var text = element.innerHTML;
                        
                   var fieldId = tableName + "Column" + c;
                   values[fieldId] = text;
                }
                store.add(new DataRecord(values));
                store.commitChanges();  //this seems to do nothing for me
     }
    What is interesting is that if I put an alert after the
    grid.render(tableName);
    I do see the column headers appear before the data, then when I click ok on the alert the box stays frozen on the screen until all the data is rendered.

    Any help is appreciated, thanks!

  2. #2
    Sencha User
    Join Date
    Mar 2007
    Posts
    7,854
    Vote Rating
    3
    tryanDLS is on a distinguished road

      0  

    Default


    Take a look at the extensions forum - there are number of different grids extensions to handle large resultsets. I think the one you want might be called LiveGrid.

  3. #3
    Ext User
    Join Date
    Apr 2009
    Posts
    11
    Vote Rating
    0
    Zeus_Apollo is on a distinguished road

      0  

    Default


    I did see the LiveGrid but thought that was for working with database ResultSets? My data is all in the HTML document.

    Is there any way to get the rows to fill in one by one? Thanks!

  4. #4
    Sencha User
    Join Date
    Mar 2007
    Posts
    7,854
    Vote Rating
    3
    tryanDLS is on a distinguished road

      0  

    Default


    I don't think anyone has done that. You could try to adapt LiveGrid to add rows from some local object. Or you could attempt to load only say the first 50 rows of your array in the grid, then after rendering add records to the store in chunks in a loop when the grid is scrolled.

  5. #5
    Ext User
    Join Date
    Apr 2009
    Posts
    11
    Vote Rating
    0
    Zeus_Apollo is on a distinguished road

      0  

    Default


    Thank you for your quick replies. The grid itself has autoHeight, so it never displays scrollbars.

    You meant scrollbars on the grid not the browser right? If I could somehow capture it when the users scrolls in the browser that might work. If there are any examples you could point me to that would be helpful. I've very new to this (and JavaScript in general).

    Thank you!

  6. #6
    Ext JS Premium Member
    Join Date
    Feb 2009
    Posts
    108
    Vote Rating
    0
    PierceSD is on a distinguished road

      0  

    Default


    Are you transforming an existing HTML table into an Ext Grid?

    If so, you might be better off putting the data into a JavaScript array, rather than an HTML table. If it's still too slow, you could try the LiveGrid extension with the Paging Memory Proxy extension, or use the PagingStore extension with the Ext PagingToolbar.

    Or you could wait for Ext 3.0 and use the zippy buffered rendering grids.
    --Chad Eberle
    Web Application Architect
    Pierce County Software Development
    Pierce County, Washington

  7. #7
    Ext User
    Join Date
    Apr 2009
    Posts
    11
    Vote Rating
    0
    Zeus_Apollo is on a distinguished road

      0  

    Default


    Yes it is existing HTML data (not a table but a bunch of divs). I could write it into an array instead of html. The problem is that its not simple text, it can have hrefs and additional divs for style information. If I wrote all of that into the array would it load more effeciently? It would be less DOM lookups but would be harder for me to grab the style. Unfortunately, I can't make a corresponding style array to easily - this data is all being auto generated and I have to work with what is there.

    Would upgrading to 3.0 solve my problems? I was going to waiting until it was a point something other than 0 release, but if this will solve the source of my frustrations now I could give it a try Are there any examples of the buffer you are referring too?

    The paging memory proxy only works with the paged grid right? I can't do anything with paging because the entire thing is supposed to display in one large table.

    Thank you for your reply!

  8. #8
    Ext User
    Join Date
    Jul 2007
    Location
    Florida
    Posts
    9,996
    Vote Rating
    5
    mjlecomte will become famous soon enough mjlecomte will become famous soon enough

      0  

    Default


    Ext 3 has a BufferedView that might interest you.

  9. #9
    Ext User
    Join Date
    Apr 2009
    Posts
    11
    Vote Rating
    0
    Zeus_Apollo is on a distinguished road

      0  

    Default


    Thank you, are there any examples of the buffered view you could point me towards?

  10. #10