Html+JavaScript+Java

@Huge · Регистрация: 26.01.2016

Студворк — интернет-сервис помощи студентам

Решил начать разбираться как написать корзину для интернет магазина, до этого у меня происходило на этой странице по сценарию Html+java
Теперь, по моей логике, пользователь нажимает купить, попадает в корзину, в которой будет реализован сценарий и из которой будет уже отправка информации в java и вот тут столкнулся с проблемой, мне нужно передать только два параметра из всей формы - это количество покупаемой продукции(numberOrderWhisky) и название(nameWhiskey).
P.S. для примера использую виски т.к. люблю этот продукт.
Итак, так выглядит html+ java -все работает
HTML

Кликните здесь для просмотра всего текста

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
  <form action="buySuccessfulWhisky" method="post">
  
    <tr th:each="buySelectedWhisky : ${buySelectedWhisky}">
        <td align="center">
            <img th:attr="src=${buySelectedWhisky.photo}" width="150" height="250"/>Photo</td>
 
        <td align="center" th:text="${buySelectedWhisky.nameWhisky}">Name</td>
 
        <td align="center" th:text="${buySelectedWhisky.describeWhisky}">Describe</td>
 
        <td align="center" width="100">
            <input type="number" style="width: 100px" min="1" th:attr="max=${buySelectedWhisky.quantityWhisky}"
       placeholder="Enter quantity" name="numberOrderWhisky" id="numberOrderWhisky"/>
        </td>
 
        <td align="center" th:text="${buySelectedWhisky.price}" >Price</td>
 
        <td align="center">
                <input type="hidden" name="nameWhiskey" id="nameWhiskey" th:value="${buySelectedWhisky.nameWhisky}"/>
             
                <input type="submit" class="buttons" name="buttonBuyWhiskey" style="width: 60px" value="Buy"/> </td>
    </tr>
    </form>

Java:

Кликните здесь для просмотра всего текста

Java
1
2
3
4
5
6
 @RequestMapping(value = "buySuccessfulWhisky", method = {RequestMethod.GET, RequestMethod.POST})
    public ModelAndView view(@RequestParam("nameWhiskey")String name,
                             @RequestParam("numberOrderWhisky")Integer quantityOrder) {
 
        System.out.println("Name: = "+name);
        System.out.println("Quantity: = "+quantityOrder);

Теперь дал форме id и забрал action, что бы отправить все из JS:

Кликните здесь для просмотра всего текста

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
 <form id="buySelectedWhiskyThroughJavaScript" method="post">
 
    <tr th:each="buySelectedWhisky : ${buySelectedWhisky}">
        <td align="center">
            <img th:attr="src=${buySelectedWhisky.photo}" width="150" height="250"/>Photo</td>
 
        <td align="center" th:text="${buySelectedWhisky.nameWhisky}">Name</td>
 
        <td align="center" th:text="${buySelectedWhisky.describeWhisky}">Describe</td>
 
        <td align="center" width="100">
            <input type="number" style="width: 100px" min="1" th:attr="max=${buySelectedWhisky.quantityWhisky}"
       placeholder="Enter quantity" name="numberOrderWhisky" id="numberOrderWhisky"/>
        </td>
 
        <td align="center" th:text="${buySelectedWhisky.price}">Price</td>
 
        <td align="center">
                <input type="hidden" name="nameWhiskey" id="nameWhiskey" th:value="${buySelectedWhisky.nameWhisky}"/>
                <!--<input type="hidden" name="quantityWhiskeyInDB" id="quantityWhiskeyInDB" th:value="${buySelectedWhisky.quantityWhisky}"/>-->
                <input type="submit" onclick="buyFromJS()" name="buttonBuyWhiskey" style="width: 60px" value="Buy"/> </td>
    </tr>
    </form>

JS пробовал описать так:

Кликните здесь для просмотра всего текста

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
function buyFromJS() {
   
    $.ajax({  
        headers: {
            "Accept": "application/json",
            "Content-Type": "application/json"
        },
        type: "POST",
        url: '/buySuccessfulWhisky?' + $("#buySelectedWhiskyThroughJavaScript").serialize(),
        success: function (msg) {  
            window.location.href = "buySuccessfulWhisky";
        }
    })
}

Сразу же скажу у меня есть подобный код, но там я получаю все параметры, которые находятся внутри формы(форма для регистрации, NickName, Password, Email) и все работает, тут же мне нужно два параметра.
Код java прежний, выдает ошибку:
Html:

Кликните здесь для просмотра всего текста

HTML5
1
2
3
4
5
6
7
Whitelabel Error Page
 
This application has no explicit mapping for /error, so you are seeing this as a fallback.
 
Wed Jul 20 11:38:17 EEST 2016
There was an unexpected error (type=Internal Server Error, status=500).
The given id must not be null!; nested exception is java.lang.IllegalArgumentException: The given id must not be null!

Java

Кликните здесь для просмотра всего текста

Java
1
2
3
4
null
2016-07-20 11:38:17.203 ERROR 12916 --- [nio-8080-exec-1] o.a.c.c.C.[.[.[/].[dispatcherServlet]    : Servlet.service() for servlet [dispatcherServlet] in context with path [] threw exception [Request processing failed; nested exception is org.springframework.dao.InvalidDataAccessApiUsageException: The given id must not be null!; nested exception is java.lang.IllegalArgumentException: The given id must not be null!] with root cause
 
java.lang.IllegalArgumentException: The given id must not be null!

Собственно вопрос, как мне передать 2 параметра из всех в java через JS?

сделал по другому через getJSON:

Кликните здесь для просмотра всего текста

JSON
1
2
3
4
5
6
7
8
9
10
11
12
13
function buyFromJS() {
    
 
    $.getJSON("buySuccessfulWhisky",
        {
            nameSelectedWhisky: $('#nameWhiskey').val(),
            quantitySelectedWhisky: $('#numberOrderWhisky').val()
        }
 
   );
        window.location.href = "buySuccessfulWhisky";
 
}

В java все приходит и срабатывает, а вот на сайте теперь выдает ошибку:

HTML5
1
2
3
4
5
6
7
Whitelabel Error Page
 
This application has no explicit mapping for /error, so you are seeing this as a fallback.
 
Wed Jul 20 13:02:53 EEST 2016
There was an unexpected error (type=Bad Request, status=400).
Required String parameter 'nameSelectedWhisky' is not present

Хотя эта строка 'nameSelectedWhisky' приходит в java и работает, в чем тут проблема?

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

JavaScript
1
2
3
4
5
6
7
8
9
10
11
 $.getJSON("buySuccessfulWhisky",
        {
            nameSelectedWhisky:$('#nameWhiskey').val(),
            quantitySelectedWhisky:$('#numberOrderWhisky').val()
        },
    window.location.href = "warehouseWhisky"
 
   );
    
    location.reload();
}

так вообще оставляет на прежней странице минуя код window.location.href = "warehouseWhisky"

Добавлено через 4 часа 33 минуты
Буду благодарен, если покажете как через AJax можно было сделать этот код и все таки как сразу обновить страницу не нахожу.

Добавлено через 1 час 57 минут
вот такая попытка через AJAX

Кликните здесь для просмотра всего текста

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
  var nameSelectedWhisky = $('#nameWhiskey').val();
    var quantitySelectedWhisky = $('#numberOrderWhisky').val();
    $.ajax({   //тип запроса
        headers: {
            "Accept": "application/json",
            "Content-Type": "application/json"
        },
        type: "POST", //это типа method
        data: JSON.stringify(nameSelectedWhisky.id, quantitySelectedWhisky.id),
 
        url: '/buySuccessfulWhisky',
        success: function (msg) {  //msg - показывает ответ с сервера
            window.location.href = "warehouseWhisky";
        },
        error:function(){
            alert("ERROR");
        }
    })

Почему не отправляет в java? В инструментах разработчика все верно, но все равно ошибка

@Huge · 21.07.2016, 21:18 **[ТС]**

Народ здесь же знающие люди, я не спрашиваю ничего сверхсекретного, просто обьясните где ошибаюсь почему запрос через AJax вообще не работает

@KEKCoGEN · 21.07.2016, 22:04

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

ninjacut · 21.07.2016, 22:36

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

Java
1
2
3
4
5
6
7
8
@Controller
@RequestMapping("/home")
public class HomeController {
    @RequestMapping(method = RequestMethod.GET)
    public String home() {
        return "home";
    }
}

Java
1
2
3
4
5
6
7
8
9
10
11
@RestController
@RequestMapping("/home")
public class HomeRestController {
    @RequestMapping(method = RequestMethod.POST)
    public String postHome(@RequestParam String nameOfWhiskey,
            @RequestParam Integer numberOfWhiskey) {
        System.out.println(nameOfWhiskey);
        System.out.println(numberOfWhiskey);
        return "server got " + nameOfWhiskey + " * " + numberOfWhiskey;
    }
}

HTML5
1
2
3
4
5
<form id="mainForm" method="post">
        <input type="number" name="numberOfWhiskey" value="4" id="number"/>
        <input type="hidden" name="nameOfWhiskey" value="j&d" id="name"/>
        <input type="submit" value="submit" />
    </form>

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
$(function() {
    $("#mainForm").submit(function(e) {
        e.preventDefault();
        
        $.ajax({
            type: "post",
            url: "/TestProject/home",
            data: {
                numberOfWhiskey: $("#number").val(),
                nameOfWhiskey: $("#name").val(),
            },
            success: function(data) {
                console.log(data);
            }
        });
    });
});

@Huge · 22.07.2016, 17:47 **[ТС]**

Комментарий модератора

вопросы связанные с JS задавайте в соотв. разделе. Так же в одной теме должен быть только один вопрос.

del

Добавлено через 5 часов 0 минут
жаль дали бы время я бы темку перенес(

Новые блоги и статьи Все статьи Все блоги /
SDL3 для Web (WebAssembly): Обработчик клика мыши в браузере ПК и касания экрана в браузере на мобильном устройстве 8Observer8 02.02.2026 Содержание блога Для начала пошагово создадим рабочий пример для подготовки к экспериментам в браузере ПК и в браузере мобильного устройства. Потом напишем обработчик клика мыши и обработчик. . .	Философия технологии iceja 01.02.2026 На мой взгляд у человека в технических проектах остается роль генерального директора. Все остальное нейронки делают уже лучше человека. Они не могут нести предпринимательские риски, не могут. . .	SDL3 для Web (WebAssembly): Вывод текста со шрифтом TTF с помощью SDL3_ttf 8Observer8 01.02.2026 Содержание блога В этой пошаговой инструкции создадим с нуля веб-приложение, которое выводит текст в окне браузера. Запустим на Android на локальном сервере. Загрузим Release на бесплатный. . .	SDL3 для Web (WebAssembly): Сборка C/C++ проекта из консоли 8Observer8 30.01.2026 Содержание блога Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а. . .
SDL3 для Web (WebAssembly): Установка Emscripten SDK (emsdk) и CMake для сборки C и C++ приложений в Wasm 8Observer8 30.01.2026 Содержание блога Для того чтобы скачать Emscripten SDK (emsdk) необходимо сначало скачать и уставить Git: Install for Windows. Следуйте стандартной процедуре установки Git через установщик. . . .	SDL3 для Android: Подключение Box2D v3, физика и отрисовка коллайдеров 8Observer8 29.01.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами. Версия v3 была полностью переписана на Си, в. . .	Инструменты COM: Сохранение данный из VARIANT в файл и загрузка из файла в VARIANT bedvit 28.01.2026 Сохранение базовых типов COM и массивов (одномерных или двухмерных) любой вложенности (деревья) в файл, с возможностью выбора алгоритмов сжатия и шифрования. Часть библиотеки BedvitCOM Использованы. . .	SDL3 для Android: Загрузка PNG с альфа-каналом с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 28.01.2026 Содержание блога SDL3 имеет собственные средства для загрузки и отображения PNG-файлов с альфа-каналом и базовой работы с ними. В этой инструкции используется функция SDL_LoadPNG(), которая. . .

@Huge 3 / 3 / 14 Регистрация: 26.01.2016 Сообщений: 481
	21.07.2016, 21:18 [ТС]
	Народ здесь же знающие люди, я не спрашиваю ничего сверхсекретного, просто обьясните где ошибаюсь почему запрос через AJax вообще не работает 0

@KEKCoGEN 2399 / 2224 / 565 Регистрация: 28.12.2010 Сообщений: 8,672
	21.07.2016, 22:04
	Huge, вы выложили простыню текста и кучу кода. Полагаю людям лень это читать. Мне, например, лень. Попробуйте задать вопрос кратко и по делу. 0