PDA

View Full Version : DataView arrow navigation



mixo
27 Nov 2011, 10:44 PM
Hello Sencha users!

I have another issue with dataview component (Ext.view.View). It is a a cross-browser incompatibilities of arrow navigation in dataview. By default dataview provides only left/right arrows serve with no up/down navigation(Up/down arrows works like left/right). I've realized own up/down navigation, but moving left/right also take place, so when i press Up it moves up and left, Down = down & right. I have considered this feature in my code, but there is one more thing. in different browsers it have different implementation. So looks like in Firefox on press Up it first execute my Up function and then moves left, but in Chrome it's all opposite. So my patch don't work correct in both browsers.
My questions is:
- is there any way to disable basic navigation functionality for dataview?
or
- may be anybody have an idea how to solve this issue?

tobiu
28 Nov 2011, 2:08 AM
adding an additional navigation has a good potential to cause issues if you also leave the default navigation.

you can look at:


/**
* @event beforecontainerkeydown
* Fires before the keydown event on the container is processed. Returns false to cancel the default action.
* @param {Ext.view.View} this
* @param {Ext.EventObject} e The raw event object. Use {@link Ext.EventObject#getKey getKey()} to retrieve the key that was pressed.
*/
'beforecontainerkeydown',


and return false for up and down.

you should also take a look at:
http://docs.sencha.com/ext-js/4-0/source/View3.html#Ext-view-View

-> processUIEvent

mixo
28 Nov 2011, 6:50 PM
thanks for answer tobiu!

I try to use your idea, but it's no effect. I define event listeners like this:


'beforecontainerkeydown': function(dataview, e){
print('beforecontainerkeydown',e.getKey());
if(e.getKey()==38){//up
return false;
}
if(e.getKey()==40){//down
return false;
}
},
'beforeitemkeydown': function(dataview, rec,item,index,e){
print('beforeitemkeydown',e.getKey());
if(e.getKey()==38){//up
print('up',e.getKey());
return false;
}
if(e.getKey()==40){//down
print('down',e.getKey());
return false;
}
}

and on pressing up/down event 'beforecontainerkeydown' not been caught. I think it's ok because the cursor moves by items and only 'beforeitemkeydown' take place. then I return false on up/down press but event is still processed. Also I try to do


e.stopEvent();
but there is no result.

I don't understand your idea about processUIEvent function.

Is there a bug in behavior of dataview events, or my approach is incorrect?

mixo
29 Nov 2011, 5:53 PM
Who can explain undocumented behavior of dataview for 'beforeitemkeydown' event listener?