Results 1 to 2 of 2

Thread: Alternate to grid.getView().getEl().mask('Loading...')

  1. #1
    Sencha User vick_44's Avatar
    Join Date
    Jul 2016
    Posts
    64
    Answers
    6

    Default Alternate to grid.getView().getEl().mask('Loading...')

    Let me explain the problem.

    I have a UI as below

    -----------------------------------------------------------------------------
    Menu tree
    - page 1(landing page) available for user
    - page 2
    - page 3

    I click a button on page1, it will open page2 and load a grid in page2.


    I have this below grid masking syntax for grid on page 2 which works like a charm but only on second attempt of store.load()

    Code:
    grid.getView().getEl().mask('Loading...');
    grid.getStore().load();

    as In,

    Case1: I refresh my webpage, I land in page1, I click a button on page1 which will open page2 and loads a grid in page2. It doesnt show loading mask in this attempt.

    Case2: after performing case1, i go back to page1 manually, click button again and when page2 loads i see loading mask being displayed.

    Case3: I refresh my webpage, I land in page1, I click page2 manually, it shows grid with no records. Now i select page1, click a button which will open page2 and loads the grid and I do see loading mask in this attempt.


    I am guessing the issue is due to the grid not being rendered completely before mask is applied.

    Although I need to mention that below syntax works fine for test 1 and 3, but problem with below ones is that the mask masks grid view/columns/header as well. I wish to see mask applied to the portion below the grid columns. So to naked eye only 'Loading..." message is shown and header/grid columns are not masked, which is why i am masking with "grid.getView()"

    Code:
     Syntaxes which works but is not what i want:
    in grid.Panel:
    viewConfig : {
            loadMask: true
    }
    
    
    OR
    grid.setLoading(true)
    
    
    OR
    grid.getEl().mask('Loading...');
    So is there a way i can workaround the problem mentioned in case1 (first attempt scenario) ?.

    Any help or guidance is much appreciated.

  2. #2
    Sencha User vick_44's Avatar
    Join Date
    Jul 2016
    Posts
    64
    Answers
    6

    Default

    Same issue mentioned in below post

    https://www.sencha.com/forum/showthr...-for-gridpanel

    I resolved this by modifying my code so that store load is called only after page is rendered. The issue was caused when load mask is called slightly before page is rendered, as my store load as well as mask load is called explicitly by controller.

Similar Threads

  1. Replies: 6
    Last Post: 14 Feb 2014, 1:41 AM
  2. Replies: 1
    Last Post: 7 Feb 2014, 5:36 AM
  3. this.getEl().mask('', 'x-mask-loading') not working in IE7, but ok in FF3
    By fangzhouxing in forum Ext 2.x: Help & Discussion
    Replies: 2
    Last Post: 5 Nov 2008, 1:09 AM
  4. [Solved]How do I hide a mask after calling getEl().mask()?
    By code loki in forum Ext 2.x: Help & Discussion
    Replies: 2
    Last Post: 29 Dec 2007, 4:48 PM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •