AJAX不提交表格

Question

This does prevent the form from posting. That what preventDefault does I understand. However the update() function doesn't send the form to the URL provided. I don't understand why?

UPDATE: I have the same script working on other project. I think problem is in my html. I can't figure it out though!

<form method="post" id="Name" action="updateContent.cshtml" class="abc hidden">
  <input name="currentInput" type="text" class="navbar-brand logo" value="@content.Name" />
  <input type="submit" name="currentPlaceHolder" value="Name" class="hidden" />
</form>

$(function () {
   $('.abc').submit(function (ev) {
     var frm = $(this);
     update(frm);
     ev.preventDefault();
   });
});

function update(frm) {
  $.ajax({
    type: frm.attr('method'),
    url: frm.attr('action'),
    data: frm.serialize(),
    success: function (data) {}
  });
}

Answer 1

Your form has no method. If you don't provide a type value to the $.ajax() call then the request will not be sent and the error method will immediately be invoked.

Here's an example of this behaviour: https://jsfiddle.net/csw0tu69/

To fix this, simply give the form a method:

<form method="post" id="Name" action="updateContent.cshtml" class="abc hidden">

Working example