使用POST表单在View中实现pagin /排序/过滤

时间:2015-08-03 13:51:51

标签: asp.net-mvc asp.net-mvc-4

我在MVC 4 / C#/ Visual Studio 2010 SP1中有一个应用程序。它是创建用于存储书籍集的UI。我想要存储的信息包括:集合名称,创建日期和书籍列表。从存储所有书籍的数据库中添加许多书籍。实际上,另一种观点是自己编辑书籍。

到目前为止,我已经设计了我的View,它显示了收集名称和创建日期的表单字段。但在下面我列出了所有要选择的书籍。

在编辑/创建视图中选择它们意味着它们会添加到集合中。我想我可以为书籍列表实现分页/排序/过滤,因为这个数字可能会变得太大而无法在一个页面上显示。我的想法是添加带有书籍列表的PartialView。部分视图可以由jQuery.post()调用,其被诸如点击页码,表格列等事件所扰乱.PartialView将存储页面编号,排序标准,某些过滤条件隐藏字段并根据它们的值生成列表的一部分。隐藏字段将从模型中更新,但也会将分页/排序传递回操作。

我遇到了如何将所有内容放在POST表单中的问题。我希望用户点击页码,同时仍然会选择之前选择的书籍。我不知道如何刷新PartialView并保持书籍的状态。我希望有可能。如果没有,你会推荐什么?

谢谢

以下是我的申请。

一本书的模型:

// Entity
public class Book
{
    public string Title { get; set; }
    public string Author { get; set; }
    public DateTime DatePublished { get; set; }
}

的ViewModels:

// BookToSelect view model
public class BookToSelect : Book
{
    public bool Isselected { get; set; }

    public static IList<BookToSelect> MapBooksToBooksToSelect(IList<Book> list, bool isselected = false)
    {
        return list.Select(x => new BookToSelect() { //...})
    }
    public static IList<Book> MapBooksToSelectToBooks(IList<BookToSelect> list)
    {
        return list.Select(x => new Book() { //... })
    }
}

// List of books view model
public class ListOfBooks
{
    public IList<BookToSelect> Books { get; set; }
    public DateTime DayOnCreationThe { get; set; }
    public string CollectionName { get; set; }

    public static IList<Book> GetListOfBooks()
    {
        return new List<Book>() {
            // ... set of new Books() { },
        };
    }
}

控制器/动作:

public class TestCollectionController : Controller
{
    [HttpGet, ActionName("Edit")]
    public ActionResult Edit_GET()
    {
        ListOfBooks ViewModel = new ListOfBooks();
        ViewModel.Books = ListOfBooks.GetListOfBooksToSelect();

        ViewModel.DayOnCreation = DateTime.Today;
        ViewModel.CollectionName = "List of random books";
        return View(ViewModel);
    }

    [HttpPost, ActionName("Edit")]
    public ActionResult Edit_POST(ListOfBooks ViewModel)
    {
        return View(ViewModel);
    }
}

和查看:

@using MvcDbContext.ViewModels
@model ListOfBooks
@{
    ViewBag.Title = Model.CollectionName;
}

<h2>@Model.CollectionName</h2>
@using (Html.BeginForm())
{
    @Html.EditorFor(m => m.CollectionName)
    @Html.EditorFor(m => m.DayOnCreation)
    <table>
        <tr>
            <th class="display-label">@Html.DisplayNameFor(m => m.Books.FirstOrDefault().Isselected)</th>
            <th class="display-label">@Html.DisplayNameFor(m => m.Books.FirstOrDefault().Title)</th>
            <th class="display-label">@Html.DisplayNameFor(m => m.Books.FirstOrDefault().Author)</th>
            <th class="display-label">@Html.DisplayNameFor(m => m.Books.FirstOrDefault().DatePublished)</th>
        </tr>
            @for (int i = 0; i < Model.Books.Count(); i++)
            {
                <tr>
                    @Html.EditorFor(m => m.Books[i])
                </tr>
            }
        <tr>
            <td colspan="3"><input type="submit" name="SaveButton" value="Save" /></td>
        </tr>
    </table>
}

1 个答案:

答案 0 :(得分:1)

正如您已经确定的那样,如果您使用下一页切换HTML,则所有输入(包括其状态)也会被替换。因此,处理此问题的唯一方法是将状态卸载到替换之外的输入中。

处理此问题的最简单方法很可能是创建一个隐藏的输入,该输入将由逗号分隔的所选项目ID组成。只需添加一些JS即可查看复选框或其他内容,并在此隐藏输入中添加或删除项目。然后,您可以将此字符串发回并使用Split将其转换为可用于查询相应图书并将其添加到实体集合中的ID列表。