2014-01-08 1 views
2

У меня есть кнопка на мой взгляд, которая будет загружать форму обратной связи внутри div.Открыть частичный вид в DIV и использовать кнопку «Отправить»

<script> 
     // open feedback window 
     function openFeedback() {   
      $('#feedback-container').show(); 
      $('#feedback-container').load('@Url.Content("~/Feedback/")'); 
     } 
</script> 

<div id="feedback-container"></div> 
<button id="feedback-button" onclick="openFeedback()"> 
    Give feedback 
</button> 

Это загружает Index вид из Feedback контроллера. Внутри у меня есть форма с другой кнопкой Submit.

@using (Html.BeginForm()) { 
    @Html.AntiForgeryToken() 
    ... some controls ... 

    <input type="submit" value="Send" /> 
} 

И контроллер:

public ActionResult Index() 
    { 
     return View(new Feedback()); 
    } 

    [ValidateAntiForgeryToken] 
    [HttpPost] 
    public ActionResult Index(Feedback feedback) 
    { 
     SaveFeedback(feedback); 
     return PartialView("ContactConfirm"); 
    } 

Я хочу вернуть вид с «спасибо» сообщение внутри feedback-container, когда форма помещается обратно, но вместо того, чтобы вся страница загружается - и это только ContactConfirm вид.

Возможно ли вернуть частичный вид в div?

ответ

4

Использование Ajax.BeginForm:

@using (Ajax.BeginForm("Index", "ControlerName" 
    , new AjaxOptions 
     { 
      HttpMethod = "post", 
      InsertionMode = InsertionMode.Replace, 
      UpdateTargetId = "feedback-container" 
     })) 
{ 
    @Html.AntiForgeryToken() 
    ... some controls ... 

    <input type="submit" value="Send" /> 
} 

Он разместит форму через AJAX и вставьте HTML-код ответа в "UpdateTargetId" заостренным контейнер.

Ajax.BeginForm необходимо jquery.unobtrusive-ajax.js для работы. Убедитесь, что вы добавили ссылку js на свою страницу или ваш пакет js и убедитесь, что она находится под вашей ссылкой jquery. jquery.unobtrusive-ajax.js - это библиотека js по умолчанию для нового проекта MVC4, также вы можете получить ее через Nuget.

Имейте в виду, что сообщение ajax не может переключать портал, то есть вы не можете опубликовать https-форму ajax с http-страницы. Поэтому вам нужно убедиться, что целевую страницу принудительно на https, если вы хотите, чтобы сообщение для входа было через https.

+0

Это хороший ответ, однако вам нужно убедиться, что вы ссылаетесь на jquery.unobtrusive-ajax.js, иначе браузер будет перемещаться от текущей страницы. – heymega

+0

@heymega На память. Будет редактировать ответ. – tweray

Смежные вопросы