Results 1 to 10 of 10

Thread: [Solved]Ext.Ajax.on('beforerequest' does not work when request created in object

  1. #1
    Ext User
    Join Date
    Sep 2007
    Posts
    5
    Vote Rating
    0
      0  

    Default [Solved]Ext.Ajax.on('beforerequest' does not work when request created in object

    I'm just trying to refactor my Ext-js code in more OO way. I use Ajax.beforerequest event successfully until now. Since I wrapped my page code into a class, the event is not being called any more.

    My current code looks like this:

    Code:
    function PageUI(config){
      this.config = config;
    }
    
    PageUI.prototype = {
      init: function(){
        this.setupDataSource();
        this.setupGrid();
        this.loadData(); //invokes load() on Ext.data.Store instance with JsonReader = Ext.Ajax request
      }
      ...
    }
    
    var gui = new PageUI({loaderURL: 'xx'});
    Ext.onReady(function(){ 
      Ext.Ajax.on('beforerequest', function(){ alert('request'); });
      gui.init(); 
    }, gui, true);
    I tried to move the beforerequest event registration around - into the PageUI.init method etc, but nothing worked - the alert is never shown. I use exactly the same approach in my pages which are not OO-refactored yet and it works there without any problems..

    anybody has an idea what am I doing wrong?

  2. #2
    Sencha User hendricd's Avatar
    Join Date
    Aug 2007
    Location
    Long Island, NY USA
    Posts
    5,966
    Vote Rating
    15
      0  

    Default Just a guess..

    Can't tell from your lean example but, are you sure store.load has a Url to work with ?

    Code:
    function PageUI(config){
      this.config = config||{};
      Ext.apply(this,this.config); ??
    }
    "be dom-ready..."
    Doug Hendricks

    Maintaining ux: ManagedIFrame, MIF2 (FAQ, Wiki), ux.Media/Flash, AudioEvents, ux.Chart[Fusion,OFC,amChart], ext-basex.js/$JIT, Documentation Site.


    Got Sencha licensing questions? Find out more here.


  3. #3
    Ext User
    Join Date
    Sep 2007
    Posts
    5
    Vote Rating
    0
      0  

    Default

    the page itself is working without any poblems - the data is loaded into the Store (and grid) properly, only the beforerequest event isn't fired. everything else is working great. I could paste complete code, but it's quite long and does not relate to these Ajax events...

  4. #4
    Sencha User hendricd's Avatar
    Join Date
    Aug 2007
    Location
    Long Island, NY USA
    Posts
    5,966
    Vote Rating
    15
      0  

    Default

    Can you post your loadData() and setupGrid() members?
    "be dom-ready..."
    Doug Hendricks

    Maintaining ux: ManagedIFrame, MIF2 (FAQ, Wiki), ux.Media/Flash, AudioEvents, ux.Chart[Fusion,OFC,amChart], ext-basex.js/$JIT, Documentation Site.


    Got Sencha licensing questions? Find out more here.


  5. #5
    Ext User
    Join Date
    Sep 2007
    Posts
    5
    Vote Rating
    0
      0  

    Default

    this is my complete js code for this page:

    [CODE]
    var viewConfig = {
    siteRoot: '/PromoSystem',
    urlDsLoader: '/promosystem/Preforecasts/GetPreforecastListJX.rails',
    urlNewPreForecast: '/promosystem/Preforecasts/NewPreForecast.rails',
    urlEditPreForecast: '/promosystem/Preforecasts/EditPreForecast.rails' + '?pfcId=',
    urlEditPreForecastBrands: '/promosystem/Preforecasts/EditPreForecastBrands.rails' + '?pfcId='
    };


    var ajaxRequestCount = 0;
    Ext.Ajax.on({
    'beforerequest': function(){
    ajaxRequestCount++;
    Ext.get('loading').show();
    },

    'requestcomplete': function(){
    ajaxRequestCount--;
    if (ajaxRequestCount <= 0){
    Ext.get('loading').fadeOut({duration: 0.3});
    ajaxRequestCount = 0;
    }
    },

    'requestexception': function(){
    ajaxRequestCount--;
    if (ajaxRequestCount <= 0){
    Ext.get('loading').fadeOut({duration: 0.3});
    ajaxRequestCount = 0;
    }
    }
    });

    function GridUI(config) {
    this.config = config;

    //this dtFrom, dtTo;
    this.dtFromDefault = new Date().add(Date.MONTH, -1);
    this.dtToDefault = new Date().add(Date.MONTH, 1);
    }

    GridUI.prototype = {
    init: function(){
    this.setupDataSource();
    this.setupGrid();
    },

    setupDataSource: function(){
    this.ds = new Ext.data.Store({
    proxy: new Ext.data.HttpProxy(new Ext.data.Connection({url: this.config.urlDsLoader})),
    reader: new Ext.data.JsonReader(
    {root: 'rows', id: 'id', totalProperty: 'rowCount'},
    [
    {name: 'id'},
    {name: 'name'},
    {name: 'description'},
    {name: 'month'},
    {name: 'year'}
    ]
    ),
    remoteSort: true
    });

    this.ds.setDefaultSort('month', 'asc');

    this.ds.on('beforeload', function(store, options) {
    this.ds.baseParams = {
    dateFrom: this.dtFrom ? this.dtFrom.getValue().getTime() : this.dtFromDefault.getTime(),
    dateTo: this.dtTo ? this.dtTo.getValue().getTime() : this.dtToDefault.getTime()
    };
    }, this);

    this.ds.on('loadexception', function(o, response, responseStr){
    var respJson = Ext.util.JSON.decode(responseStr.responseText);
    if (respJson.errMessage){
    Ext.Msg.alert('Chyba', respJson.errMessage.substr(0,200));
    }
    else{
    Ext.Msg.alert('Chyba', response);
    }
    }, this);

    this.reloadDS();
    },

    reloadDS: function(){
    this.ds.load({params:{start:0, limit:20}});
    },

    getColumnModel: function(){
    return new Ext.grid.ColumnModel(
    [
    {
    header: 'N

  6. #6
    Sencha User hendricd's Avatar
    Join Date
    Aug 2007
    Location
    Long Island, NY USA
    Posts
    5,966
    Vote Rating
    15
      0  

    Default

    Try moving Ext.Ajax.on(...) into the onReady block. the EventManager may not be quite ready for you at the stage your setting listeners.
    "be dom-ready..."
    Doug Hendricks

    Maintaining ux: ManagedIFrame, MIF2 (FAQ, Wiki), ux.Media/Flash, AudioEvents, ux.Chart[Fusion,OFC,amChart], ext-basex.js/$JIT, Documentation Site.


    Got Sencha licensing questions? Find out more here.


  7. #7
    Ext User
    Join Date
    Sep 2007
    Posts
    5
    Vote Rating
    0
      0  

    Default

    I already tried this and moved the Ext.Ajax.on block on the beginnig of Ext.onReady handler function, but it doesn't help - the events are never called. Unfortunately I have no other idea what else should i try to make it work ;( in my non-OO-refactored pages, this Ajax handling is working without any problems (even when I assign the handlers before and out of the Ext.onReady event). Could this be some scope-related issue? Because this is the only thing that changes when I refactor my spagetti-code into a class...

  8. #8
    Sencha User
    Join Date
    Mar 2007
    Posts
    7,854
    Vote Rating
    3
      0  

    Default

    When you add listeners to the Ext.Ajax object, you're adding them to the global singleton object. When you setup your Store, you passed a Connection object to the proxy. This cause s the proxy to create it's own Ajax instance to do the the request. Try just passing the
    {url:'...'} config to your proxy, which should cause it to use the singleton Ajax instance and fire your handlers.

  9. #9
    Ext User
    Join Date
    Sep 2007
    Posts
    5
    Vote Rating
    0
      0  

    Default

    thanks a lot, Tim. this was the real reason - now the ajax-events are working again...

  10. #10
    Sencha User Cisco Kid's Avatar
    Join Date
    Apr 2017
    Location
    San Jose, CA
    Posts
    1
    Vote Rating
    0
      0  

    Default

    Quote Originally Posted by tryanDLS View Post
    Try just passing the {url:'...'} config to your proxy, which should cause it to use the singleton Ajax instance and fire your handlers.
    While I am glad you answered his question - seeing the code changes you're recommending would be more helpful to those of us who did not understand your answer...

Posting Permissions

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