#370 ✓duplicate
Marton Kiss-Albert

Ajax#options onTimeOut enhancement

Reported by Marton Kiss-Albert | October 4th, 2008 @ 01:00 PM | in 1.7

example:


new Ajax.Request('/process.php',{
  timeOut: 1.5,
  onTimeOut: function() {   // waiting 1.5 sec -> if not completed the request run onTimeOut function
    $('message').update('Loading...');
    $('message').show();
  },
  onComplete: function(t) {
    $('message').hide();
  }
});

In source:


Ajax.Request = Class.create(Ajax.Base, {
  _complete: false,

  initialize: function($super, url, options) {
    $super(options);
    this.transport = Ajax.getTransport();
    this.request(url);
  },

  request: function(url) {
    this.url = url;
    this.method = this.options.method;
    var params = Object.clone(this.options.parameters);

    if (!['get', 'post'].include(this.method)) {
      // simulate other verbs over post
      params['_method'] = this.method;
      this.method = 'post';
    }

    this.parameters = params;

    if (params = Object.toQueryString(params)) {
      // when GET, append parameters to URL
      if (this.method == 'get')
        this.url += (this.url.include('?') ? '&' : '?') + params;
      else if (/Konqueror|Safari|KHTML/.test(navigator.userAgent))
        params += '&_=';
    }

    try {
      var response = new Ajax.Response(this);
      if (this.options.onCreate) this.options.onCreate(response);
      Ajax.Responders.dispatch('onCreate', this, response);

	  if(this.options.onTimeOut) this._onTimeOut();	// <-- NEW LINE ********************************

      this.transport.open(this.method.toUpperCase(), this.url,
        this.options.asynchronous);

      if (this.options.asynchronous) this.respondToReadyState.bind(this).defer(1);

      this.transport.onreadystatechange = this.onStateChange.bind(this);
      this.setRequestHeaders();

      this.body = this.method == 'post' ? (this.options.postBody || params) : null;
      this.transport.send(this.body);

      /* Force Firefox to handle ready state 4 for synchronous requests */
      if (!this.options.asynchronous && this.transport.overrideMimeType)
        this.onStateChange();

    }
    catch (e) {
      this.dispatchException(e);
    }
  },

...

  _onTimeOut: function() {  // <-- NEW SECTION ******************************************
	var timer=this.options.timeOut || 1.0;
	var func=this.options.onTimeOut;
	this._onTimerOutHand=setTimeout(func,timer*1000);
  },

...

  respondToReadyState: function(readyState) {
    var state = Ajax.Request.Events[readyState], response = new Ajax.Response(this);

    if (state == 'Complete') {
      try {
        this._complete = true;
		if(this._onTimerOutHand) clearTimeout(this._onTimerOutHand); // <-- NEW LINE *****************************
        (this.options['on' + response.status]
         || this.options['on' + (this.success() ? 'Success' : 'Failure')]
         || Prototype.emptyFunction)(response, response.headerJSON);
      } catch (e) {
        this.dispatchException(e);
      }

      var contentType = response.getHeader('Content-type');
      if (this.options.evalJS == 'force'
          || (this.options.evalJS && this.isSameOrigin() && contentType
          && contentType.match(/^\s*(text|application)\/(x-)?(java|ecma)script(;.*)?\s*$/i)))
        this.evalResponse();
    }

    try {
      (this.options['on' + state] || Prototype.emptyFunction)(response, response.headerJSON);
      Ajax.Responders.dispatch('on' + state, this, response, response.headerJSON);
    } catch (e) {
      this.dispatchException(e);
    }

    if (state == 'Complete') {
      // avoid memory leak in MSIE: clean up
      this.transport.onreadystatechange = Prototype.emptyFunction;
    }
  },
...

Tested on IE6, FF3, SF3, OP9.5 and Chrome 0.2

Comments and changes to this ticket

  • Tobie Langel

    Tobie Langel October 4th, 2008 @ 05:29 PM

    • Assigned user set to “Tobie Langel”
    • State changed from “new” to “enhancement”
    • Milestone set to 1.7
    • Tag changed from ajax.request, enhancement to ajax.request, needs_patch, needs_tests
  • Juriy Zaytsev

    Juriy Zaytsev October 4th, 2008 @ 11:11 PM

    Marton, Could you please attach a patch in a diff format?

  • Tobie Langel

    Tobie Langel October 5th, 2008 @ 11:38 AM

    Note that onTimeout should abort the ajax request.

  • sat

    sat July 8th, 2009 @ 11:42 AM

    • Tag changed from ajax.request, needs_patch, needs_tests to ajax.request, needs_patch, needs_tests

    How to abort the request ??
    I am using prototype framework.
    once inside the timeout I want to abort the Ajax request ?

  • Tobie Langel

    Tobie Langel July 23rd, 2009 @ 04:25 AM

    • State changed from “enhancement” to “duplicate”

    This issue has already been reported here: #220

    We're closing this ticket as duplicate. Thanks for taking the time to contribute.

  • Tobie Langel

    Tobie Langel July 24th, 2009 @ 02:26 AM

    • Tag changed from ajax.request, needs_patch, needs_tests to missing:tests, needs_patch

    [not-tagged:"needs_tests" tagged:"missing:tests" bulk edit command]

  • Tobie Langel

    Tobie Langel July 24th, 2009 @ 02:28 AM

    • Tag changed from missing:tests, needs_patch to missing:patch, missing:tests

    [not-tagged:"needs_patch" tagged:"missing:patch" bulk edit command]

  • Tobie Langel

    Tobie Langel July 24th, 2009 @ 03:36 AM

    • Tag changed from missing:patch, missing:tests to missing:patch, needs:tests

    [not-tagged:"missing:tests" tagged:"needs:tests" bulk edit command]

  • Tobie Langel

    Tobie Langel July 24th, 2009 @ 03:37 AM

    • Tag changed from missing:patch, needs:tests to needs:patch, needs:tests

    [not-tagged:"missing:patch" tagged:"needs:patch" bulk edit command]

Please Sign in or create a free account to add a new ticket.

With your very own profile, you can contribute to projects, track your activity, watch tickets, receive and update tickets through your email and much more.

New-ticket Create new ticket

Create your profile

Help contribute to this project by taking a few moments to create your personal profile. Create your profile ยป

The Prototype JavaScript library.

Shared Ticket Bins

Pages