2

我有一些代码在提交表单时发送 ajax 请求。这在第一次提交表单时有效(它是一个搜索模块),但只有一次。我添加了在返回数据时突出显示表格的效果,并且您只能看到一次(数据也只更改一次)。

当我查看 chrome 开发工具中的响应时,我可以看到它包含新搜索查询的数据,但未显示。为什么我只能显示一次结果?

JS:

$(function () {
// Creates an ajax request upon search form submit
 var ajaxFormSubmit = function () {
    var $form = $(this);

    var options = {
        url: $form.attr("action"),
        type: $form.attr("method"),
        data: $form.serialize()
    };

    $.ajax(options).done(function (data) {
        var $target = $($form.attr("data-nn-target"));
        var $newHtml = $(data);
        $target.replaceWith($newHtml);
        $newHtml.effect("highlight");
    });

    // Prevent default action
    return false;
 };

 $("form[data-nn-ajax='true']").submit(ajaxFormSubmit);
});

HTML:

<form method="GET" action="@Url.Action("Index", "Show")" data-nn-ajax="true" data-nn-target="#contentlist" class="form-search">
    <div class="input-append mysearch">
        <input type="search" class="span5 search-query" name="query" data-nn-autocomplete="@Url.Action("AutoComplete")" />
        <input type="submit" class="btn" value="Search" />
    </div>
</form>

<div id="contentlist">
    @Html.Partial("_Shows", Model)
</div>
4

2 回答 2

4

我认为你应该使用html()而不是replaceWith()方法:

$target.html($newHtml);
于 2013-06-28T14:03:00.133 回答
2

只是一个想法......试试

$target.html(data);

代替

$target.replaceWith($newHtml);

通过replaceWith,您实际上可能会删除要填充内容的div。然后,第二次,它找不到要插入内容的div。

于 2013-06-28T14:03:31.510 回答