Results 1 to 3 of 3

Thread: Store - Handling of AJAX responses that came in not same order as requests sent

    Looks like we can't reproduce the issue or there's a problem in the test case provided.
  1. #1
    Sencha User
    Join Date
    Jul 2009
    Vote Rating

    Default Store - Handling of AJAX responses that came in not same order as requests sent


    Ext version tested:
    • Ext 4.1.0 GPL

    Browser versions tested against:
    • FF 12.0 (with firebug 1.9.2 installed)

    DOCTYPE tested against:
    • -

    • If you subsequently call store.load() and server handles requests in in parallel and time of response generation is not constant then
      there can be situtaion (and it is!) when responses are receive in different order than requests were sent.
      Store is not designed to correctly handle this situation. It does not remember which request was last sent, so does not ignore
      irrelevant responses.

      This testcase is for ajax proxy, but this is relevant to any other asynchrounyous data proxies (including Ext.Direct).
      I widely use Ext.Direct, so i will be happy if you can fix this bug there.
      Originally i posted this bug in 3.x topic branch, so i will be very appreciated if you will migrate fix for 3.4.x
      Thank you.

      If you uncomment
      // session_start()
      Then everything works as expected, because subsequent requests become blocked till previous one will be handled.
      But i use SQL storage for sessions in my projects, so this temporary "hack" is not useful.

    Steps to reproduce the problem:
    • Put provided php code on web server in file named "testcase.php"
    • Fix url in javascript to point to php script if needed
    • Open browser and navigate to testcase's html file
    • After page loaded quickly click next page 3 times.
    • Wait till it is loading and see what grid displays.

    The result that was expected:
    • After the load grid displays page #1 (records 1-25)
    • After clicking next page 3 times it must display page #4 (records #76-100)

    The result that occurs instead:
    • Page #1 is displayed (records 1-25)
    • Page #4 is displayed (records 76-100)
    • Page #3 is displayed (records 51-75)
    • Page #2 is displayed (records 26-50)

    Test Case:

        // Set up a model to use in our Store
        Ext.define('Test', {
            extend: '',
            fields: [
                {name: 'id', type: 'string'},
        var store = Ext.create('', {
            model: 'Test',
            proxy: {
                type: 'ajax',
                url: 'testcase.php',
                reader: {
                    type: 'json',
                    root: 'items'
        // create the Grid
        var grid = Ext.create('Ext.grid.Panel', {
            columns: [
                    text     : '#',
                    flex     : 1,
                    sortable : false,
                    dataIndex: 'id'
            dockedItems: [{
                xtype: 'pagingtoolbar',
                store: store,
                dock: 'bottom',
                displayInfo: true,
            height: 480,
            renderTo: Ext.getBody(),
            store: store,
            title: 'Testcase',
            width: 640

    // session_start();
    $page = isset($_GET["page"]) ? $_GET["page"] : 1;
    $delay = $page == 1 ? 0 : 10 / ($page - 1);
    // generate data
    $items = array();
    $pageSize = $_GET["limit"];
    for ($i = ($page - 1) * $pageSize + 1; $i <= $page * $pageSize; $i++) {
        $items[] = array("id" => $i);
    header("Content-type: application/json");
    echo json_encode(array(
        "items" => $items,
        "total" => 1000


    Screenshot or Video:

    See this URL for live test case:

    Debugging already done:
    • -

    Possible fix:
    • In case of Ext.Direct when you call javascript proxy method like YourApi.yourMethod(...) it returns undefined. But it can return transaction. DirectProxy then can save this as lastRequestTransaction property and when handling response check if its transaction id matches id of lastRequestTransaction.

    Additional CSS used:
    • only default ext-all.css

    Operating System:
    • Windows 7 x64 Ultimate
    Last edited by Apocalypsys; 18 Jun 2012 at 9:57 AM. Reason: Updated testcase url and screenshot

  2. #2
    Sencha Premium User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Gainesville, FL
    Vote Rating


    This most likely is due to which response returns. The order is not guaranteed to return the same order as they were sent.
    Mitchell Simoens @LikelyMitch
    Modus Create, Senior Frontend Engineer
    Need any sort of Ext JS help? Modus Create is here to help!

    Check out my GitHub:

  3. #3
    Sencha User
    Join Date
    Jul 2009
    Vote Rating


    Hello guys again!

    Thank you for the reaction.

    The issue much more serious than it might seem at a first glance. And I'll be appreciated if you explore it deeper.

    Let me get back to the issue.

    I have deployed live example to simplify testing as much as possible to wider audience of ExtJS users.
    It's available at
    After (quick) clicking 4 times on "next page" button paging toolbar says that it displays 5th page: "Displaying 101 - 125 of 1000", but really you see in grid records 25-50 from 2nd page! You've got fooled by ExtJS.

    For end users of our application this is very frustrating bug. They quickly browse the calendar and see appointments not from date range currently displayd, they quickly enter search phrase into searchcombo but see results for "su" instead of "sunday".

    Please let me know if there's a way to facilitate the process of fixing this on your side.


Tags for this Thread

Posting Permissions

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