Discussion :

[Elianora la blanche]

Bonjour,

j'ai une page avec en haut une liste d'items et en bas une liste de résultats de recherche
en haut, les items ont chacun un lien 'supprimer' qui supprime l'item et recharge la liste
en bas, les résultats ont chacun un bouton 'ajouter' qui ajoute le résultat dans la liste d'items et recharge la liste d'items
les 2 types d'actions sont synchrones (je ne sais pas si ça change quelque chose)

en plus de ça, je peux ordonner la liste d'items avec un sortable

je voudrais pouvoir, sans recharger la page globale, ajouter, supprimer et ordonner des items dans ma liste rechargée
le problème c'est que le sortable est initialisé par un bout de javascript se trouvant en dehors de la partie rechargée et initialisé une fois, lors du premier chargement de la page globale

comment faire pour permettre une ré-initialisation du sortable après un ajout ou une suppression ajax ?

merci d'un avis éclairé sur la question

[E.Bzz]

Bonjour,
malgré ta description relativement précise, ça ne va pas être possible de t'aider sans voir le code (HTML + JS + PHP) correspondant

A+

[Elianora la blanche]

Salut !

alors premièrement, j'utilise le framework cakephp, donc mes exemples de codes sont à sa sauce ^^
néanmoins, le fonctionnement reste le même

voilà le code qui se trouve dans ma vue :
la liste à trier

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
<div id="current_ressources_list">
	<ul id="ressources_list_ul" class="no_point">
		<?php
                foreach($collection_ressources as $ressource)
                {
                        echo '<li class="tr_movable" id="order_'.$ressource['id'].'">';
                        echo $ressource['name'];
                        echo '</li>';
                }
                ?>
	</ul>
</div>
<br />

le javascript qui initialise le sortable

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
 
<?php
echo $ajax->sortable(
        "ressources_list_ul", 
        array('onUpdate' => 'function(){
                new Ajax.Updater(
                        "ressources_list_ul", 
                        "'.$html->url(array('controller' => 'collections', 'action' => 'save_ressources_order')).'", 
                        {parameters:{collection_id:\''.$collection['Collection']['id'].'\', tab_order:Sortable.serialize(\'ressources_list_ul\', {name:\'order\'})}})
        }')
);
?>

à noter que prototype et scriptaculous sont inclus et gérés par le framework

pour faire ce que je voudrais, j'ai regardé du côté de jquery, qui est également inclus mais pas utilisé pour le moment

voici le code qui enregistre l'ordre après le drag & drop du sortable :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
 
function save_ressources_order()
	{
		if(!empty($this->params['form']))
		{
			$collection_id = $this->params['form']['collection_id'];
			$tab_order = explode('&', $this->params['form']['tab_order']);
 
			$i = 10;
			foreach($tab_order as $order_text)
			{
				$ressource_id = substr($order_text, 8);
				$id = $this->Collection->RessourceToCollection->find('first', array('fields' => 'id', 'conditions' => array('collection_id' => $collection_id, 'ressource_id' => $ressource_id)));
 
				$data = array();
				$data['RessourceToCollection']['id'] = $id['RessourceToCollection']['id'];
				$data['RessourceToCollection']['order'] = $i;
				$this->Collection->RessourceToCollection->save($data);
 
				$i = $i + 10;
			}
 
			// affichage du formulaire de gestion \\
			$this->Collection->id = $collection_id;
			$collection = $this->Collection->read();
 
			$this->set('collection', $collection);
		}
	}

et voici la vue appelée par la fonction précédente :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
 
<?php
$collection_ressources = $collection['Ressource'];
 
foreach($collection_ressources as $ressource)
{
        echo '<li class="tr_movable" id="order_'.$ressource['id'].'">';
        echo $ressource['name'];
        echo '</li>';
}
?>

pour simplifier, je n'ai plus que la gestion de l'ordre dans mon scénario utilisateur, la première passe du tri fonctionne, mais la problématique d'exécuter plusieurs fois l'action reste la même et c'est là que je bloque

merci de prendre le temps de m'aider

[Elianora la blanche]

salut !

en fait, avec plutôt un Ajax.Request à la place de l'Ajax.Updater ça fonctionne
en effet, comme aucun bout de page n'est rechargé, les valeurs sont celles du premier chargement et tout va bien

merci quand même ^^