Dec 05, 2011, 7:53 AM
Ext.NET DataView with KeyNav Support (Improved)
With reference to the following post
http://forums.ext.net/showthread.php...KeyNav-Support
here is an improved version of KeyNav Support for DataView
JavaScript Function
http://forums.ext.net/showthread.php...KeyNav-Support
here is an improved version of KeyNav Support for DataView
JavaScript Function
var enter = function (dataView, dir) {
//Get index of the last selected node
var lastSelectedIndex = Math.max.apply(Math, dataView.getSelectedIndexes());
//Get index of the first selected node
var firstSelectedInxed = Math.min.apply(Math, dataView.getSelectedIndexes());
//No node(s) selected
if (!lastSelectedIndex) {lastSelectedIndex = 0;}
if (!firstSelectedInxed) {firstSelectedInxed = 0;}
//Total number of nodes.
var totalItems = dataView.getNodes().length - 1;
var nextIndex =
(
//If the selected node is the last item
//in the DataView
(lastSelectedIndex + 1 > totalItems)
?
//Goto the first node
0
:
//Goto the next node
lastSelectedIndex + 1
);
var previousIndex =
(
//If the selected node is first node
//in the DataView
(firstSelectedInxed - 1 < 0)
?
//Goto the last node
totalItems
:
//Goto the previous node
firstSelectedInxed - 1
);
switch (dir) {
case "left":
dataView.select(previousIndex);
break;
case "right":
dataView.select(nextIndex);
break;
}
return;
};
How to Use It?<ext:KeyNav ID="KeyNav1" runat="server" Target="={document.body}">
<Left Handler="enter(#{YourDataViewID},'left');" />
<Right Handler="enter(#{YourDataViewID},'right');" />
</ext:KeyNav>