MVC4 Ajax.BeginForm不更換UpdateTargetId

上有與Ajax.BeginForm不能正確地與回報局部視圖更新目標元素，以便有關問題這麼多的主題：
mvc4 ajax updating same page
ASP.NET MVC 4 - Ajax.BeginForm and html5
MVC 4 (razor) - Controller is returning a partialview but entire page is being updated
MVC 4 Ajax is not updating the PartialView within the page
但是，所有這些都可以通過手動編寫jQuery ajax或包含缺少的javascript文件來回答。MVC4 Ajax.BeginForm不更換UpdateTargetId

@using (Ajax.BeginForm("PostcardDetails", new AjaxOptions() 
    { 
    InsertionMode = InsertionMode.Replace, 
    UpdateTargetId = "details" 
    })) 
    { 
    <div id="PostcardSearchResults"> 
     @{Html.RenderAction("PostcardSearchResults", Model);} 
    </div> 
    } 
    <div id="details"> 
    </div>

相關的控制器代碼：

[AcceptVerbs(HttpVerbs.Post | HttpVerbs.Get)] 
public ActionResult PostcardSearchResults(PostcardSearchFilter filter) 
{ 
     PostcardSearchResults model = new PostcardSearchResults(filter); 
     return PartialView("_PostcardSearchResults", model); 
}

在我的佈局，我引用這些jQuery的文件。另外，我已驗證該頁面正在輸出正確的路徑，並且它找到了正確的文件。我嘗試切換unobtrusive-ajax.min.js和validate.min.js的順序，但沒有成功。

<script type="text/javascript" src="@Url.Content("~/Scripts/globalize.js")"></script> 
<script type="text/javascript" src="@Url.Content("~/Scripts/jquery-1.9.1.js")"></script> 
<script type="text/javascript" src="@Url.Content("~/Scripts/jquery-ui-1.10.0.custom.min.js")"></script> 
<script type="text/javascript" src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")"></script> 
<script type="text/javascript" src="@Url.Content("~/Scripts/jquery.validate.min.js")"></script> 
<script type="text/javascript" src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")"></script>

此外，在我的網站的根web.config，在我看來，文件夾中的web.config文件，我已經包括：

<add key="webpages:Version" value="2.0.0.0"/> 
<add key="PreserveLoginUrl" value="true"/> 
<add key="ClientValidationEnabled" value="true"/> 
<add key="UnobtrusiveJavaScriptEnabled" value="true"/>

我在爲別的地方看的損失。沒有JavaScript錯誤被拋出，控制器正在被正確命中，返回一個PartialViewResult。 HTML中的Form元素填充所有正確的data-屬性。

來源

2013-02-26 drovani

jquery.unobtrusive-ajax.min和JQuery 1.9存在問題，因爲JQuery 1.9不支持live（）方法任何more。所以你應該使用JQuery遷移插件，並引用JQuery遷移js。

來源

2013-02-26 17:57:19

有點困惑，它與OP問題有什麼關係？你是說.live是Ajax.Beginform在底層使用的嗎？ – Shenaniganz 2013-02-26 18:02:07

忘了提，我已經更新了我的'jquery.unobtrusive-ajax.min.js'與建議，由這個帖子：http://stackoverflow.com/a/14512797/28310 如果我沒有，我會得到JavaScript錯誤。我也嘗試使用jquery-migrate。 – drovani 2013-02-26 18:20:48

是啊Ajax Beginform在引擎蓋下使用 – 2013-02-26 18:24:11

我遇到了類似的問題 - 我的所有腳本都捆綁並正確加載，並且所有代碼均正確實施。我檢查了包管理器，看是否需要更新任何腳本，以及jQuery和jquery.unobtrusive-ajax。 jQuery從1.9升至1.9.1。當我重建我的解決方案時，目標DIV已成功更新。嘗試並更新解決方案中的所有JS，它可能會起作用。

來源

2013-03-03 15:33:42 MattSull

以下需要在任何使用ajax的頁面上。

@section Script { 
    @Scripts.Render("~/bundles/jqueryval") 
}

來源

2013-11-20 23:20:26 user3015361

我有這個問題，我剛從的NuGet安裝了最新的不引人注目的軟件包，並解決了這個問題

PM>安裝，包裝Microsoft.jQuery.Unobtrusive.Ajax

是否需要JQ 1.8+

來源

2014-04-27 20:42:46 Andy

請確保您將unobtrusive-ajax.js添加到您已放置ajax表單的頁面中。

<script src="~/Scripts/jquery.unobtrusive-ajax.js"></script>

來源

2014-11-09 16:20:10 Cyrus

對於那些需要多一點的解釋....

在軟件包管理控制檯PM本型>安裝，包裝jQuery.Migrate在partialview

參考這樣的：

script src =「〜/ Scripts/jquery。不顯眼，ajax.js「>

編碼愉快的每一個人。

來源

2015-03-04 21:33:06 cyclical

我不知道有沒有人會碰到這一點，但對我來說，它只是似乎不需要升級。我是建設在您選擇您希望從下拉編輯的項目的簡單編輯表單，點擊一個按鈕，它AJAX加載所選項目的編輯形式。

它的工作是第一次，但將我的選擇後下拉列表，然後單擊按鈕，即使我驗證了我的服務器端代碼正在將新項目加載到視圖模型中，也沒有任何表單值發生更改。工作。在通過jquery.unobtrisive-ajax.js之後，我發現它是替換了我的目標元素的內容，只是使用了相同的視圖標記，它與傳遞給視圖的模型不匹配！

那時候我意識到，那是ModelState讓我感覺到了。第二次點擊加載按鈕，它提交我的下拉選擇，但也填寫了我的編輯表單。編輯表單中的所有值都被添加到ModelState（如您所期望的）。然後，我的控制器代碼將所提交的視圖模型（即從編輯表單值創建的模型聯編程序）替換爲所選下拉值的視圖模型，並將其傳遞給局部視圖。但是，局部視圖使用了一堆幫助器方法。這些忽略更新後的視圖模型並直接從ModelState中提取它們的值。例如：

@Html.DisplayFor(m => m.Name) 
@Model.Name

會爲Name顯示兩個不同的值;前者顯示提交的名稱和後者，更新的名稱。這是讓MVC在（服務器端）驗證錯誤之後記住用戶表單條目的機制。在這種情況下，因爲這是部分頁面加載，而我只是拋出所有提交的值，所以我不需要任何ModelState值，因此我只需調用ModelState.Clear（），然後返回更新的視圖查看模型。

public ActionResult GetItemEditForm(EditItemsViewModel editItemsVM) 
    { 
     if (editItemsVM.SelectedItemID != null) 
     { 
      //Load the selected item 
      ItemsModelManager.GetEditItemsVM(editItemsVM); 

      //Clear the submitted form values 
      ModelState.Clear(); 
     } 

     return PartialView("_ItemsEditor", editItemsVM); 
    }

來源

2015-09-23 21:47:06 xr280xr

用戶xr280xr對包括

ModelState.Clear();

答案爲我工作。我正在使用的應用程序是在一個較舊的jQ（1.7.x）上，所以遷移在我們的情況下不起作用。清除控制器中的模型狀態完全符合我們預期BeginForm的要求。

來源

2015-11-10 20:13:12

檢查主頁或專頁的腳本參考有關 jquery.unobtrusive-ajax.js 如果不添加引用這個JS：jquery.unobtrusive-ajax.js

來源

2016-01-13 06:18:08

加什麼？這是一個不完整的答案。 – AndroidMechanic 2016-01-13 06:46:20

有關此參考：jquery.unobtrusive-ajax.js – 2016-01-25 09:22:47

活（）方法是在棄用jQuery版本1.7，並在版本1.9中刪除。請使用on（）方法。有關更多信息，請參閱：http://www.w3schools.com/jquery/event_live.asp

來源

2016-06-17 11:08:07

哇，這裏有很多答案。我的問題是由於引導面板。它正在創建一個「嵌套」面板。我刪除了面板標記，只是使用一個普通的舊的div，它的工作。我認爲UpdateTargetId必須是AJAX表單的直接父項。

這是說明問題的html。

<div class="panel panel-default" id="notes-form"> 
    <div class="panel-body"> 
    @using (Ajax.BeginForm("EditNote", new { id = Model.Id }, new AjaxOptions { UpdateTargetId = "notes-form" }, htmlAttributes: new { @class = "form-horizontal" })) 
    { 
    } 
    </div> 
</div>

來源

2016-08-12 19:07:54 Jess

首先，安裝「Microsoft.JQuery.Unobtrusive。Ajax的'從的NuGet管理器和以後包括「〜/腳本/ jquery.unobtrusive」中的「BundleConfig」包括後「jquery- {版本} .js文件」;這看起來類似於這樣的：

bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
       "~/Scripts/jquery-{version}.js", 
       "~/Scripts/jquery.unobtrusive*));

來源

2016-12-22 07:25:59

MVC4 Ajax.BeginForm不更換UpdateTargetId

回答

相關問題