如何在MVC中使用IEnumerable模型将数据从Controller传递到View?

时间:2016-10-27 11:20:01

标签: c# jquery ajax asp.net-mvc viewbag

我有1700条记录。我想使用ajax对它们进行分页,以使页面加载更轻松。我可以根据所选页面每次进行分页并带来一组新记录。

问题 我在页面底部只显示了10个索引,选择了页面,左边是4,右边是5。现在我需要每次从jQuery / ajax发送到控制器的CurrentPage值,我将其作为ajax数据参数获取。问题在于返回当前页面值持久以查看我选择的下一页索引。我总是得到旧值而不是最后选择的页面值。我甚至使用ViewBag而不是tempData但没有成功。

查看代码:

@model IEnumerable<UrCompedDAL.DBModels.SlotMachineModel>
 <div class="my-properties">
                            <table id="tbl_slots" class="table no-margin" data-search="true" data-pagination="false">
                                <tbody class="orgTbody">
                                    @foreach (var item in Model)
 {
                                        <tr>
                                            //Code for Slot list
                                        </tr>
                                                                }
                                </tbody>
                            </table>
                            <ul class="paging">
                                @{
                                                int i = 1;
                                                int pg = Convert.ToInt32(TempData["Current"]);
                                                if (i > 0 || i == ViewBag.PageSize)
                                                {
                                        <li>
                                            <a href="#" class="lipaging"><<</a>
                                        </li>
                                    }


                                    if (pg < 6)
                                    {
                                        for (i = 1; i < 11; i++)
                                        {
                                            <li>
                                                <a href="#" class="lipaging">@i</a>
                                            </li>
                                        }
                                    }

                                    else
                                    {
                                        for (i = pg - 4; i < pg; i++)
                                        {
                                            <li>
                                                <a href="#" class="lipaging">@i</a>
                                            </li>
                                        }
                                        for (i = pg; i < pg + 6; i++)
                                        {
                                            <li>
                                                <a href="#" class="lipaging">@i</a>
                                            </li>
                                        }
                                    }


                                    if (i > 1 || i < ViewBag.PageSize)
                                    {
                                        <li>
                                            <a href="#" class="lipaging">>></a>
                                        </li>
                                    }
                                }
                            </ul>
                        </div>
<script>
    $(document).ready(function () {
$('.lipaging').click(function () {
            $("#loadingDiv").show();
            $(this).addClass('active');
            var pageThis = $(this).text();
            var current = @TempData["Current"];
            if (pageThis == '>>') {
                pageThis = current +1;
            }
            if (pageThis == '<<') {
                pageThis = current -1;
            }
 $.ajax({
                type: 'get',
                url: '@Url.Action("Index", "Game_SlotMachine")',
                data: {
                    CurrentPage: pageThis
                }
            }).done(function (data) {

                var startIndex = data.indexOf("<tbody");
                var endIndex = data.indexOf("</tbody>");
                var html = data.substring(startIndex, endIndex + 8);


                $('#tbl_slots').html('');
                $('#tbl_slots').html(html);

                setTimeout(function () {
                    filter();
                }, 300);
                $("#loadingDiv").hide();
});
        });

控制器代码:

public ActionResult Index(int id = 0, int CurrentPage = 1)
        {
            List<SlotMachineModel> slotmodel = new List<SlotMachineModel>();
            slotmodel = UrCompedDAL.DataAccessor.Instance.GameAccessor.GetAllSlotMachines().ToList();
            ViewBag.PageSize = slotmodel.Count / 10;

            TempData["Current"] = CurrentPage;

                slotmodel = slotmodel.Skip((CurrentPage - 1) * 10).Take(10).ToList();
            return View(slotmodel);
        }

请帮忙。

2 个答案:

答案 0 :(得分:0)

将模型IEnumerable<UrCompedDAL.DBModels.SlotMachineModel>打包到其他模型中,并将模型设置为新模型的属性。将此新模型作为视图的模型传递。您可以根据需要从控制器传递尽可能多的数据。

答案 1 :(得分:0)

问题在于您重新创建整个视图,但只从结果中更新table

 var html = data.substring(startIndex, endIndex + 8);
 $('#tbl_slots').html('');
 $('#tbl_slots').html(html);

(您还应该重新考虑如何从视图中提取表格并使用部分表格)。

没有使用分页ul的ajax / 2nd +渲染,并且&#34;抛弃&#34;每一次。

您可以使用与表相同的方式覆盖ul,也可以通过javascript(可能是前者)更新分页元素。

重复使用整个视图(而不是部分视图),你会得到类似的结果:

}).done(function (data) {    
    var html = $("<div/>").html(data);
    $('#tbl_slots').html(html.find("#tbl_slots").html());
    $('ul.paging').html(html.find("ul.paging").html());