Results 1 to 10 of 10

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

  1. #1

    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

    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

    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

    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

    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

    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

    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

    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

    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
    4

    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
  •