jquery - 在 Ajax Post 之后通过 jQuery 刷新 PartialView

Question

是否有人有特殊的方法可以将 jQuery Form ajax post 发送到 Controller 方法，强制刷新同一页面上现有的 PartialView？这是否涉及将部分 HTML 返回并附加，或者我可以简单地以某种方式导致 PartialView 神奇地刷新吗？

提前致谢。 道格

这是我的 RenderPartial，其形式如下...想要通过下面的 ajax 调用刷新 RenderPartial...

    <% Html.RenderPartial("p_Offers", Model.Offers); %>

<h2>Make an Offer</h2>
<form id="makeOffer" action="/post/makeoffer/<%=Model.Id %>" method="post">
    <div class="grid_2 alpha"><label>Comment</label></div>
    <div class="grid_6 omega"><%= Html.TextBox("Comment")%></div>

    <div class="grid_2 alpha"><label>Payment Terms</label></div>
    <div class="grid_6 omega"><%= Html.TextArea("PaymentTerms")%></div>

    <div class="grid_2 alpha"><label>Amount</label></div>
    <div class="grid_6 omega"><%= Html.TextBox("Amount")%></div>

    <div class="prefix_2">
        <label>Tentative <input type="radio" checked="checked" name="Confirmed" value="Tentative" /></label>
        <label>Confirmed <input type="radio" name="Confirmed" value="Confirmed" /></label>
    </div>

    <div class="prefix_2">
        <input type="submit" value="Make Offer" />
    </div>
</form>

这里是ajax调用......

        $(document).ready(function() {
        $('#makeOffer').ajaxForm(function() {
            var f = $("#makeOffer");
            var action = f.attr("#action");
            var serializedform = f.serialize();
            $.post(action,
                serializedform,
                function() {
                    alert("post error");
                });
            // TODO want to refresh Offers partial view  
            return false;
        });

        jQuery().ajaxStart(function() {
            $("#makeOffer").fadeOut("slow");
        });

        jQuery().ajaxStop(function() {
            $("#makeOffer").fadeIn("fast");
        });

Answer 1

如果将部分 View 包装在 div 中并返回部分 View 标记 您可以简单地使用 .post 回调来替换/附加新标记。

请注意，以下内容替换了整个部分标记。如果您想要的话，您可以轻松地将其更改为使用 .append()。

$.post(action,
       serializedform,
       function(html) {
          $('#viewWrapperDiv').html( html ); 
          //$('#viewWrapperDiv').append( html ); 
       }
);