Ссылочный компонент связывания jsp в Spring Form

Я пытался связать POJO, используя библиотеку тегов spring form. После привязки переменных bean-компонента эталонного класса я получаю сообщение "Bad Request Error - Http Status 400".

Если я удалю привязку ссылочного класса, моя форма будет успешно отправлена, и значения также будут заполнены внутри класса.

public class EmployeeTourPojo {

  private String empDisplayName;

  private List<TourDetailsPojo> tourDetails;

  //getter and setter

}

и

public class TourDetailsPojo {

    private Date departDate;

    private String departTime;

//getters and setters

}

JSP:

<td><form:input path="empDisplayName" class="form-control"/>    </td>

<form:input placeholder="Departure Date" path="tourDetails[${index}].departDate" required="required" class="datepicker form-control"/><br/>

Я получил ссылки от нескольких articles, но они загружают список ссылочных компонентов по запросу на получение, в то время как я добавляю строки перед отправкой JSP.

введите здесь описание изображения


java spring-mvc jsp spring-form modelattribute
person Ankit    schedule 30.01.2018    source источник
comment
Как заполняется индекс?   -  person sbsatter    schedule 07.02.2018
comment
stackoverflow.com/questions/9617207/ Это может решить вашу проблему.   -  person sbsatter    schedule 07.02.2018
comment
Пожалуйста, опубликуйте свой контроллер. Я предполагаю, что проблема кроется в нем.   -  person 0__1    schedule 08.02.2018
comment
как генерируется ваш первый входной div?   -  person Shantaram Tupe    schedule 09.02.2018

Ответы (3)


arrow_upward
0
arrow_downward

Используйте библиотеку тегов JSTL для итерации данных из списка.

<c:forEach var="tourDetails" items="${tourDetails}" varStatus="status">
<form:input placeholder="Departure Date" path="tourDetails[${status.index}].departDate" required="required" class="datepicker form-control"/><br/>
</c:forEach>

Также добавьте ниже taglib при запуске вашего JSP.

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
person Lalit Khawas    schedule 08.02.2018
comment
как я уже упоминал, мой входной div генерируется динамически (с использованием добавления строки в jsp). Поэтому я не могу использовать цикл for для привязки входной переменной. - person Ankit; 09.02.2018

arrow_upward
0
arrow_downward

Если я правильно понял вашу проблему, это поможет вам

  1. Проверьте тег <tr> строки таблицы в браузере.

  2. Скопируйте элемент html, чтобы сделать его шаблоном, в проверяемом элементе щелкните правой кнопкой мыши и Копировать -> Внешний HTML.
    Предположим, сгенерированный элемент HTML выглядит так, как показано ниже.

    это приведет к конверсии

    ...<form:input placeholder="Departure Date" path="tourDetails[${index}].departDate" required="required" class="datepicker form-control"/><br/>...

    что-то вроде этого

    ...<input placeholder="Departure Date" id="tourDetails0.departDate" name="tourDetails[0].departDate" required="required" class="datepicker form-control"/><br/>...

  3. Создайте шаблон сгенерированного html

    шаблон var = '...<input placeholder="Departure Date" id="tourDetails{INDEX}.departDate" name="tourDetails[{INDEX}].departDate" required="required" class="datepicker form-control"/><br/>...';

    Смотрите, я заменил 0 на {INDEX}

  4. При нажатии кнопки Add Row получите length из <tr>, замените {INDEX} на длину с помощью функции javascript
    generated_template = template.replace(/{INDEX}/g,length);

  5. Добавьте generated_template к таблице.

Надеюсь, это поможет...

person Shantaram Tupe    schedule 08.02.2018
comment
пожалуйста, дайте мне знать, почему так, я удалю / изменю ответ - person Shantaram Tupe; 09.02.2018
comment
Спасибо за ваше предложение. Кажется, ошибка при создании динамического индекса после добавления строки. тем не менее, все еще нужно проверить больше на нем. - person Ankit; 09.02.2018

arrow_upward
0
arrow_downward

Я обнаружил, что проблема заключается в увеличении индекса после нажатия «Добавить строку». Следовательно, я добавил следующий код JQuery для увеличения индекса.

$("#addRow").click(function(){
                    //alert("The button was clicked.");
                    var addressRow = $('.repeat-address').last();
                    var addressRowLength = $('.repeat-address').length;

                    var newAddressRow = addressRow.clone(true).find("input").val("").end(); 

                    $(newAddressRow).find("td input,td select").each(function(index,item) {
                        item.name = item.name.replace(/[0-9]/g,addressRowLength);
                    });

                    newAddressRow.insertAfter(addressRow);


                });

HTML-код

<c:set var="index" value="0"/>
                    <td><form:input path="empDisplayName" class="form-control"/>    </td>
                    <tr class="repeat-address">

                        <td>Departure Date</td>
                        <td><form:input placeholder="Departure Date" path="tourDetails[${index}].departDate" required="required" class="datepicker form-control"/></td>


                        <td>Pincode</td>
                        <td><input type="text" name="tourDetails[${index}].departDate"/></td>
                        <td><input type="file" name="tourDetails[${index}].tourTicket"/></td>
                    </tr>
                    <tr><td colspan="3"><input id="addRow" type="button" value="Add Row"></td></tr>

Так как мне также нужно связать файл типа ввода с POJO. Я также добавил одно поле Multipart (в компоненте TourDetailsPojo) как

private Date departDate;

private Multipart tourTicket;

//getters and setters
person Ankit    schedule 25.02.2018