Создание json объекта из формы с простыми и составными полями. Парсинг на стороне сервера

Question

Всем привет! Застрял на следующем вопросе: На стороне сервера запущено springboot прилолжение с rest контроллером На стороне фронта нужно из формы получить данные нового пользователя и отправить их посредством fetch на сервер. Пользователь представлен стандартными полями firstname, lastname, age, email, password, roles. При этом роли храняться в Set и выбираются в форме через select.
Понятно, что первый шаг это из полей формы получить json объект типа:

{
    "firstname": "fname",
    "lastname": "lname",
    "age": 34,
    "password": "pass",
    "roles": ["ADMIN", "USER"] // или ["USER"] или ["ADMIN"]
    }

Собственно вопрос и заключатся в том как получить объект такого вида, в котором часть значений это одиночные поля и одно значение - массив? С использованием js и желательно без jquery. Четвертый день ищу решение, но попадаются только примеры где или все значения серриализуются в массивы или вообще без массивов, вобщем тупик.

И второе, как на стороне сервера лучше этот объект распарсить чтобы получить из него java'ский объект? Буду премного благодарен за любые советы!

Answer 1

Подправил код. Единственное что не обрабатываются радиобатоны и чекбоксы

function s(){
function serialize(form) {
    var js={};
    var field;
    if (typeof form == 'object' && form.nodeName == "FORM") {
        var len = form.elements.length;
        for (i=0; i<len; i++) {
            field = form.elements[i];
            if (field.name && !field.disabled && field.type != 'file' && field.type != 'reset' && field.type != 'submit' && field.type != 'button') {
                if (field.type == 'select-multiple') {
                    var js_sub=[];
                    for (j=form.elements[i].options.length-1; j>=0; j--) {                        
                        if(field.options[j].selected){                            
                            if(js[field.name] === undefined) js[field.name]=[];
                            js_sub.push(field.options[j].value);
                        }
                    }
                    js[field.name] = js_sub;
                } else if ((field.type != 'checkbox' && field.type != 'radio') || field.checked) {
                    js[field.name]=field.value
                }
            }
        }
    }
return js;
}
 A  = document.getElementById("form"); // find our form
 x = serialize(A); // like object
 console.log(x);
 y= JSON.stringify(x); // linke json
 console.log(y);
}

<form action="#" method="post" id="form">
   <p><select size="3" multiple name="selection">
    <option disabled>choose options</option>
    <option value="one">1</option>
    <option selected value="two">2</option>
    <option value="three">3</option>
    <option value="four">4</option>
   </select></p>
   <p><input type="text" name="txt" value="123"/></p>
  </form>
<input type="button" value="Тыц" onclick="s();">

БЛОГ НА HUSL

Создание json объекта из формы с простыми и составными полями. Парсинг на стороне сервера

Ответы (1 шт):