MVC通过PartialView部分加载刷新页面

1. 新建一个TaskBoardDetail.cshtml，内容如下：（主要是显示自己需要的数据）

@{
    int i = 0;
}
@foreach(var item in ViewBag.DataList)
{
    <div style="float:left;background-color:#e8e2e2;border:3px solid black;">
        @foreach (var it in item)
        {
            <p style="background-color:#15d32b">@it.functionName</p><br />
        }
    </div>
    i++;
}

2.在HomeController.cs中添加获取数据的 TaskBoardDetail方法，可带参数可不带，根据自己的需要

[HttpPost]
        public ActionResult TaskBoardDetail(string value)
        {
            try
            {
                IEnumerable<IGrouping<string, TaskDetail>> taskGroup = list.GroupBy(p => p.projectName);
                foreach (var item in taskGroup)
                {
                    if (value==item.Key)
                    {
                        List<TaskDetail> list2= item.ToList();
                        var query = from p in list2 orderby p.priority select p;//按优先级排序
                        list2 = query.ToList();
                        IEnumerable<IGrouping<string, TaskDetail>> taskGroup2 = list2.GroupBy(p => p.group);
                        ViewBag.DataList = taskGroup2;
                        break;
                    }
                }
                return PartialView("TaskBoardDetail");
            }
            catch (Exception exp)
            {
                throw exp;
            }
        }

其中TaskDetail是我自定义的类。此函数的主要目的就是给ViewBag.DataList赋值，并return PartialView("TaskBoardDetail");

3.我是要在Index页面点击按钮，刷新加载TaskBoardDetail内容。放置一个div用于承接TaskBoardDetail内容。

<div>
        <input type="button" οnclick="BtnClick()" value="确定">
    </div>

    <div id="Selector"></div>

脚本如下：

<script type="text/javascript" language="javascript">        
        $(document).ready(function () {
            $("input[type='button']").click(function () {
                $.ajax({
                    url: "Home/TaskBoardDetail",
                    type: "Post",
                    data: { "value": $(this).val()},
                    success: function (data) {
                        $("#Selector").html(data);},
                    error: function (XMLHttpRequest, textStatus, errorThrown) {
                        alert("加载失败：" + errorThrown);
                    }
                });
            });
        });

    </script>

OK！加载刷新页面成功。