在Ajax.BeginForm中傳遞UpdateTargetId而不是替換目標

在Ajax.BeginForm中，即使我已指定targetId是我的部分視圖，它將替換完整視圖。我錯過了什麼嗎？在Ajax.BeginForm中傳遞UpdateTargetId而不是替換目標

ProductList.cshtml

<div class="form-style-1" style="float:left"> 
      @using (Ajax.BeginForm("SearchProducts", "Product", new AjaxOptions() 
      { 
      HttpMethod="POST", 
      InsertionMode = System.Web.Mvc.Ajax.InsertionMode.Replace, 
      UpdateTargetId = "product-list-container" 
      })) 
      { 
      <form> 
       <input name="SearchText" id="SearchText" class="field-divided" style="width: 300px;" type="text" /> 
       <input type="submit" value="Search" class="myButton" /> 
      </form> 
      } 
     </div>@Html.Partial("ListPartialView", Model) 


ListPartialView.cshtml - 

<div id="product-list-container"> 
    @foreach (var product in Model) 
    { 
     <div class="product_box margin_r40"> 
      <div class="thumb_wrapper"><a><img src="@Url.Content(@product.ImagePath)" alt="image 1" /></a></div> 
      <h3>@product.ProductName</h3> 
      <p>@product.Description</p> 
     </div> 
    } 
    <div class="button_01"><a href="#">View All</a></div> 
    <div class="cleaner"></div> 
</div>

SearchProducts - 控制器動作

[HttpPost] 
     public ActionResult SearchProducts() 
     { 
      var searchTxt = Request.Form["SearchText"];             
      IEnumerable<Product> searchedProducts = (from p in dal.Products 
                where p.ProductName.Contains(searchTxt) || 
                p.Description.Contains(searchTxt) 
                select p).ToList(); 

      return PartialView("ListPartialView", searchedProducts); 
     }

來源

2016-08-29 Abhilash V

請確保您有包含在你頁面/佈局jquery.unobtrusive-ajax.js。

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

此文件使您的表單變爲Ajax化。

如果你沒有包含這個文件，你的表單將是一個正常的表單。點擊提交按鈕將執行正常的表單提交，這可能是您查看整個頁面的原因。

來源

2016-08-29 18:24:26 Shyju

我已經包含在主頁面中。這是我檢查的第一件事 –

檢查您的瀏覽器控制檯是否有任何js錯誤 – Shyju

Jquery腳本排序錯誤，從控制檯中找出它。非常感謝。 –

在Ajax.BeginForm中傳遞UpdateTargetId而不是替換目標

回答

相關問題