Страница ASP.NET MVC не обновляется при использовании AJAX

Question

У меня есть проект ASP.NET MVC, где я хочу опубликовать статью в базе данных, а затем отобразить фрагмент статьи на странице. Когда пользователь комментирует, я также хочу отобразить комментарий после сохранения в базе данных. Я использую AJAX для этого и звоня по методам OnFailure и OnSuccess в обоих случаях.

Метод OnFailure запускается только при сохранении сообщения, а не комментария (это потому, что страница не обновляется, даже когда я успешно сохраняю). Метод OnSuccess не вызывается вообще, потому что моя страница не обновляется.

Я использую JQuery 2.1.4 и имею jquery.unobtrusive-Аякс скрипта загружен в моем проекте

Вот мой код.

// Просмотр для создания поста

@using (Ajax.BeginForm("Create", "Post", 
new AjaxOptions 
{ 
    HttpMethod = "POST", 
    UpdateTargetId = "insertnewpostbelow", 
    InsertionMode = InsertionMode.InsertAfter, 
    OnSuccess = "postingSucceeded()", 
    OnFailure = "postingFailed()" 
})) 
{ 
    //View code left out 
} 

// на стороне сервера для сохранения поста и обновления PartialView

[HttpPost, ValidateAntiForgeryToken, ValidateInput(false)] 
    public async Task<PartialViewResult> Create 
     ([Bind(Include = "ID,Title,Message,PostedOn,isAbuse,By")] Post post) 
    { 
     if (ModelState.IsValid) 
     { 
      var list = new List<Post>(); 
      list.Add(post); 

      try 
      { 
       db.Posts.Add(post); 
       await db.SaveChangesAsync(); 

       return PartialView("_Posts", list); 
      } 
      catch (RetryLimitExceededException) 
      { 
       ModelState.AddModelError("", "Unable to login, please try again and contact administrator if the problem persists."); 

       //If we got this far, model has errors. 
       ViewBag.By = new SelectList(db.Members, "ID", "FullNames", post.By); 
       return PartialView("_Posts", post); 
      } 
     } 

     //If we got this far, model has errors. 
     ViewBag.By = new SelectList(db.Members, "ID", "FullNames", post.By); 
     return PartialView("_Posts", post); 
    } 

// Моего JavaScript файл

function postingSucceeded() { 
    alert("Posting succeeded."); 
} 

function postingFailed() { 
    alert("Posting failured."); 
} 

// Порции Вид для просмотра

<div id="big-posts"> 
     <span id="insertnewpostbelow"></span> 

     @Html.Partial("_Posts", Model.Posts) 
    </div> 

Что я упускаю, спасибо заранее.

Answer 1

Это потому, что у вас есть форма Ajax в _PostsPartialView. После размещения, скажем, после <span id="insertnewpostbelow"></span> вам нужно запустить jquery.unobtrusive-ajax на странице еще раз.

Обратите внимание, что сценарии будут отображаться при загрузке страницы, а не после любых изменений на странице (например, обновления на PartialView).

Решение: вызова сценарий снова, после обновления страницы :)

Answer 2

Вы должны поместить содержимое возвращаемого частичного вида где-то на странице

<div id="big-posts"> 
    <span id="insertnewpostbelow"></span> 
    <div id="newPost"></div> 
</div> 

На функции обратно вызова попробуйте:

function postingSucceeded(data) { 
    $("#newPost").html(data); 
} 

Надеюсь, это поможет!

Answer 3

Первое, что вам не нужно иметь скобка

OnSuccess = "postingSucceeded()" 
          ^^^ 

OnFailure = "postingFailed()" 
         ^^^ 

всего

OnSuccess = "postingSucceeded", 
OnFailure = "postingFailed" 

и теперь HTML код

<div id="big-posts"> 
    <span id="insertnewpostbelow"></span> 
    <div id="AppendPostsHere"></div> 
</div> 

и JA vascript код из стороны$(document).ready(....)

function postingSucceeded(newPosts) { 
    $("#AppendPostsHere").html(newPosts); 
} 

надеюсь, что это Willl работать!