Не загружается страница

Question

Когда я нажимаю кнопку, я должен перейти на страницу событий (да, у меня есть шаблон для страницы событий в моей папке шаблонов).Почему он не загружается?

Ниже приведены фрагменты моего кода.

$('.events').on("click", function() {
    var eventName = $(this).val();
    $.ajax({
        type: 'POST',
        url : '/eventpage',
        data : {'eventName' : eventName},
        success : function(data) {

        }
    });
});


@RequestMapping(value = "/eventpage")
public String eventPage(@RequestParam("eventName") String eventName, Model model) {
    for(Event e : EventRegistrationSystemApplication.events) {
        if(e.getName().equals(eventName)) {
            model.addAttribute("event", e);
            break;
        }
    }

    return "eventpage";
}

Что происходит, загружается страница, на которую я должен идти: изображение

Answer 1

Я полагаю, что вы могли перепутать асинхронный и синхронный запрос, вы можете посмотреть этот пост , чтобы узнать больше.Вы также должны использовать GET-запрос для загрузки страницы (не POST).Запрос Post обычно предназначен для отправки данных формы в бэкэнд, в то время как запрос GET выбирает данные (например, из API) или загружает страницы (если это не веб-приложение).

Вы можете изменить страницу как AlexДэвис предложил с Javascript (не с Ajax).Вы также можете изменить @RequestMapping на @ GetMapping ("/ eventpage"), чтобы использовать более прямой подход с Spring.

Answer 2

На основе снимка экрана (ibb.co/ZSXDBpG) заголовок и токен отсутствуют в почтовом вызове.

$('.events').on("click", function() {
    var token = $("meta[name='_csrf']").attr("content");
    var header = $("meta[name='_csrf_header']").attr("content");
    var eventName = $(this).val();
    $.ajax({
        type: 'POST',
        url : '/eventpage',
        data : {'eventName' : eventName},
        beforeSend: function(xhr) {
            xhr.setRequestHeader(header, token);
        },
        success : function(data) {
            console.log(data);
        }
    });
});

После внесения изменений проверьте свою консоль.Также проверьте «предварительный просмотр» и «ответ».Надеюсь, это поможет !!

Answer 3

Ajax-запрос, который вы используете, фактически отправляет запрос на этот URL-адрес и не загружает веб-страницу.Если вы хотите загрузить веб-страницу, используйте window.location.href="/eventpage?eventName=" + eventName в вашем JavaScript.