9
votes

JQGrid - Naviguez-vous des lignes en utilisant des touches de flèche haut / bas?

est-il possible de naviguer entre des lignes à l'aide des touches de flèche haut et bas?

Par exemple, si la première ligne de la grille est sélectionnée et que l'utilisateur appuie sur "Down", je voudrais que la grille désélectionne cette ligne et sélectionnez la rangée suivante dans la grille.

Il y a un poste dans les forums JQgrid à ce sujet à ce sujet à http://www.trirand.com/blog/?page_id=393/help/navigater-arraw-keys/ , mais l'activation du mode d'édition cellulaire n'est pas une solution pour moi car elle causera de nombreux autres indésirables comportements de grille.


0 commentaires

4 Réponses :


5
votes
$(document).keypress(function(e) {

if(e.keyCode == 40) { //down arrow
 $('#nextElementId').click();
}
if(e.keyCode == 38 { //up arrow
 $('#previousElementId'.click();
}

});

3 commentaires

Hmmm ... C'est un bon départ, mais ce code suppose qu'il n'y a qu'une seule grille sur la page et que je peux facilement obtenir l'identifiant de chaque ligne de l'ordre dans lequel ils sont affichés.


J'ai utilisé l'identifiant comme une simplification. Le "TR" sélectionné a la classeur de la classe UI-State, en utilisant ceci, vous pouvez obtenir la ligne suivante ou précédente. Vous pouvez lier l'événement KeyPress à la table au lieu de «document», de cette façon, vous ne devriez pas avoir de problème avec plus d'une grille.


Évidemment, les gens ne devraient pas simplement copier et coller du code. Cette réponse vous montre le concept derrière la manipulation d'une clé de clé et est parfaitement valide. Presque toutes les réponses sur Telle est un bon début!



5
votes

Cela ne fonctionnera que si vous avez une grille à l'écran car elle remplace les clés de haut niveau de niveau de document, mais c'est un début. xxx


0 commentaires

13
votes

La navigation du clavier a finalement été ajoutée à JQGRID à partir de la version 4.0.

Pour commencer, allez à page de démonstration et accédez à fonctionnalité | navigation du clavier .

Le code suivant est utilisé pour lier les touches fléchées haut / bas: xxx

mais comme la démo Affiche, vous pouvez passer des options pour lier d'autres clés aussi: xxx

Pour plus d'informations, reportez-vous à la méthode Bindeys dans la documentation wiki.


2 commentaires

J'aimerais connaître une question de suivi, j'ai essayé de sélectionner la première rangée sur la réalisation de la grille, mais elle n'autorise pas immédiatement la navigation du clavier.


@Nap - La grille doit être concentrée avant que la navigation du clavier fonctionnera.



0
votes

Pour ce faire utiliser

jQuery("#myGrid").jqGrid('bindKeys');


0 commentaires