Как из формы сделать объект полям которого будут имена полей формы?
Добрый день, всем. Есть интересный вопрос, ИМХО, представим, что есть форма с такими полями:
<input name="form.pj" value="1235"> <input name="form.cr" value="123"> <input name="form.app.id" value="1234"> <input name="form.app.fm.id" value="12356"> Из данной формы нужно получить объект вот такого формата: form{
"pf": 1235
"cr": 123
"app": {
"id": 1234
"fm": {
"id": 12356
}
}
}
|
Цитата:
|
Вобще странная задача. Если данная html-форма не предназначена для отпрваки на сервер, то зачем она тогда вобще нужна? Только чтобы извращенческим способом считать ее js-скриптом и сконвертить в объект?
Но не проще ли прям на сервере сформировать нужную json-структуру и записать в html-страницу? JS'у останется только распарсить json. |
dekey,
:write: <!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body>
<input name="form.pj" value="1235">
<input name="form.cr" value="123">
<input name="form.app.id" value="1234">
<input name="form.app.fm.id" value="12356">
<script>
var inp = document.querySelectorAll("input"), form = {};
for (var i=0; i<inp.length; i++) {
var arr = inp[i].name.split('.'), tmp = form;
for (var k=1; k<arr.length-1; k++) { !tmp[arr[k]] && (tmp[arr[k]] = {}) ; tmp = tmp[arr[k]]}
tmp[arr[k]] = inp[i].value
}
alert(JSON.stringify(form));
</script>
</body>
</html>
|
Цитата:
|
Цитата:
|
Ну, чета я фигню написал.
Ок, мой вариант, во много схожий с уже предложенным. Просто чуть более структурированный: <!DOCTYPE HTML>
<form action="">
<input name="form.pj" value="1235">
<input name="form.cr" value="123">
<input name="form.app.id" value="1234">
<input name="form.app.fm.id" value="12356">
<script>
var formElement = document.querySelector('form');
var formData = toTree(serializeForm(formElement)).form;
alert(JSON.stringify(formData));
function serializeForm(form) {
return Array.apply(null, form).reduce(function(fields, field) {
fields[field.name] = field.value;
return fields;
}, {});
}
function toTree(object) {
var root = {};
for (var key in object) {
var subtree = root;
var path = key.split('.');
for (var i = 0; i < path.length - 1; i++) {
subtree = subtree[path[i]] || (subtree[path[i]] = {});
}
subtree[path[i]] = object[key];
}
return root;
}
</script>
</form>
Не работает в IE8! Хотя исправить очень просто. |
Цитата:
|
FormData
|
спасибо всем!
|
| Часовой пояс GMT +3, время: 18:40. |