Question

我的主要观点是从局部视图加载列表。我正在使用Jquery搜索它，这没关系。但是，我在清除搜索结果时遇到了麻烦：部分视图没有重新加载。我确信控制器正在返回正确的结果。我做错了什么？

主视图代码：

<div>
    <div style="float:right; padding: 0px 5px 5px 5px;">
        <form method="get" action="@Url.Action("GetJobOffersList", "JobOffers")" data-otf-ajax="true" data-otf-target="#jobOffersPartialViewDiv">
            <input type="search" name="searchTerm" data-otf-autocomplete="@Url.Action("Autocomplete", "JobOffers")" />
            <input type="submit" value="Search" />
            <input type="submit" value="Clear" id="clearSearchButton"/>
        </form>
    </div>
</div>

<div id="jobOffersPartialViewDiv">
    @Html.Partial("_JobOffersList")
</div>

JQuery代码：

$(document).ready(function () {
    autocomplete();
    search();
    clear();
});

function clear() {
    $("#clearSearchButton").click(function () {
        $("input[data-otf-autocomplete]").val("");

        $.ajax({
            url: '/JobOffers/GetJobOffersList',
            type: 'GET',
            cache: false,
            success: function (result) {
                $("form[data-otf-ajax='true']").attr("data-otf-target").replaceWith(result);
            }
        });
    });
}

Answer 1

您需要替换实际元素而不是＆＃34;属性字符串＆＃34;。变化：

$("form[data-otf-ajax='true']").attr("data-otf-target").replaceWith(result);

到

$($("form[data-otf-ajax='true']").attr("data-otf-target")).replaceWith(result);

如果你＆＃34;扩展＆＃34;您的初始代码为多行，如下所示：

var formElement = $("form[data-otf-ajax='true']"); // jQuery element of the from
var target = formElement.attr("data-otf-target");  // "#jobOffersPartialViewDiv"
target.replaceWith(result);                        // 'replaceWith' on string

并在更改后：

var formElement = $("form[data-otf-ajax='true']"); // jQuery element of the from
var target = formElement.attr("data-otf-target");  // "#jobOffersPartialViewDiv"
var targetElement = $(target)                      // jQuery element of the target
target.replaceWith(result);                        // 'replaceWith' on target element

使用JQuery重新加载部分视图

1 个答案: