使用jQuery发布回Controller

在我的网页中，我有一系列表，基本上只包含信息行。在for循环中，每一个都被赋予了一个id，我正试图从外部引用它们。我在表和"保存更改"按钮中都添加了类。

从本质上讲，我的目标是让用户能够四处拖放行，从而更改顺序。然后他们可以点击"保存更改"按钮，这将与相关信息一起发布回服务器。

我在将按钮与相关表匹配，从而将每一行的id提交回数组中的服务器时遇到了问题。我已经编写了代码，以便能够从每个表及其当前顺序中获取ID，但我不知道如何从单击jQuery按钮中将其分配给数组。

这是视图：

@foreach (var collection in Model.Collections)
{
    <h2>@collection.Season</h2>
    @Html.ActionLink("Delete Collection", "DeleteCollection", new { controller = "Edit", brand = collection.Brand.Name, season = collection.Season })
    @Html.ActionLink("Edit Collection", "EditCollection", new { controller = "Edit", brand = collection.Brand.Name, season = collection.Season })
    @Html.ActionLink("Add Image", "CreateImages", new { controller = "Edit", season = collection.Season })
    <p>
        To change the ordering of images, drag and drop to your desired position and then click the Save Changes button on the appropriate collection.
    </p>
    <table class="table-collection" id="table-@collection.Id">
        <tr class="nodrop nodrag">
            <th>
                Id
            </th>
            <th>
                Description
            </th>
            <th>
                Image
            </th>
            <th>
                Options
            </th>
        </tr>
    @foreach (var image in collection.Images)
    {       
        <tr id="@collection.Id-@image.Id">
            <td class="dragHandle showDragHandle"> 
                @image.Id
            </td>
            <td>
                @image.Description
            </td>
            <td>
                <img src="@Url.Content("~/" + image.Location)" alt="@image.Description" />
            </td>
            <td>
                <ul>
                    <li>
                        @Html.ActionLink("Edit", "EditImage", new { controller = "Edit", brand = image.Collection.Brand.Name,
                            season = image.Collection.Season, imageId = @image.Id } )
                    </li>
                    <li>
                        @Html.ActionLink("Delete", "DeleteImage", new
                        {
                            controller = "Edit",
                            brand = image.Collection.Brand.Name,
                            season = image.Collection.Season,
                            imageId = @image.Id
                        })
                    </li>                   
                </ul>
            </td>                
        </tr>   
    }
    </table>
    <p>
        <input type="submit" value="Save Changes" class="save-order" id="saveTable-@collection.Id"/> 
    </p>
}

以下是迄今为止的jQuery：

$(document).ready(function () {
    $(".table-collection").tableDnD();
    $(".save-order").click(function (e) {
        e.preventDefault();
        $.ajax({ url: window.location.href,
            type: 'POST',
            data: { ids: $("--ASSIGN ARRAY HERE--"
});

迭代每一行的jQuery本质上是这样的：

 function(table, row) {
        var rows = table.tBodies[0].rows;
        var debugStr = "Row dropped was "+row.id+". New order: ";
        for (var i=0; i<rows.length; i++) {
            debugStr += rows[i].id+" ";
        }

@using(Html.BeginForm("Action", "Controller", new{ collectionId = collection.Id }))
{
    <input type="submit" value="Save Changes" class="save-order" /> 
}

<td class="dragHandle showDragHandle"> 
    <input type="hidden" name="ids" value="@(image.Id)" />
    @image.Id
</td>

$(".save-order").click(function(e) {
    e.preventDefault();
    var form = $(this).closest('form');
    if(form.validate()) {
        $.post(form.attr('action'), form.serialize(), function() {
        alert('The new image order has been saved.');
        });
    }
    return false;
});

public ActionResult Action(int collectionId, int[] ids)
{
    //Do stuff here
    return Request.IsAjaxRequest() ? null : View();
}

var IDs = []; 
$("#mydiv").find("span").each(function(){ IDs.push(this.id); });

$(document).ready(function () 
{ 

$(".table-collection").tableDnD();      
  $(".save-order").click(function (e) 
  { 
var IDs = [];
$("#yourtable").find("draggable-tr-class").each(function(){ IDs.push(this.id); });
e.preventDefault();  
$.ajax(
  { 
    url: window.location.href,             
    type: 'POST',             
    data: { ids: IDs }
);