如何根据 mvc 中的按钮单击将 linq 结果显示到局部视图并刷新局部视图？答案

【问题标题】：How to show linq result to a partial view and refresh partial view based on button click in mvc?如何根据 mvc 中的按钮单击将 linq 结果显示到局部视图并刷新局部视图？
【发布时间】：2018-12-31 11:05:47
【问题描述】：

我有一个页面，左侧包含作业列表，右侧包含部分视图以显示所选作业的详细信息（部分视图仅在用户单击作业时显示），但我无法通过选定的工作 ID 并没有在我的部分视图中得到它。

 public ActionResult Index(int? id)
        {

            var selectedjob = db.Postings.ToList();
            if (Request.IsAjaxRequest())
            {
                 selectedjob = db.Postings.Where(p => p.PostingId == id).ToList();
                ViewBag.sss = selectedjob;
                return PartialView("_JobDetails", selectedjob);
            }

            return View("Index", selectedjob);
            //return View(db.Postings.ToList());
        }

【问题讨论】：

标签： asp.net-mvc updatepanel partial-views

【解决方案1】：

要刷新部分视图（选定的作业详细信息），您需要进行 ajax 调用。

例如

让我们说下面是您的工作列表 html。

    <ul>
       <li>
          <a hre="javascript:;" data-jobid="1" class="job-desc">Job 1 </a>              
       </li>
       <li>             
          <a hre="javascript:;" data-jobid="2" class="job-desc">Job 2 </a>
       </li>
    </ul>

让我们假设你的 jquery click 事件为 -

 $(document).on('click', '.job-desc', function () {
    var JobId = $(this).data('jobid'); // This will get the clicked job's Id

    $.ajax({
        url: "@Url.Action("Index","Home")",
        type: 'post',
        dataType:"HTML", // as we will be returning Partial view
        data: { id: JobId },
        success: function (data) {
            $('#job-details').html(data); // assuming that your job details is under "job-details" as div id
        }
    });
});

现在您在 Home 控制器中的操作结果将如下所示 -

    public ActionResult Index(int? id)
    {
        var selectedjob = db.Postings.ToList();
        if (Request.IsAjaxRequest())
        {
             selectedjob = db.Postings.Where(p => p.PostingId == id).ToList();
             ViewBag.sss = selectedjob;

        }
        return PartialView("_JobDetails", selectedjob);
    }

【讨论】：