Считая невозможным опубликовать простой AJAX - PullRequest
Новая
       6

Считая невозможным опубликовать простой AJAX

0 голосов
/ 16 ноября 2018

Я действительно борюсь с этим и буду признателен за любые советы.

У меня есть это поле 

<input id="scanInput" type="text" placeholder="SCAN" class="form-control" />

Для которого я хотел бы сделать вызов ajax при изменении поля, поэтому я попытался 

<script>
$("#scanInput").change(function () {
    console.log('ye');

    $.getJSON("?handler=GetPartDetails", function (data) {
        //Do something with the data.
        console.log('yay?');
     }).fail(function (jqxhr, textStatus, error) {
        var err = textStatus + ", " + error;
        console.log("Request Failed: " + err);
        });
});
</script>

Где мой PageModel имеет этот метод 

[HttpPost]
public IActionResult GetPartDetails()
{
    return new JsonResult("hello");
}

и URL-адрес рассматриваемой страницы /packing/package/{id}

Теперь, когда я изменяю значение ввода, я вижу на консоли ye и вижу, что сеть называется http://localhost:7601/Packing/Package/40?handler=GetPartDetails (правильный URL-адрес, я думаю?) С кодом состояния 200

Но моя точка останова в GetPartDetails никогда не срабатывает, и я не вижу yay? в консоли.

Я также вижу это сообщение от обработчика fail:

Запрос не выполнен: parsererror, SyntaxError: JSON.parse: неожиданный символ в строке 3 столбца 1 данных JSON

Но я даже не передаю данные JSON ... зачем это нужно делать Я тоже пробовал так: 

$.ajax({
    type: "POST",
    url: "?handler=GetPartDetails",
    contentType : "application/json",
    dataType: "json"
})

но я получаю

Ошибка синтаксического анализа XML: элемент не найден Расположение: http://localhost:7601/Packing/Package/40?handler=GetPartDetails Строка № 1, столбец 1:

я тоже пробовал 

$.ajax({
    url: '/?handler=Filter',
    data: {
        data: "input"
    },
    error: function (ts) { alert(ts.responseText) }
})
    .done(function (result) {
        console.log('done')
    }).fail(function (data) {
        console.log('fail')
    });

с действием 

    public JsonResult OnGetFilter(string data)
    {
        return new JsonResult("result");
    }

но здесь я вижу текст результата в консоли, но моя точка останова никогда не срабатывает и нет сетевых ошибок .............. Что я делаю не так?

Ответы [ 3 ]

0 голосов
/ 16 ноября 2018

Каким-то образом я нашел установку, которая работает, но я понятия не имею, почему ..

PageModel 

    [HttpGet]
    public IActionResult OnGetPart(string input)
    {
        var bellNumber = input.Split('_')[1];
        var partDetail = _context.Parts.FirstOrDefault(p => p.BellNumber == bellNumber);

        return new JsonResult(partDetail);
    }

Razor Page 

$.ajax({
    type: 'GET',
    url: "/Packing/Package/" + @Model.Package.Id,
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    data: {
        input: barcode,
        handler: 'Part'
    },

    success: function (datas) {
        console.log('success');
        $('#partDescription').html(datas.description);
    }
});
0 голосов
/ 19 ноября 2018

Для этой проблемы это связано с обработчиком страницы Razor. Для маршрутизация обработчика по умолчанию .

Методы-обработчики для глаголов HTTP («неназванные» методы-обработчики) следуют за соглашение: включено [Async] (добавление Async необязательно, но рекомендуется для асинхронных методов).

Для вашего исходного поста, чтобы заставить его работать с шагами ниже:

  • Измените GetPartDetails на OnGetPartDetails, для которого используется PartDetails, а для глагола http - Get.
  • Удалить [HttpPost], который уже определяет глагол Get как OnGet.

  • Клиентский запрос 

     @section Scripts{ 
<script type="text/javascript">
    $(document).ready(function(){
        $("#scanInput").change(function () {
            console.log('ye');

            $.getJSON("?handler=PartDetails", function (data) {
                //Do something with the data.
                console.log('yay?');
            }).fail(function (jqxhr, textStatus, error) {
                var err = textStatus + ", " + error;
                console.log("Request Failed: " + err);
            });
        });
    });
</script>
}

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

0 голосов
/ 16 ноября 2018

Извините за публикацию этого ответа, я бы предпочел сделать это в разделе комментариев, но у меня пока нет привилегий.

Разве ваш PageModel не должен выглядеть так? 

[HttpPost]
public IActionResult GetPartDetails() {
  return new JsonResult {
    Text = "text", Value = "value"
  };
}
...