는 MVC 3 아약스

Question

REVISED

하지만 같은 문제로 새로운 목록을 추가 할 수 있습니다. 프로필 페이지에서 사용자는 센터에서 제공하는 새 업체 정보를 만들 수 있습니다. 나는 완벽하게 작동하는 페이지의 "_CenterProfile"부분에 부분 뷰를 사용하여 이것을 만들었습니다. 나는 완벽하게 작동하는 페이지 및 모델의 주요 초점으로 Create Listing를 구현했습니다. Ajax를 사용하여 데이터베이스 항목을 작성하고 프로필 페이지에 표시된 목록을 채우거나 업데이트하려고합니다. 문제가있는 곳입니다.

대상 요소를 업데이트하는 대신 제출 단추를 클릭하면 페이지가 존재하지 않는 "CreateListing"페이지 ../Exchange/CreateListing으로 넘깁니다. 이 기능을 작동 시키려고 미친 듯이 노력하고 내가 시도한 것과 상관없이 똑같은 일을합니다. 목록이 데이터베이스에 채워지고 페이지가/Exchange/Profile에서/Exchange/CreateListing으로 변경됩니다.

나는 누군가가 저를 도울 수 있다고 확신합니다. 마감일이 지나서이 두통이 지나면 점점 커집니다.

보기 "프로필"

 @model Exchange.Models.CreateListingModel 

@{ 
    ViewBag.Title = "Profile"; 
} 

<h2>Profile</h2> 

@Html.Action("_CenterProfile") 

<br /> 
@using (Ajax.BeginForm("CreateListing", "Exchange", new AjaxOptions 
{ 
    HttpMethod = "Get", 
    UpdateTargetId = "centerListings", 
    InsertionMode = InsertionMode.Replace 
})) 
{ 
    @Html.ValidationSummary(true) 
    <fieldset> 
     <legend>CreateListingModel</legend> 

     <div class="editor-label"> 
      @Html.LabelFor(model => model.productName) 
     </div> 
     <div class="editor-field"> 
      @Html.EditorFor(model => model.productName) 
      @Html.ValidationMessageFor(model => model.productName) 
     </div> 

     <div class="editor-label"> 
      @Html.LabelFor(model => model.forSale) 
     </div> 
     <div class="editor-field"> 
      @Html.EditorFor(model => model.forSale) 
      @Html.ValidationMessageFor(model => model.forSale) 
     </div> 

     <div class="editor-label"> 
      @Html.LabelFor(model => model.forTrade) 
     </div> 
     <div class="editor-field"> 
      @Html.EditorFor(model => model.forTrade) 
      @Html.ValidationMessageFor(model => model.forTrade) 
     </div> 

     <div class="editor-label"> 
      @Html.LabelFor(model => model.price) 
     </div> 
     <div class="editor-field"> 
      @Html.EditorFor(model => model.price) 
      @Html.ValidationMessageFor(model => model.price) 
     </div> 

     <div class="editor-label"> 
      @Html.LabelFor(model => model.unit) 
     </div> 
     <div class="editor-field"> 
      @Html.EditorFor(model => model.unit) 
      @Html.ValidationMessageFor(model => model.unit) 
     </div> 

     <div class="editor-label"> 
      @Html.LabelFor(model => model.catagoryID) 
     </div> 
     <div class="editor-field"> 
      @Html.EditorFor(model => model.catagoryID) 
      @Html.ValidationMessageFor(model => model.catagoryID) 
     </div> 

     <div class="editor-label"> 
      @Html.LabelFor(model => model.description) 
     </div> 
     <div class="editor-field"> 
      @Html.EditorFor(model => model.description) 
      @Html.ValidationMessageFor(model => model.description) 
     </div> 

     <div class="editor-label"> 
      @Html.LabelFor(model => model.imageURL) 
     </div> 
     <div class="editor-field"> 
      @Html.EditorFor(model => model.imageURL) 
      @Html.ValidationMessageFor(model => model.imageURL) 
     </div> 

     <div class="editor-label"> 
      @Html.LabelFor(model => model.activeListing) 
     </div> 
     <div class="editor-field"> 
      @Html.EditorFor(model => model.activeListing) 
      @Html.ValidationMessageFor(model => model.activeListing) 
     </div> 
    </fieldset> 

    <p> 
     <input type="submit" value="CreateListing" /> 
    </p> 
} 

    <table id="centerListings"> 

    </table> 


<p> 
    @Html.ActionLink("Edit", "Edit", new { /* id=Model.PrimaryKey */ }) | 
    @Html.ActionLink("Back to List", "Index") 
</p> 

CreateListing 컨트롤러 :

public PartialViewResult CreateListing(CreateListingModel model) 
{ 
    mmjc.CreateListing(model.catagoryID, model.productName, model.forSale, model.forTrade, model.price, model.unit, model.description, model.imageURL, model.activeListing); 
    var listings = mmjc.GetCenterListings(); 
    return PartialView("_CenterListings", listings); 
} 

_CenterListings PartialView :

@model IEnumerable<Exchange.Models.Listing> 

<table id="centerListings"> 
    <tr> 
     <th> 
      CatagoryID 
     </th> 
     <th> 
      ProductName 
     </th> 
     <th> 
      ToSell 
     </th> 
     <th> 
      ToTrade 
     </th> 
     <th> 
      PricePerUnit 
     </th> 
     <th> 
      Unit 
     </th> 
     <th> 
      Description 
     </th> 
     <th> 
      ImgPath 
     </th> 
     <th> 
      ProfileID 
     </th> 
     <th> 
      ActiveListing 
     </th> 
     <th></th> 
    </tr> 

@foreach (var item in Model) { 
    <tr> 
     <td> 
      @Html.DisplayFor(modelItem => item.CatagoryID) 
     </td> 
     <td> 
      @Html.DisplayFor(modelItem => item.ProductName) 
     </td> 
     <td> 
      @Html.DisplayFor(modelItem => item.ToSell) 
     </td> 
     <td> 
      @Html.DisplayFor(modelItem => item.ToTrade) 
     </td> 
     <td> 
      @Html.DisplayFor(modelItem => item.PricePerUnit) 
     </td> 
     <td> 
      @Html.DisplayFor(modelItem => item.Unit) 
     </td> 
     <td> 
      @Html.DisplayFor(modelItem => item.Description) 
     </td> 
     <td> 
      @Html.DisplayFor(modelItem => item.ImgPath) 
     </td> 
     <td> 
      @Html.DisplayFor(modelItem => item.ProfileID) 
     </td> 
     <td> 
      @Html.DisplayFor(modelItem => item.ActiveListing) 
     </td> 
     <td> 
      @Html.ActionLink("Edit", "Edit", new { id=item.ListingsID }) | 
      @Html.ActionLink("Details", "Details", new { id=item.ListingsID }) | 
      @Html.ActionLink("Delete", "Delete", new { id=item.ListingsID }) 
     </td> 
    </tr> 
} 

</table> 

Answer 1

모두에게 좋습니다. 그래서 나는 여기에 내 자신의 문제를 해결했다. 많은 사람들이 똑같은 문제를 겪고있는 것 같습니다. 수정이 너무 쉬워서 어리석은 느낌이 들었다.

당신이해야 할 모든

은 _Layout 또는 홈페이지보기에서

<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript"></script> 

을 포함한다. 그것없이 Ajax.BeginForm은 쓸모가 없으며 PartialViewResult로 계속해서 리다이렉트 할 것이다.

Answer 2

난 당신이에 UpdateTargetId를 제공해야한다고 생각 당신의 AjaxOptions :

new AjaxOptions { HttpMethod = "Post", 
        UpdateTargetId = "idOfSomeHtmlContainer" } 

페이지의 어느 부분을 AJAX 호출의 응답으로 업데이트해야하는지 지정합니다. 지금 가지고있는 코드를 사용하면 ASP.NET MVC는 액션 메서드에서 반환 된 뷰로 업데이트 할 페이지 부분을 알 수 없습니다.

Answer 3

나는 당신이 목록 작성 양식의 내용, 즉 대체 할 요소의 ID와 업데이트 모드의 내용을 대체하기 위해 필요한 Ajax 옵션을 지정하려고한다고 생각한다.