1. #1
    Sencha Premium Member
    Join Date
    Jun 2007
    Posts
    59
    Vote Rating
    0
    ftftft is on a distinguished road

      0  

    Default [2.0b1/rc1][SOLVED] timeout at BasicForm never used

    I guess it is a bug at Ext code. Regardless what value I set to timeout, it is always 30 seconds.

    BasicForm.js: (action='submit', options.timeout=40)
    Code:
        
    doAction : function(action, options){
            if(typeof action == 'string'){
                action = new Ext.form.Action.ACTION_TYPES[action](this, options);
            }
    Action.js: (o.timeout = 40. but was never passed to Ext.Ajax.request).
    Code:
        run : function(){
            var o = this.options;
            var method = this.getMethod();
            var isPost = method == 'POST';
            if(o.clientValidation === false || this.form.isValid()){
                Ext.Ajax.request(Ext.apply(this.createCallback(), {
                    form:this.form.el.dom,
                    url:this.getUrl(!isPost),
                    method: method,
                    params:isPost ? this.getParams() : null,
                    isUpload: this.form.fileUpload
                }));
    
            }else if (o.clientValidation !== false){ // client validation failed
                this.failureType = Ext.form.Action.CLIENT_INVALID;
                this.form.afterAction(this, false);
            }
    so, when go to ext-base.js, callback.timeout is always 30000, set by default.
    Code:
            handleReadyState:function(o, callback)
            {
                var oConn = this;
    
                if (callback && callback.timeout) {
                    this.timeout[o.tId] = window.setTimeout(function() {
                        oConn.abort(o, callback, true);
                    }, callback.timeout);
                }

  2. #2
    Sencha - Community Support Team jsakalos's Avatar
    Join Date
    Apr 2007
    Location
    Slovakia
    Posts
    27,651
    Vote Rating
    398
    jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future

      0  

    Default

    Hmmm,

    what I read in the source:

    PHP Code:
        // private
        
    createCallback : function(){
            return {
                
    successthis.success,
                
    failurethis.failure,
                
    scopethis,
                
    timeout: (this.form.timeout*1000),
                
    uploadthis.form.fileUpload this.success undefined
            
    };
        } 
    and
    PHP Code:
       // private
        
    run : function(){
            var 
    this.options;
            var 
    method this.getMethod();
            var 
    isPost method == 'POST';
            if(
    o.clientValidation === false || this.form.isValid()){
                
    Ext.Ajax.request(Ext.apply(this.createCallback(), {
                    
    form:this.form.el.dom,
                    
    url:this.getUrl(!isPost),
                    
    methodmethod,
                    
    params:isPost this.getParams() : null,
                    
    isUploadthis.form.fileUpload
                
    }));

            }else if (
    o.clientValidation !== false){ // client validation failed
                
    this.failureType Ext.form.Action.CLIENT_INVALID;
                
    this.form.afterAction(thisfalse);
            }
        }, 
    This is source from svn rev. 1344.
    Jozef Sakalos, aka Saki

    Education, extensions and services for developers at new http://extjs.eu
    News: Grid MultiSearch Plugin, Grid MultiSort Plugin, Configuring ViewModel Hierarchy


  3. #3
    Sencha Premium Member
    Join Date
    Jun 2007
    Posts
    59
    Vote Rating
    0
    ftftft is on a distinguished road

      0  

    Default

    Well. Let me go through code at SVN 1350.

    Ext.data.Connection. Eventually, timeout is set to here.

    Code:
    Ext.extend(Ext.data.Connection, Ext.util.Observable, {
       timeout : 30000,
       request : function(o){
                var cb = {
                    success: this.handleResponse,
                    failure: this.handleFailure,
                    scope: this,
                    argument: {options: o},
                    timeout : this.timeout --> That would be 30000, regardless what timeout value to be set in the form.  
                };

  4. #4
    Sencha Premium Member
    Join Date
    Jun 2007
    Posts
    59
    Vote Rating
    0
    ftftft is on a distinguished road

      0  

    Default

    Even this code has some problem. If I call,

    this.formPanel.getForm().submit({timeout: ....}). the "timeout" value here would never be used.

    Code:
        // private
        createCallback : function(){
            return {
                success: this.success,
                failure: this.failure,
                scope: this,
                timeout: (this.form.timeout*1000),
                upload: this.form.fileUpload ? this.success : undefined
            };
        }

  5. #5
    Sencha - Community Support Team jsakalos's Avatar
    Join Date
    Apr 2007
    Location
    Slovakia
    Posts
    27,651
    Vote Rating
    398
    jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future

      0  

    Default

    Here you pass timeout in submit call config object. What if you assign a timeout at the FormPanel construction time as config option, still ignored?

    Docs say it's config option of BasicForm.
    Jozef Sakalos, aka Saki

    Education, extensions and services for developers at new http://extjs.eu
    News: Grid MultiSearch Plugin, Grid MultiSort Plugin, Configuring ViewModel Hierarchy


  6. #6
    Sencha Premium Member
    Join Date
    Jun 2007
    Posts
    59
    Vote Rating
    0
    ftftft is on a distinguished road

      0  

    Default

    My code is like below. Both "timeout" parameter are ignored.

    Code:
       this.filterForm = new Ext.FormPanel({
            url:'....',
            timeout: 400,
       } 
       this.filterForm.getForm().submit(
            { waitMsg: 'Retrieving transactions...',
              success: this.onLoadSuccess,
              failure: displayFailureMessage,
              timeout: 400,
              scope: this
            }
        );
    more comments. timeout at Ext.data.Connection is a Constants at 30000(Aka. 30 seconds).

    At, Ext.data.Connection. var cb = { time: this.timeout} -> 30000

    Goto Ext.lib.Ajax

    Code:
            handleReadyState:function(o, callback)
            {
                var oConn = this;
    
                if (callback && callback.timeout) { --> callback.timeout is cb.timeout at Ext.data.Connection
                    put alert(callback.timeout) for a quick check.
                    this.timeout[o.tId] = window.setTimeout(function() {
                        oConn.abort(o, callback, true);
                    }, callback.timeout);
                }

  7. #7
    Sencha - Community Support Team jsakalos's Avatar
    Join Date
    Apr 2007
    Location
    Slovakia
    Posts
    27,651
    Vote Rating
    398
    jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future jsakalos has a brilliant future

      0  

    Default

    Yes, confirmed; I'm adding it to the bug list. My showcase:

    HTML Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
        "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <link rel="stylesheet" type="text/css" href="../extjs-2.0/resources/css/ext-all.css">
        <script type="text/javascript" src="../extjs-2.0/adapter/ext/ext-base.js"></script>
        <script type="text/javascript" src="../extjs-2.0/ext-all-debug.js"></script>
        <script type="text/javascript" src="form2.js"></script>
        <!-- A Localization Script File comes here -->
        <script type="text/javascript">
            Ext.onReady(myForm.app.init, myForm.app);
        </script>
        <title>Ext 2.0 Form Test</title>
    </head>
    <body>
    <div id="my-form" style="position:relative;top:30px;left:40px;width:600px"></div>
    </body>
    </html>
    javascript:
    PHP Code:
     /*2007-10-29 06:36:55* 2007-10-26 23:14:492007-10-26 23:14:41**
      * Ext 2.0 Form Test
      * by Jozef Sakalos, aka Saki
      */

    // reference local blank image
    Ext.BLANK_IMAGE_URL '../extjs/resources/images/default/s.gif';

    // some data used in the examples
    Ext.namespace('Ext.exampledata');

    // create namespace
    Ext.namespace('myForm');

    // create application
    myForm.app = function() {
        
    // public space
        
    return {
            
    // public methods
            
    init: function() {
                
    Ext.QuickTips.init();
                
    Ext.form.Field.prototype.MsgTarget 'under';
                var 
    form = new Ext.FormPanel({
                     
    bodyStyle'padding:0px'
                    
    ,width500
                    
    ,height375
                    
    ,frametrue
                    
    ,collapsibletrue
                    
    ,style:'margin:24px'
                    
    ,renderTodocument.body
                    
    ,title'Ext 2.0 Form Test'
                    
    ,url:'/echo.php'
                    
    ,method:'post'
                    
    ,timeout:5
                    
    ,items: [{
                         
    xtype'textfield'
                        
    ,hideMode:'offsets'
                        
    ,fieldLabel'First text field'
                        
    ,name'firsttext'
                        
    ,anchor:'90%'
                    
    },{
                         
    xtype:'fieldset'
                        
    ,title:'Fieldset Title'
                        
    ,header:false
                        
    ,items:[{
                            
    xtype:'textfield'
                            
    ,fieldLabel:'Some text field'
                            
    ,anchor:'95%'
                        
    }]
                    }]
                    ,
    buttons:[{
                         
    text:'Save'
                        
    ,handler: function() {
                            
    form.getForm().timeout 5;
                            
    form.getForm().submit({
                                 
    success: function(formaction) {
                                    
    alert('success');
                                }
                                ,
    failure: function(formaction) {
                                    
    alert('failure');
                                }
                                ,
    timeout:5
                            
    });
                        }
                    }]
                });
            }
        };
    }(); 
    // end of app

    // end of file 
    and PHP responder:

    PHP Code:
    <?
    sleep(8);
    echo "<pre>" . print_r($_POST, 1) . "</pre>";
    ?>
    I'm always getting success alert unless I set sleep above to more than 30 seconds.
    Jozef Sakalos, aka Saki

    Education, extensions and services for developers at new http://extjs.eu
    News: Grid MultiSearch Plugin, Grid MultiSort Plugin, Configuring ViewModel Hierarchy


  8. #8
    Sencha User aconran's Avatar
    Join Date
    Mar 2007
    Posts
    9,485
    Vote Rating
    135
    aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold

      0  

    Default

    Please try out the following override and let me know if it works. I have tested it with Saki's example:

    Code:
    Ext.data.Connection.override({
        request : function(o){
            if(this.fireEvent("beforerequest", this, o) !== false){
                var p = o.params;
    
                if(typeof p == "function"){
                    p = p.call(o.scope||window, o);
                }
                if(typeof p == "object"){
                    p = Ext.urlEncode(p);
                }
                if(this.extraParams){
                    var extras = Ext.urlEncode(this.extraParams);
                    p = p ? (p + '&' + extras) : extras;
                }
    
                var url = o.url || this.url;
                if(typeof url == 'function'){
                    url = url.call(o.scope||window, o);
                }
    
                if(o.form){
                    var form = Ext.getDom(o.form);
                    url = url || form.action;
    
                    var enctype = form.getAttribute("enctype");
                    if(o.isUpload || (enctype && enctype.toLowerCase() == 'multipart/form-data')){
                        return this.doFormUpload(o, p, url);
                    }
                    var f = Ext.lib.Ajax.serializeForm(form);
                    p = p ? (p + '&' + f) : f;
                }
    
                var hs = o.headers;
                if(this.defaultHeaders){
                    hs = Ext.apply(hs || {}, this.defaultHeaders);
                    if(!o.headers){
                        o.headers = hs;
                    }
                }
    
                var cb = {
                    success: this.handleResponse,
                    failure: this.handleFailure,
                    scope: this,
                    argument: {options: o},
                    timeout : o.timeout || this.timeout
                };
    
                var method = o.method||this.method||(p ? "POST" : "GET");
    
                if(method == 'GET' && (this.disableCaching && o.disableCaching !== false) || o.disableCaching === true){
                    url += (url.indexOf('?') != -1 ? '&' : '?') + '_dc=' + (new Date().getTime());
                }
    
                if(typeof o.autoAbort == 'boolean'){ // options gets top priority
                    if(o.autoAbort){
                        this.abort();
                    }
                }else if(this.autoAbort !== false){
                    this.abort();
                }
                if((method == 'GET' && p) || o.xmlData || o.jsonData){
                    url += (url.indexOf('?') != -1 ? '&' : '?') + p;
                    p = '';
                }
                this.transId = Ext.lib.Ajax.request(method, url, cb, p, o);
                return this.transId;
            }else{
                Ext.callback(o.callback, o.scope, [o, null, null]);
                return null;
            }
        }		
    });
    Aaron Conran
    @aconran

  9. #9
    Sencha Premium Member
    Join Date
    Jun 2007
    Posts
    59
    Vote Rating
    0
    ftftft is on a distinguished road

      0  

    Default

    Hi, Aaron,

    Your fix worked, when I set timeout at the form config parameter. But the timeout set at form.submit( { timeout: ... }) has not been used.

    Thanks,

  10. #10
    Sencha User aconran's Avatar
    Join Date
    Mar 2007
    Posts
    9,485
    Vote Rating
    135
    aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold

      0  

    Default

    Try this for the timeout config option in the submit and load methods:
    Code:
    Ext.form.Action.prototype.createCallback = function(opts){
    	var opts = opts || {};	
        return {
            success: this.success,
            failure: this.failure,
            scope: this,
            timeout: (opts.timeout*1000) || (this.form.timeout*1000),
            upload: this.form.fileUpload ? this.success : undefined
        };
    };
    
    Ext.form.Action.Submit.override({
        run : function(){
            var o = this.options;
            var method = this.getMethod();
            var isPost = method == 'POST';
            if(o.clientValidation === false || this.form.isValid()){
                Ext.Ajax.request(Ext.apply(this.createCallback(o), {
                    form:this.form.el.dom,
                    url:this.getUrl(!isPost),
                    method: method,
                    params:isPost ? this.getParams() : null,
                    isUpload: this.form.fileUpload
                }));
    
            }else if (o.clientValidation !== false){ // client validation failed
                this.failureType = Ext.form.Action.CLIENT_INVALID;
                this.form.afterAction(this, false);
            }
        }	
    });
    
    Ext.form.Action.Load.override({
        run : function(){
            Ext.Ajax.request(Ext.apply(
                    this.createCallback(this.options), {
                        method:this.getMethod(),
                        url:this.getUrl(false),
                        params:this.getParams()
            }));
        }
    });
    Aaron Conran
    @aconran