Thank you for reporting this bug. We will make it our priority to review this report.
  1. #1
    Sencha User
    Join Date
    Mar 2010
    Posts
    41
    Vote Rating
    0
    karnak is on a distinguished road

      0  

    Default [CLOSED-EXTJSIV-257] Grid mask not displaying when the datastore has groupField

    [CLOSED-EXTJSIV-257] Grid mask not displaying when the datastore has groupField


    Greetings!

    I am having an issue with a GridPanel's loadmask not showing when the page initially load. I have a GridPanel defined that is based on the Grouping grid example. I load my datastore using ajax. If the datastore does NOT have a groupField defined, then the loadmask displays on initial page load just fine.

    If I have a groupField defined, then the loadmask is not showing on initial page load, however the data still eventually populates.

    Am I doing something wrong?

    Thanks!

  2. #2
    Sencha - Sencha Touch Dev Team Jamie Avins's Avatar
    Join Date
    Mar 2007
    Location
    Redwood City, California
    Posts
    3,661
    Vote Rating
    19
    Jamie Avins is a jewel in the rough Jamie Avins is a jewel in the rough Jamie Avins is a jewel in the rough

      0  

    Default


    Can you post a code sample so we can review what may be happening.

  3. #3
    Sencha User
    Join Date
    Mar 2010
    Posts
    41
    Vote Rating
    0
    karnak is on a distinguished road

      0  

    Default


    Jamie,

    Below is the code.



    Code:
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title>Test</title>
        <link href="CSS/ext-all.css" rel="stylesheet" type="text/css" />
        <script src="Scripts/bootstrap.js" type="text/javascript"></script>
    
           <script type="text/javascript">
               Ext.require(['Ext.data.*', 'Ext.grid.*']);
    
               Ext.onReady(function () {
                   Ext.QuickTips.init();
    
                   Ext.regModel('myOrder', {
                       fields: ['OrderNumber', 'SubmitterName', 'CompanyName', 'OrderDate', 'OrderTime', 'CustomerNumber', 'WorkPhone'],
                       idProperty: 'OrderNumber'
                   });
    
                   // create the Data Store
                   var store = new Ext.data.Store({
                       storeId: 'orders',
                       model: 'myOrder',
                       groupField: 'OrderDate',
                       remoteSort: true,
                       proxy: {
                           // load using script tags for cross domain, if the data in on the same domain as
                           // this page, an HttpProxy would be better
                           type: 'ajax',
                           url: 'getdata.aspx?operation=readOrdersM',
                           reader: {
                               type: 'json',
                               model: 'myOrder',
                               root: 'data',
                               idProperty: 'OrderNumber'
                           }
                       }
                   });
    
                   // create the grid
                   var grid = new Ext.grid.GridPanel({
                       store: store,
                       features: [{
                           ftype: 'grouping'
                       }],
                       headers: [
                        { text: "Id", width: 50, dataIndex: 'OrderNumber', sortable: true },
                        { text: 'Order Date', width: 75, dataIndex: 'OrderDate', sortable: true },
                        { text: 'Order Time', width: 75, dataIndex: 'OrderTime', sortable: false },
                        { text: "Name", width: 175, dataIndex: 'SubmitterName', sortable: false },
                        { text: "Company", flex: 1, dataIndex: 'CompanyName', sortable: true },
                        { text: "Work Phone", dataIndex: 'WorkPhone', sortable: true }
                        ]
                   });
    
                   grid.getSelectionModel().on('selectionchange', function (sm, selectedRecord) {
                       if (selectedRecord.length) {
                           alert('Order Date ' + selectedRecord[0].get('OrderDate'));
                       }
                   });
    
                   Ext.create('Ext.Viewport', {
                       layout: {
                           type: 'border',
                           padding: 5
                       },
                       defaults: {
                           split: true
                       },
                       items: [
            {
                region: 'north',
                collapsible: false,
                split: false,
                height: 85
            },
            {
                region: 'west',
                collapsible: true,
                floatable: true,
                title: 'Starts at width 30%',
                split: true,
                width: '30%',
                html: 'west<br>I am floatable'
            },
            {
                region: 'center',
                layout: 'fit',
                collapsible: true,
                floatable: true,
                split: true,
                items: grid
            },
            {
                region: 'east',
                collapsible: true,
                floatable: true,
                split: true,
                width: 200,
                title: 'East',
                layout: {
                    type: 'vbox',
                    padding: 5,
                    align: 'stretch'
                },
                items: [{
                    xtype: 'textfield',
                    fieldLabel: 'Text field'
                }, {
                    xtype: 'component',
                    html: 'I am floatable'
                }]
            },
            {
                region: 'south',
                collapsible: true,
                split: true,
                height: 200,
                title: 'South',
                layout: {
                    type: 'fit',
                    padding: 5
                },
                html: 'South Central'
            }]
                   });
    
                   store.proxy.extraParams = { showAll: 1 };
                   store.load();
               });
           </script>
    </head>
    <body>
        <form id="form1" runat="server">
            
        </form>
    </body>
    </html>

  4. #4
    Sencha - Ext JS Dev Team evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    16,124
    Vote Rating
    514
    evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute

      0  

    Default


    I can't confirm this using the latest code. The loadMask shows up fine for me.

    Note that I had to add an artificial delay to make the loadMask show, my server was returning the data instantly.
    Evan Trimboli
    Sencha Developer
    Twitter - @evantrimboli
    Don't be afraid of the source code!

  5. #5
    Sencha User
    Join Date
    Mar 2010
    Posts
    41
    Vote Rating
    0
    karnak is on a distinguished road

      0  

    Default


    Evan,

    By latest code, are you referring to developer preview 5?

    Thanks!

  6. #6
    Sencha User
    Join Date
    Mar 2010
    Posts
    41
    Vote Rating
    0
    karnak is on a distinguished road

      0  

    Default


    Jamie,

    Do you know if Evan's response indicates that it should be working in the Developer Preview 5?

    Thanks!

Similar Threads

  1. [CLOSED][3.1.2] Incomplete Mask over grid.
    By Stju in forum Ext 3.x: Bugs
    Replies: 2
    Last Post: 9 Mar 2010, 4:04 AM
  2. [CLOSED][2.2.1] Unable to mask row in grid in FF3
    By PierceSD in forum Ext 2.x: Bugs
    Replies: 2
    Last Post: 23 Mar 2009, 2:19 PM
  3. Replies: 11
    Last Post: 11 Mar 2009, 12:26 PM
  4. Set Grid's groupField in code
    By chalu in forum Ext 2.x: Help & Discussion
    Replies: 3
    Last Post: 1 Sep 2008, 6:08 AM

Thread Participants: 2

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar