jQuery triable sérialiser deux colonnes dans un appel de base de données?

Question

Salut à tous. Un aperçu rapide de ce que j'essaie d'accomplir. J'ai deux colonnes de données. Chaque colonne a une quantité arbitraire d'éléments homogènes. Dans l'événement de mise à jour triable jQuery, je souhaite sérialiser l'emplacement de tous les éléments dans leur colonne respectable. Chaque élément des colonnes a un ID de la forme item_{id}. Dans l'événement de mise à jour, je vais sérialiser les éléments dans les deux colonnes. Je voulais savoir s'il existait un moyen efficace de sérialiser les ordres de colonnes col1 et col2 et de les combiner en un seul appel de base de données. Hors de la boîte, la méthode sortable (« serialize ») retourne une chaîne formatée comme:

item[]=88&item[]=1&item[]=2&item[]=90 

Ainsi, en cas de mise à jour pour la colonne 1, j'ai:

$("#col1").sortable({ 
    handle: '.item h2', 
    connectWith: '#col2', 
    update: function(event, ui) { Update(event, ui); } 
}).disableSelection(); 

Et aussi pour colonne 2:

$("#col2").sortable({ 
    handle: '.item h2', 
    connectWith: '#col1', 
    update: function(event, ui) { Update(event, ui); } 
}).disableSelection(); 

Et l'événement Mise à jour:

function Update(event, ui) { 
    var col1Order = $("#col1").sortable("serialize"); // Returns item[]=88&item[]=1&item[]=2&item[]=90 
    var col2Order = $("#col2").sortable("serialize"); // Returns item[]=23&item[]=10&item[]=65 
} 

Existe-t-il un moyen efficace de combiner la commande de la colonne 1 et la commande de la colonne 2 en un appel de base de données (elle stockera la position mise à jour dans la base de données)?

Si je concaténer les deux résultats, elle se traduira par une chaîne de la forme:

Avec ce formulaire

item[]=88&item[]=1&item[]=2&item[]=90&item[]=23&item[]=10&item[]=65 

, vous ne parvenez pas à différencier quel élément est venu de quelle colonne. J'ai réfléchi à différentes approches. Une approche formaterait la chaîne de requête pour ressembler à quelque chose comme ?col1=88_1_2_90&col2=23_10_65 et ensuite sur le côté serveur en divisant la valeur col1, 88_1_2_90, sur le '_' qui me donnerait un tableau de valeurs (88 en position 0, 1 en position 1, et ainsi de suite) et diviser la valeur col2 en utilisant la même méthode, mais je pensais qu'il pourrait y avoir une façon plus élégante d'accomplir cela.

Mon but principal est d'éviter de faire deux appels de base de données distincts (un pour la colonne1 et un autre pour la colonne2). Je pourrais sérialiser col1 et faire un appel à la base de données en mettant à jour les positions des éléments dans col1 puis sérialiser col2 et faire un autre appel à la base de données mettant à jour les positions des éléments dans col2, mais c'est ce que j'essayais d'éviter.

Je suis ouvert à toutes les suggestions. Merci d'avance.

Answer 1

Qu'en est-il de l'utilisation de tableaux imbriqués? Vous devriez obtenir quelque chose comme ceci:

item[0][]=88&item[0][]=1&item[0][]=2&item[0][]=90&item[1][]=23&item[1][]=10&item[1][]=65 

Vous pouvez facilement utiliser les fonctions liées à la matrice pour aplatir que dans un tableau, le cas échéant.

Answer 2

Vous pouvez résoudre ce problème en utilisant:

jQuery('.column').sortable('serialize', {key: 'widgets[0][]'});