Блог

я пытался заставить это работать в течение целых 3 часов. я делаю сообщение jquery, но где-то в строке я делаю что-то неправильно, но я не понимаю, что.

в моем методе я проверяю, является ли это ajaxrequest, и если это так, я возвращаю строковое сообщение на основе результата.

 [HttpPost]
    public ActionResult PostJquery(ContactViewModel viewModel)
    {
        if (Request.IsAjaxRequest())
        {
            if (!string.IsNullOrEmpty(viewModel.Email))
            {
                return Content("success");
            }
            else
            {
                return Content("Fail");
            }   
        }
        else
        {
            return RedirectToAction("About");
        }
    }
  

мой jquery и html выглядят следующим образом.

 <% using (Html.BeginForm())
   {%>
<%: Html.TextBoxFor(model => model.Email) %>
<br />
<br />
<%: Html.TextBoxFor(model => model.Title) %><br />
<input type="submit" value="Save" id="button" />
<%} %>


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

<script type="text/javascript">
    $(document).ready(function () {            
        $('#button').click(function (e) {
                            $.post('/Home/PostJquery', { viewModel: $('form').serialize() }, function (data) { alert(data); });                
        });
    });

</script>
  

что он делает, так это переходит в метод и перенаправляет на сайт about, потому что это не ajaxrequest, если я удалю его, он вернет успех, но это приведет меня к пустой странице с текстом success writen. это не вызывает успеха в оповещении. что я, возможно, делаю не так? должен ли я использовать .post или .ajax?

спасибо за информацию, ребята

Вам нужно отменить действие кнопки по умолчанию, которое заключается в отправке формы, возвращая false:

 $(function () {            
    $('#button').click(function() {
        $.post('/Home/PostJquery', $('form').serialize(), function (data) { 
            alert(data); 
        });
        return false;
    });
});
  

Также обратите внимание на способ передачи параметров. .serialize() Метод уже подготавливает запрос, так что это то, что вы должны отправить в качестве второго аргумента.

но лучший способ AJAXify формы — подписаться на .submit() событие этой формы:

 $(function () {            
    $('form').submit(function() {
        $.post(this.action, $(this).serialize(), function (data) { 
            alert(data); 
        });
        return false;
    });
});
  

И еще лучший способ — использовать плагин jquery form, который превращает ваш код в:

 $(function () {            
    $('form').ajaxForm(function(data) {
        alert(data);
    });
});
  

Примечание: убедитесь, что вы установили правильный тип контента на своем сервере при возврате из запроса AJAX.