Ordre de tri de la table tbody en même ordre que la liste elments jquery json

voix
2

Je travaille sur ce jsFiddle et je voulais étendre la fonctionnalité de sorte que lorsque les éléments de la liste ont été modifiés et soumis via le formulaire puis se trier les tbodys de table associée dans le même ordre que leurs homologues de l'élément de la liste:

http://jsfiddle.net/8vWXZ/20/

Est-il possible de cartographier l'ordre d'un élément à un autre comme celui-ci en jQuery?

Je ne suis pas embêté sur les choses animant mais cette nouvelle exigence m'a jeté un peu.

Créé 17/08/2010 à 17:16
source utilisateur
Dans d'autres langues...                            


1 réponses

voix
1

Je n'ai pas ce que l'appel ajax était censé faire, alors je sautais cette partie. Mais la logique de recours de la table selon l'ordre de la liste est là, sur le soumettre action de la forme. J'ai aussi réorganisé la façon dont l' tbodyétiquette a été utilisée, car elle ne sert pas vraiment un but d'avoir chacun à l' trintérieur de leur propre tbodyétiquette.

Mise à jour jsFiddle: http://jsfiddle.net/8vWXZ/24/

Le code, d'avoir ici sur le SO:
( #tableOrderest la table dont trs nous devons modifier l' ordre selon l'ordre des lis à l' intérieur de ul#reOrder)

 $('#frmItems').submit(function() {

    var tbl = $("#tableOrder tbody");

    $("#reOrder li").each(function(index) {
        var li_id = $(this).attr("id");
        //Find the number of the item. Eg "item4" should result in "4"
        var li_item_number = li_id.match(/item([0-9]*)/)[1];
        //Inside #tableOrder, find the element (a <tr>) with id corresponding the this <li>'s id. Eg "item4"'s corresponding table row's id is "#tbl-item4"
        var correspondingTR = tbl.find("#tbl-item" + li_item_number);

        tbl.append(correspondingTR);
    });

J'ai aussi fait un plus de modifications. Vous aviez donné vos deux liéléments et trles mêmes éléments ids (par exemple item1), ce qui était mauvais ( mmkay ), car un ID doit être unique. Donc , je l' ai changé les trs à l' intérieur tableOrderd'avoir ids tbl-item1et ainsi de suite.

li_id.match(/item([0-9]*)/)[1]est une regex partie. Fondamentalement, il recherche un modèle dans la chaîne et nous pouvons tirer des sections sertain de cette chaîne. Ce qu'il cherche est le modèle à l' intérieur des barres obliques, il cherche quelque chose comme itemXXest un nombre ( [0-9]dit que nous sommes intéressés par un nombre de 0 à 9). Il retournera un tableau, et l'élément sur l' index 1est le numéro qui nous intéresse.

A propos du append:
Le .eachpasse par les lis, qui sont dans le bon ordre. Pour chacun, il ajoute le correspondant trà la fin de la table. Parce que tous les trs de la table seront « touchés », cela signifie qu'il construit l'ordre des trs à partir de zéro. La première doit trêtre annexée, est celui sur le dessus. Le dernier doit être annexée est celui sur le fond (comme, trsur place n est ajoutée à l' itération n ) J'ai fait deux démos dont usefulnes est discutable, mais vous pouvez les trouver utiles. http://jsfiddle.net/bGGRT/ et http://jsfiddle.net/bGGRT/1/

Créé 17/08/2010 à 18:17
source utilisateur

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more