Вызов Ajax не распознает URL

#c# #ajax #asp.net-mvc #razor-pages

#c# #ajax #asp.net-mvc #razor-страницы

Вопрос:

Я пытаюсь выполнить вызов ajax на моей странице Razor. На данный момент мой метод контроллера должен возвращать строку «ajax return», а затем отображать ее в соответствующем теге div. Это просто тест. Я не могу заставить вызов ajax попасть в мой метод в коде. Заранее благодарим вас за любой ввод!

ajax:

 function test() {
    $.ajax({
        type: "GET",
        url: "@Url.Action("AjaxThing", "Posts")";
        data: "Andrew",
        success: function (response) {
            $("#test").html(response.data);
        }
    });
}

$("#clickMe").on("click", test);
  

cshtml:

 <div id="test">
</div>
<div class="form-group">
    <button id="clickMe" class="btn">Click me</button>
</div>
  

код позади:

 public string AjaxThing() 
{
    return "ajax return";
}
  

Макет решения:

решение

Комментарии:

1. Хммм… вы вообще не вызываете test функцию…

2. О, черт, я случайно пропустил одну строку из своего сообщения. Теперь он обновлен.

3. Что написано в вашем журнале инструментов разработчика?

4. url: "@Url.Action("AjaxThing", "Posts")"; — этот синтаксис выглядит неправильно, как вы можете видеть при выделении. Возможно, это должно быть url: @Url.Action("AjaxThing", "Posts");

5. @Xerillio Я только что попробовал это, и это не возымело никакого эффекта.

Ответ №1:

 [HttpGet]
public string AjaxThing() 
{
    return Json("ajax return",JsonRequestBehavior.AllowGet);
}
  

Пожалуйста, используйте изменить функцию, как показано выше, она будет работать

Комментарии:

1. Хм, так что на самом деле это не позволит мне это сделать. Я получаю сообщение об ошибке Json doesnt exist in the current context . Это потому, что я пытаюсь вызвать этот метод «не» из контроллера? У меня все это помещено внутри кода страницы razor.

2. Установка-пакет Newtonsoft. Json -версия 12.0.3 в вашем проекте VS. это решит проблему с Json

Ответ №2:

 function test() {

         $.ajax({
                type: "GET",
                contentType: "application/x-www-form-urlencoded; charset=utf-8",
                url: '/Posts/AjaxThing',
                data: 'Andrew',
                success: function (response) {
                    result = response;
                     $("#test").html(response);
                },
                error: function () {
                }
            });          
    }
  
 [HttpGet]
        public ActionResult AjaxThing()
        {
            return Json("ajax return", JsonRequestBehavior.AllowGet);
        }
  

Ответ №3:

Понял это. Причина, по которой он не был размещен правильно, заключалась в том, что у меня был неправильно настроен контроллер. Вместо наследования от ‘Controller’ я обновился до ‘ControllerBase’, что позволило пройти post. Я также обновил свой вызов ajax, чтобы он выглядел следующим образом:

 $(document).ready(function () {
    $('#@formId button').on("click", function (e) {

        var CommentVM = {
            PostId: parseInt($("#@postId").val()),
            Content: $("#@commentId").val()
        }

        $.ajax({
            contentType: "application/json; charset=utf-8",
            type: "POST",
            url: "/PostComment",
            data: JSON.stringify(CommentVM),
            dataType: "json",
            async: true,
            success: function (data) {
                console.log("Success");
            },
            error: function (hxr, status, error) {
                console.log("ERROR");
            }
        });
        e.preventDefault();
    });
});