Javascript 如何用Asp.NETMVC调用局部视图

我需要搜索数据库，只加载视图，而不是刷新整个页面。Js中的一个函数在单击search时调用控制器上的my方法，控制器返回视图

function Pesquisa()
{
  let campo = document.getElementsByName("campo");
  let pesquisa = document.getElementsByName("EdtPesquisa");
  let condicao = document.getElementsByName("pesquisa");

  let scampo = Array();
  let spesquisa = Array();
  let scondicao = Array();

  let sNomeGrid = ($(this).find("a").text());    

  for (var indice = 0; indice < pesquisa.length; indice++)
  {
    string = pesquisa[indice].value;

    if (string.trim() != "")
    {           
        scampo[indice] = campo[indice].id;
        scondicao[indice] = condicao[indice].value;
        spesquisa[indice] = pesquisa[indice].value;            
    }
  }

window.location.href = "/MenuPrincipal/RetornarView?sNomeGrid=" + "Unidade" + "&listacampo=" + scampo + "&listacondicao=" + scondicao + "&listapesquisa=" + spesquisa;

函数Pesquisa（）
{
让campo=document.getElementsByName（“campo”）；
让pesquisa=document.getElementsByName（“EdtPesquisa”）；
让condico=document.getElementsByName（“pesquisa”）；
设scampo=Array（）；
设spesquisa=Array（）；
设scondicao=Array（）；
让sNomeGrid=（$（this.find（“a”）.text（））；
对于（变量indice=0；indice

控制器

public IActionResult RetornarView(string sNomeGrid, List<string> listacampo, List<string> listacondicao, List<string> listapesquisa)
{
    var sWhere = "";

    if (listacampo.Count > 0)
    {
        Pesquisa _Pesquisa = new Pesquisa();

        sWhere = _Pesquisa.Pesquisar(listacampo, listacondicao, listapesquisa);
    }

    if (sNomeGrid == "Unidade")
    {
        var listaunidade = _UnidadeRepositorio.ListarMenu(sWhere);

        return View("Unidade", listaunidade);
    }

    return View("MenuPrincipal");
}

public IActionResult RetronarView（字符串sNomeGrid、列表Acampo、列表Acondicao、列表Apesquisa）
{
var sWhere=“”；
如果（listacampo.Count>0）
{
Pesquisa _Pesquisa=新的Pesquisa（）；
sWhere=_Pesquisa.Pesquisar（listacampo、listacondicao、listapesquisa）；
}
如果（斯诺梅格里德==“Unidade”）
{
var listaunidade=_UnidadeRepositorio.ListarMenu（此处为sWhere）；
返回视图（“Unidade”，Listunidade）；
}
返回视图（“MenuPrincipal”）；
}

看法

@model IEnumerable
@DisplayNameFor（model=>model.idunidade）
@DisplayNameFor（model=>model.sdescricao）
@DisplayNameFor（model=>model.sunidade）
@DisplayNameFor（model=>model.sdigitavolume）
@DisplayNameFor（model=>model.spadraosistema）
@foreach（模型中的var Unidade）
{
@DisplayFor（modeleItem=>Unidade.idunidade）
@DisplayFor（modeleItem=>Unidade.sdescricao）
@DisplayFor（modeleItem=>Unidade.sunidade）
@DisplayFor（modeleItem=>Unidade.sdigitavolume）
@DisplayFor（modeleItem=>Unidade.spadraosistema）
}

---

返回包含列表的视图以填充表格，但在此过程中，整个页面将刷新。

您可以根据需要使用以下方法之一：

方法一：如果要使用ViewData，请尝试以下操作：

@Html.Partial("~/PathToYourView.cshtml", null, 
    new ViewDataDictionary { { "VariableName", "some value" } })

和检索传入的值：

@{
    string valuePassedIn = this.ViewData.ContainsKey("VariableName") ? 
        this.ViewData["VariableName"].ToString() : string.Empty;
}

方法二：如果仅使用部分名称渲染部分：

@Html.Partial("_SomePartial", Model)

方法二：使用jQuery Ajax调用呈现部分视图：

首先将您的正文内容包装在一个div中，并在_布局页面中为其分配任何id：

<div id="div-page-content" class="page-content">
    @RenderBody() 
</div>

<ul class="sub-menu">
    <li class="nav-item  ">
        <a href="#" onclick="renderPartial(event, 'Account', '_Register')" class="nav-link">
            <span class="title">Create New User</span>
        </a>
    </li>
</ul>

function renderPartial(e, controller, action) {
    e.preventDefault();
    e.stopPropagation();

    var controllerName = controller;
    var actionName = action;

    if (String(actionName).trim() == '') {
        return false;
    }
    if (typeof (controllerName) == "undefined") {
        return false;
    }

    var url = "/" + controllerName + "/" + actionName;

    ////Open url in new tab with ctrl key press
    //if (e.ctrlKey) {
    //    window.open(url, '_blank');
    //    e.stopPropagation();
    //    return false;
    //}

    $.ajax({
        url: url,
        data: { /* additional parameters */ },
        cache: false,
        type: "POST",
        dataType: "html",

        success: function (data) {
            var requestedUrl = String(this.url).replace(/[&?]X-Requested-With=XMLHttpRequest/i, "");
            if (typeof (requestedUrl) == "undefined" || requestedUrl == 'undefined') {
                requestedUrl = window.location.href;
            }

            // if the url is the same, replace the state
            if (typeof (history.pushState) != "undefined") {
                if (window.location.href == requestedUrl) {
                    history.replaceState({ html: '' }, document.title, requestedUrl);
                }
                else {
                    history.pushState({ html: '' }, document.title, requestedUrl);
                }
            }

            $("#div-page-content").html(data); 
        },
        error: function (data) { onError(data); }
    });
};

定义您的PartialView，如下所示：

<div>
    ... partial view content goes here >
</div>            

[HttpPost]
[AllowAnonymous]
public PartialViewResult _Register(/* additional parameters */)
{
    return PartialView();
}

---

希望这能帮助amigo…

我会在你的案例中使用jQuery。你可以向你的控制器方法发出http请求，然后你会得到html，可以插入它或用当前视图替换它。所有这些都可以在不重新加载page@jd3Tecnologia朋友，你能看看我下面的答案吗？如果我有问题，请告诉我不管用？

[HttpPost]
[AllowAnonymous]
public PartialViewResult _Register(/* additional parameters */)
{
    return PartialView();
}