Search code examples
extjsstoreabortoperationcancellation

How to abort / cancel the loading operation of a store in Sencha ExtJS v6?

I have used these two sources below:

but none of them is valid in the version 6 of extjs

How could I cancel the load operation every time a new operation starts?

Solution

  • In version 6.0.2 of ExtJS some things have changed and the Operation class has and abort method

    There is no getOperation method but there is the beforeload which is useful to grab the operation.

    By collecting one or more operations you can safely abort them before starting a new operation.

    The following Typescript class will be of help:

    module ext_ts {
interface Abortable {
    abort(): void
}

export class AutoAbortPreviousOperation {
    private _storeOperations: Array<Abortable> = []

    applyOnStore(store): any {
        let me = this

        return store.on({
            destroyable: true,
            beforeload: function (theStore, operation, eOpts) {
                let lastOperation = me._storeOperations.pop()

                if (lastOperation) {
                    console.log("aborting previous operation safely")

                    lastOperation.abort()   //this abort is safe so no need to check !lastOperation.isComplete()
                } else {
                    //nop
                }

                me._storeOperations.push(operation)    //add this operation for later usage

                return true //let the loading begin
            }
        })
    }
}
}

    Note that the statusCode of a request which is forcely cancelled by the user is: -1

    Useful links: