使用 jquery 加载部分视图

Question

我想显示 div 的部分视图。试了很多方法都没有结果。

请给我一个合适的解决方案我是 mvc 的新手

这是主要的 ****索引页****

@model TelerikAdmin.Models.ViewModel.UserViewModel

        @{
            ViewBag.Title = "Index";
           // Layout = "~/Views/Shared/_LayoutPage1.cshtml";
        }
        <script src="~/Scripts/jquery-1.7.1.js"></script>
        <script src="~/Scripts/jquery-1.7.1.min.js"></script>
        <style>
            .k-ff input.k-textbox {
                height: 2.17em;
                width:350px;

            }
            .content-wrapper {
                margin:5% auto auto 25%;
                border:1px solid yellow;
                width:550px;
            }
            #container tr td{
                padding:10px;
            }
        </style>
        <script>
            $(function () {
                $('#loadFromMainFrame').click(function (e) {
                    e.preventdefault();
                    var url = $(this).data(url);
                    $('#mainframeContens').load(url);
                });
            });
        </script>
        <input id="loadFromMainFrame" type="button" data-url="@Url.Action("GetView","Privilege")" value="Click" />
        <div id="mainframeContens">
        </div>

这是我的部分观点(patial.cshtml) 我将局部视图放在共享文件夹或任何其他地方的位置

这是局部视图

这是我的控制器操作

using Kendo.Mvc.UI;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using Kendo.Mvc.Extensions;
using TelerikMvcApp5.Models.Context;
using TelerikAdmin.Models.ViewModel;

namespace TelerikAdmin.Controllers
{
    public class PrivilegeController : Controller
    {
        ShoppingContext db = new ShoppingContext();
        public ActionResult Index()
        {
         return View();
        }

        public ActionResult GetView()
        {
            return PartialView("partial");
        }

    }
}

Answer 1

请按如下方式使用。

像下面这样更改你的 JS。

<script>
    $(function () {
        $('#loadFromMainFrame').click(function (e) {
            e.preventdefault();

            var url = $(this).data(url);

            $.ajax({
                url: url,
                type: 'GET',
                success: function (result) {
                    $('#mainframeContens').html(result);
                }
            });
        });
    });
</script>

注意：您的局部视图加载 Div 应该如下所示。

<div id="mainframeContens">
    @Html.Partial("partial")
</div>

在您的 Action 方法中提及如下所示的 HTTPGET

[HttpGet]
public ActionResult GetView()
{
    return PartialView("partial");
}

使用 jquery 加载部分视图

load partial view by using jquery

asp.net-mvc

asp.net-mvc-3

asp.net-mvc-4

model-view-controller

这是局部视图