将JQuery Sortable(新订单)保存到ASP.Net MVC控制器?

时间:2010-07-22 18:08:45

标签: jquery jquery-ui asp.net-mvc-2 jquery-ui-sortable

我已经实现了JQuery sortable,它运行正常。问题是我无法将新订单中的列表传递给控制器​​,因此我可以保存它。

<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>  

和我的控制员:

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

列表项目带有相应数量的元素 - 除了每个项目都是空字符串。

如果原始列表如下所示

  1. 1 - Car
  2. 2 - 船
  3. 3 - 摩托车
  4. 4 - Plane
  5. 用户拖动和调整

    1. 4 - Plane
    2. 1 - Car
    3. 3 - 摩托车
    4. 2 - 船
    5. 我如何通过新订单?我想id会在提交时传递整个内容,删除整个列表并重新提交整个列表

      除非有更好的方法吗?利用Linq(使用Linq to SQL),我可以在每个交换机上插入新订单并进行提交更改吗?

2 个答案:

答案 0 :(得分:9)

我只需填写每个列表项的id字段,toArray方法在此之后返回列表

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

答案 1 :(得分:0)

在表格中,您可以创建隐藏的输入,这可以帮助您将值发布到Controller,而不是轻松保存;)

应该是这样的:

<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>

希望它有所帮助;)