Привязка из элементов Html Dom к объектам json

Question

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

Например, пользователь ищет другого человека, и он может указать имя, возраст или пол человека на странице.У меня есть объект json, который имеет в качестве членов имя, возраст и пол.Я хочу связать входы, введенные в соответствующие элементы ввода на странице, с этим объектом JSON автоматически, поэтому, когда пользователь нажимает кнопку «Поиск», я просто использую все, что имеет объект json, в качестве параметра поиска.

Этопрежде всего, чтобы избежать необходимости - сначала найти соответствующий элемент, а затем назначить соответствующий вход объекта JSON для ввода в этом поле.

Я мог бы найти плагины jquery ( Databind ),которые делают наоборот, т.е. передают значения объекта JSON входным элементам.

Заранее спасибо !!

Answer 1

Я думаю, что вы путаете вашу терминологию: вероятно, вы имеете в виду объект Javascript.

В любом случае, ваш объект или строка json должны быть созданы, когда пользователь нажимает «Поиск».Будет трудно / неудобно назначить их, когда пользователь вводит текст в поля ввода.Вы можете использовать событие onblur, но вы просто делаете ненужную работу для себя.

Гораздо проще просто присвоить каждому полю ввода идентификатор, а когда пользователь нажимает «Поиск», вы строите свой объект, а затем JSONify.Вот как вы можете это сделать (не проверено!):

<input type="text" id="name" />
<input type="text" id="age" />
...

var obj = { };
obj.name = document.getElementById('name').value;
obj.age = document.getElementById('age').value;
...
var json = JSON.stringify(obj);