代码之家 › 专栏 › 技术社区 › Davy

从jquery加载未在MVC中显示的部分视图

partial-views asp.net-mvc jquery asp.net

Davy · 技术社区 · 15 年前

使用jquery加载部分视图时,在ASP.NET MVC 1.0中呈现该视图时遇到问题。

我有一个控制器,比如:

    public ActionResult Index() {
        return View(_invoiceService.FindAllInvoices());
    }

    public ActionResult InvoiceSearchResults() {
        return PartialView("InvoiceSearchResults",_invoiceService.FindAllInvoices());
    }

我有一个索引视图:

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
    Index
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<%= Html.Script("/scripts/InvoiceSearch.js") %>

<h2>Search</h2>
<div class="SearchBar">
</div>

<div class="SearchResults"></div>

<p><%= Html.ActionLink("Create New", "Create") %></p>
</asp:Content>

然后我有一个部分的观点:

<table>
    <tr>
        <th></th>
        <th>InvoiceId</th>
        <th>InvoiceNo</th>
        <th>SupplierId</th>
        <th>InvoiceDate</th>
        <th>TotalValue</th>
        <th>InputDate</th>
        <th>PaymentDueDate</th>
        <th>InvoiceStatusId</th>
        <th>AuthoriserId</th>
    </tr>

<% foreach (var item in Model) { %>
    <tr>
        <td>
            <%= Html.ActionLink("Edit", "Edit", new { id=item.InvoiceId }) %> |
            <%= Html.ActionLink("Details", "Details", new { id=item.InvoiceId })%>
        </td>
        <td><%= Html.Encode(item.InvoiceId) %></td>
        <td><%= Html.Encode(item.InvoiceNo) %></td>
        <td><%= Html.Encode(item.SupplierId) %></td>
        <td><%= Html.Encode(String.Format("{0:g}", item.InvoiceDate)) %></td>
        <td><%= Html.Encode(String.Format("{0:F}", item.TotalValue)) %></td>
        <td><%= Html.Encode(String.Format("{0:g}", item.InputDate)) %></td>
        <td><%= Html.Encode(String.Format("{0:g}", item.PaymentDueDate)) %></td>
        <td><%= Html.Encode(item.InvoiceStatusId) %></td>
        <td><%= Html.Encode(item.AuthoriserId) %></td>
    </tr>
<% } %>
</table>

我有一些jquery:

$(document).ready(function() {
    $("#InvoiceDropDown").change(function() {
        $("#SearchResults").load("/Invoice/InvoiceSearchResults/");      
    });
});

我已经删除了一些代码,我知道这些代码可以使问题更容易阅读。

当我单击我的DropDownList时,它调用jQuery,转到我的控制器,似乎运行了分部类,但它不呈现任何内容。

我试过邪恶的答案,同样的事情也发生了,所以也许我在某个地方做了一些愚蠢的事情?

任何帮助或一般建议在此非常感谢。

3 回复 | 直到 8 年前

dano 15 年前

我有一个解决方案:

而不是使用

$("#SearchResults").load("/Invoice/InvoiceSearchResults/");

尝试使用$.Ajax()请求控制器,然后将答复放入HTML。我成功地完成了这项工作,我将尝试解释下面的答案:

控制器方法

保持原样

public ActionResult InvoiceSearchResults()
{                        
    return PartialView("InvoiceSearchResults",_invoiceService.FindAllInvoices());
}

Ajax调用

$.ajax({
    url: "/Invoice/InvoiceSearchResults/",
    type: 'GET',
    dataType: 'html', // <-- to expect an html response
    success: doSubmitSuccess
});

OnSuccess JS方法

function doSubmitSuccess(result)
{
    $('div#MyDiv').html(result);
}

AlexB borjafp 8 年前

$("#SearchResults").load("/Invoice/InvoiceSearchResults/");

应该是:

$(".SearchResults").load("/Invoice/InvoiceSearchResults/");

选择器问题-找不到它。

谢谢(Evildonald-我投票通过了你的答案)

Cyril Gupta 15 年前

隐马尔可夫模型。。。虽然上面的代码应该可以工作(也可以使用$.Ajax),但我已经使用了第三种方法来呈现我的部分。A$获取请求。

这是一个样本

$.get(postUrl, function(data) {
                $("#posts").append(data);
                $('#ajaxLdMore').addClass('hideElement');
                $('#ldMore').removeClass('hideElement');
            });

所以也许你会第三次幸运。