Salvataggio di JQuery Sortable (nuovo ordine) nel controller MVC ASP.Net?

Question

Ho implementato JQuery ordinabile e funziona correttamente. Il problema è che non posso passare l'elenco nel suo nuovo ordine a un controller in modo da poterlo salvare.

<script type="text/javascript"> 
    $(document).ready(function() { 
     $("#sortable").sortable({ axis: "y" }); 
    }); 

    $(function() { 
     $("#submit-list").button(); 

     $("#submit-list").click(function() { 
      debugger; 
      $.ajax({ 
       url: '/Admin/SortedLists/', 
       data: { items: $("#sortable").sortable('toArray') }, 
       type: 'post', 
       traditional: true 
      }); 
     }); 

    }); 
</script>  

<h2>Edit Roles</h2> 

<div> 
    <ul id="sortable"> 
     <% foreach (var item in Model.Roles) { %>     
      <li>     
       <%=Html.AttributeEncode(item.Name)%>        
      </li>                    
     <% } %>    
    </ul> 

    <input type="submit" value="Save" id="submit-list"/> 
</div> 

e il mio controller:

[HttpPost] 
    public EmptyResult SortedLists(List<string> items) 
    { 
     return new EmptyResult(); 
    } 

Elenco articoli torna con il numero corrent di elementi - ad eccezione di ogni elemento sono stringhe vuote.

Se l'elenco originale assomiglia a questo

1. 1 - Auto
2. 2 - Barca
3. 3 - Moto
4. 4 - Aereo

E l'utente trascina e stazioni essere

1. 4 - Aereo
2. 1 - Auto
3. 3 - Moto
4. 2 - Barca

Come posso passare che nuovo ordine? Suppongo che id passi l'intera cosa su invio, cancelli l'intera lista e riporti l'intero elenco

a meno che non ci sia un modo migliore? Approfittando di Linq (usando Linq in SQL) dove posso inserire il nuovo ordine su everychange e fare un submit changes?

Answer 1

Tutto quello che dovevo fare era compilare il campo ID per ogni elemento della lista, toArray metodo restituito l'elenco bene dopo che

<ul id="sortable"> 
    <% foreach (var item in Model.Roles) { %>     
     <li id="<%=Html.AttributeEncode(item.Name)%>"><%=Html.AttributeEncode(item.Name)%></li>                      
    <% } %>    
</ul> 

Answer 2

Nelle tabelle è possibile creare gli ingressi nascosti, questo può aiutare a pubblicare i valori al controller, che si può facilmente salvarlo;)

che dovrebbe essere simile a questo:

<form method="post" action="~/NameController/yourAction"> 
    <ul id="sortable1"> 

    <li><input type="hidden" id="id" name="Id"/></li> 
    <li><input type="hidden" id="UserId" name="UserId"/></li> 
    <li><input type="hidden" id="TeamId" name="TeamId"/></li> 

</ul> 
    <button type="submit">Save</button> 
</form> 

speriamo vi sia utile;)