3

JQueryを使用してロードすると、ASP.NetMVC1.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>

次に、PartialViewがあります。

<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が呼び出され、コントローラーに移動して部分クラスを実行しているように見えますが、何もレンダリングされません。

私はevilDonaldの答えを試しましたが、同じことが起こるので、どこかで何か愚かなことをしたのではないでしょうか。

ここでのヘルプや一般的なアドバイスは大歓迎です。

4

3 に答える 3

9

私はあなたのための解決策を持っています:

使用するのではなく

$("#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
});

OnSuccessjsメソッド

function doSubmitSuccess(result)
{
    $('div#MyDiv').html(result);
}
于 2009-10-07T17:17:55.660 に答える
2
$("#SearchResults").load("/Invoice/InvoiceSearchResults/");   

になるはずだった:

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

セレクターの問題 - 見てもわかりませんでした。

ありがとう(EvilDonald - あなたの回答に投票しました)

于 2009-10-07T18:29:27.170 に答える
0

うーん...上記のコードは動作するはずですが ($.ajax も)、パーシャルをレンダリングするために 3 番目のアプローチを使用しています。$.get リクエスト。

これがサンプルです

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

そうすれば、3度目の幸運に恵まれるかもしれません。

于 2009-10-07T18:31:21.033 に答える