Discussion :

[DjChat]

Bonjour a tous, j'ai un formulaire ou j'affiche des images.

J'utilise ui-selectable pour pouvoir sélectionner mes images et j'aimerai que quand je click sur un bouton submit je récupère le value d'un champ hidden qui est associé a chaque image.


J'essaye d'afficher le résultat de mon value dans une div mais c'est a chaque fois vide, j'ai regarder la doc, mais je crois que je m'y prend de la mauvaise manière, c'est mes début avec jquery...

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
 
 $(function(){
                $("form.item-forms-remove").submit(function ()
    		{ 
			$("#selectable").change(function () {
          var str = "";
          $("#selectable".selectable).each(function () {
                str += $("#pending_image_id").val() + " ";
              });
          $("div").text(str);
        })
        .trigger('change');
    		});
 
    });
 
 $(function() {
        $("#selectable").selectable();
    });

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
 
<form class="item-forms-remove" action="{% url project.imag.views.edit_album data.id %}" method="post">
	{% csrf_token %}
        <input id="delete_selection" class="jq-button" type="submit" value="Supprimer les images s&eacute;lectionn&eacute;es" />
</form>
 
<div class="grid _edit_album">    
        <ol id="selectable">
        	{% for item in  items %}
        	<li>
            	    <img src="{% ids_images_prefix %}{% for thumb in  item.element_thumb %}{{thumb}}{% endfor %}" alt="{{ item.name }}" title="{{ item.name }}" />
                    <input type="hidden" id="pending_image_id" name="pending_image_id" value="{{ item.id }}" />
        	</li>
    		{% endfor %}
        </ol>
 
  <div> </div>
 
</div>

Merci d'avance pour votre aide !!!

[DjChat]

J'ai modifié mon code, j'ai changer id="pending_image_id" par class="pending_image_id" pour qu'il soit unique.

Et mon jquery de cette manière :

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
 
$("form.item-forms-remove").submit(function ()
		{ 	var selectable_delete_image = "";
			var selectedElements = $("#selectable li.ui-selected");
			alert(selectedElements.length);
			$(this).find(".pending_image_id").val(),
			alert(this),
			selectable_delete_image = $(this).find(".pending_image_id").val(),
			alert(selectable_delete_image),
			$.post(
            	"{% url project.imag.views.edit_album 14%}",
            	$(".item-forms-remove").serialize()+"&selectable_delete_image="+selectable_delete_image,
            	function (data)
            		{
            		}
        		);
		});

Le premier alert me donne bien le nombre exacte d'images que j'ai sélectionner et le deuxième alert m'affiche [object HTMLFormElement] je suppose que c'est un tableau? Et le troisième alert affiche undefined.....

Quand je vais le récupéré dans mon script de traitement coté serveur, je suppose qu'il faudra que je fasse une boucle pour pouvoir récupéré les valeurs...?