asp.net mvc - JQuery - Drag & Drop - Id draggable element -

i'm new in forum

i learned jquery 2 week , i'm inexperienced. site build asp.net mvc , use jquery 1.4.1

this code

html

...

<% foreach (var item in model.amici)     {%>      <div id="amico_<%= item.id %>" idamico="<%= item.id %>">     <%= item.name %>     </div>      <% } %>  

....

script

          $(function() {         $("div[id^='amico_']").draggable({ revert: "valid" });         $("#droppable").droppable({             activeclass: "ui-state-hover",             hoverclass: "ui-state-active",             drop: function(event, ui) {                 var index = $(".ui-draggable").attr('idamico');                 $(this)                    .addclass("ui-state-highlight")                    .find("p")                    .html("id = " + index);             }         });     });  

the problem id attribute's value 1 (index variable) while 1 , 2. (red row) wrong?

thanks replies alberto

here 1 quick note may help.

<% foreach (var item in model.amici) {%>  <div id="amico_" idamico="">     <%= item.name %> </div>  <% } %> 

in example, , based on jquery selector, think expecing id of each div "amico_1", "amico_2" , on... perhaps based on item id? in case, id attribute must unique.

<% foreach (var item in model.amici) {%>  <div id="amico_<%= item.id %>" idamico="" class="drag">     <%= item.name %> </div>  <% } %> 

notice have added class of "drag" div.

this means selector can updated this:

$("div[id^='amico_']").draggable({ revert: "valid" }); 

to this

$(".drag").draggable({ revert: "valid" });

and last suggestion you've got small mistake on line...

var index = $(".ui-draggable").attr('idamico'); 

it should actuall be

var index = $(ui.draggable).attr('idamico'); 

you should notice there parameter named ui gets passed droppable event. contains current dragged element.

hope helps.