Переопределить форму отправить событие с jQuery ajax сообщение

Question

Я думаю, что я переопределяю форму submit правильно. Однако вместо //HIDE FORM в событии done я получаю строку json POST (если кнопка отправки находится вне формы, она работает нормально, но мне она нужна в форме).

Форма

@using(Html.BeginForm("Action", "Controller", FormMethod.Post, new{}) 
{ 
    //Form inputs 
    <button type="submit" class="button-submit">Submit</button> 
} 

Script (в Init()):

$('.button-submit').bind('submit', function(e) { 
    e.preventDefault(); 

    if (formIsValid) { 
     $.ajax({ 
      url: 'controller/action', 
      type: 'POST', 
      data: form.serialize() 
     }).done(function(data) { 
      if (data.success) { 
       //HIDE FORM 
      } else { 
       //error 
      } 
     }); 
    } 
    return false; 
}); 

В контроллере

[HttpPost] 
public JsonResult Action(Model model) 
{ 
    if (ModelState.IsValid) 
    { 
     //Code... 
    } 
    return Json(model); 
} 

Как держать кнопку отправки в форме, используйте ajax post, и вернуться, чтобы скрыть форму и остаться на одной странице?

Answer 1

Изменение:

$('.button-submit').bind('submit', function(e) { 

To:

$('.button-submit').on('click', function(e) { 

Причина ваш привязывать не работает, что вы связываете кнопку к представить событие. Если вы хотите использовать событие submit, это необходимо связать с формой для работы.

Событие отправки отправляется элементу, когда пользователь пытается отправить форму. Он может быть прикреплен только к <form> элементов

$('form').on('submit', function(e) { 

Это также будет работать. Но учтите, что использование on вместо bind - передовая практика с jQuery 1.7.