2

我正在从 AJAX 调用返回部分视图,但它没有被渲染。看起来 showOtherTrade 函数没有被调用,见下面的代码;

我的观点是;

@model SCD.ViewModels.OtherTradesViewModel

@{
    ViewBag.Title = "Edit Other Trades";
}
<fieldset>
    <legend>Edit Other Trades for the subcontractor @Model.Subcontractor.CompanyName</legend>
    <p class="highlight">@ViewBag.Message</p>
    <p>The Primary Trade is set to @Model.PrimaryTradeName</p>

    <form method="get" action="@Url.Action("EditOtherTrades")" 
          data-scd-ajax="true" data-scd-target="#otherTradeList">
        <p>Select a trade: <input type="search" name="searchOtherTrade" id="searchOtherTrade" data-scd-autocomplete="@Url.Action("AutocompleteOtherTrade", "DataService")" style = "width: 300px;" class="submitSelection"/>
        </p>
    </form>  

    @Html.Partial("_OtherTrades", Model.OtherTrades.ToList())
</fieldset>

我的 PartialView 是@model IList

<div id="otherTradeList">
    <table>
        @Html.DisplayForModel()
    </table>
</div>

DisplayTemplate 是;

@model SubcontractorTrade
<tr>
    <td>@Model.Trade.TradeName </td>
    <td><input type="button" value="Remove"/>@Html.HiddenFor(model => model.TradeId)</td>
</tr>

我正在使用自动完成连接到要添加到网格的数据项。

所以我的javascript看起来像;

var showOtherTrade = function (data) {
        var $form = $(this);
        var $target = $($form.attr("data-scd-target"));
        var $newHtml = $(data);
        $target.replaceWith($newHtml);
        $newHtml.effect("highlight");
    };

    var updateAutocompleteForm = function (event, ui) {
        var $input = $(this);

        if ($input.hasClass("submitSelection")) {
            $input.val("");
            var searchId = ui.item.id;
            url = AddOtherTradeUrl;
            dataService.addOtherTrade(searchId, showOtherTrade, url);
        } 
    };

    var createAutocomplete = function () {
        var $input = $(this);

        var options = {
            source: $input.attr("data-scd-autocomplete"),
            select: updateAutocompleteForm
        };

        $input.autocomplete(options);
    };

并且似乎未调用 showOtherTrade 函数。这可能是我需要解决的问题。

我的数据服务,如果你有兴趣,看起来像;

var dataService = new function () {
    $.ajaxSetup({
        cache: false
    });
    addOtherTrade = function(searchId, callback, url) {
        $.getJSON(url,
            { searchId: searchId },
            function(data) {
                callback(data);
            });
        };

        return {
            addOtherTrade: addOtherTrade
        };
} ();
4

1 回答 1

4

您可以在成功或失败 ajax 调用中调用此代码

$.get(action, null, function(data){
  $('#someDiv').html(data);
}, 'html');

你的控制器可能会返回:

return PartialView("SomePartial", Model)
于 2013-01-11T21:57:56.283 回答