Best pattern for showing data load errors in Component

[dtsm12]

Hi,

what's the best design pattern if you want to show a data load error, or failure, message in a UI component.

For example, if a Store is used by two List components and the Store gets an error during an AJAX load how would you show the error message instead of the list data ?

Thanks.

[scottmartin]

Most errors would be displayed by an messagebox or similar. Were you looking for something unique?

Scott.

[dtsm12]

Yes, we have data from different stores populating a few panels in the same screen.
So rather than flood the user with several pop-ups, in worst cases, I'd like to show the error for each where the data would be.

Does that make sense?

[scottmartin]

Sorry for the confusion ...

When you say an AJAX error... that is rather serious ... so if you have 2 panels and one of the panels does not get the result set due to a call error, you want to display a message somewhere in that form? Like a hidden label that becomes visible with the error message?

Scott.

[dtsm12]

I should have been clearer what I meant by a data load error.
I was mainly thinking about where the data success property is false.
I would also want to cover malformed data & network errors but I can see these would involve different listeners.

Ideally if another List component was added using the same Store that would get updated with the error message without having to maintain a seperate collection of hidden label identifiers.

David.

[dtsm12]

<sup>I have found the onStoreLoad function in Ext.panel.Table.
This looks like the right place to handle the success property is false scenario but since its a private function not advisable to use it.

Thoughts ?</sup>

[stimpy]

@dtsm

I used a callback on my store like this to test a load event.

Perhaps can use a similar call back in a place that works for you ...

store.load({ callback:function(records, operation, success){ 
if(success==true){ 
Ext.ComponentQuery.query('#myItemSelectorId')[0].setValue(['1','2']); 
    } 
}});

[dtsm12]

Sure, we could use a callback in that way.

Is there a similar way you can specifiy a callback for autoloading stores ?

I was hoping to find some way for the view component to listen for data load events and react to any load failures.

David.

[stimpy]

@dstm

I think you can use a call back in your store definition, although i have not tried it .

var mySelOpts=Ext.create('Ext.data.Store',{ 
model:'mySelModel', 
autoload:true, 
callback:function(records, operation, success){
   if(success==false){
     console.log('danger ! dinosaur attack');
   //do stuff here   } 
},
proxy:{ 
 type:'ajax',
 url:'myproject/mySelectSource',
 reader:{  
type:'json',
 root:'rows'
 }//end reader
 }//end proxy
 });