2015-02-02 3 views
1

Я создаю веб-форму. В зависимости от значения первого поля я хочу показать разные поля в остальной части формы. Я могу использовать javascript для обновления формы:Передача данных между python и javascript с помощью JSON

document.getElementById("formdata").innerHTML = HTML_string 

Я пользуюсь web.py. Список полей, которые мне нужны, хранится в MongoDB, и я использую python для вывода списка. Похоже, я должен использовать JSON для передачи данных с python в браузер. Есть много простых примеров, обслуживающих только JSON (например, https://gist.github.com/sirleech/5055971), и следующее почти точно описывает, что мне нужно: Passing variables between Python and Javascript. Как я могу использовать эти данные с JavaScript, сохраняя при этом полную HTML-страницу? У кого-нибудь есть примеры, которые я могу использовать для создания веб-страницы? И можно ли вызвать скрипт python при изменении значения поля и передать запрос повторно в браузер без обновления страницы?

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

Благодаря,

Ger

+0

Похоже, может быть, ваш вопрос заключается в том, как распаковать/использовать данные JSON на стороне браузера? Как правило, это делается с помощью какого-либо запроса/обратного вызова AJAX в JavaScript. Если вы делаете это в первый раз, я бы предложил посмотреть в AngularJS или jQuery в качестве инструментов для абстрагирования многих головных болей, специфичных для браузера. – dylrei

+0

Да, я думаю, это мой вопрос! Спасибо за подсказку, я попробую найти учебник по этим теперь, я знаю, что я ищу. –

ответ

1

Как правило, в формате JSON используется для подачи данных, не разметка. Обычно вы уже загрузили HTML и вставляете данные JSON в элементы DOM сразу после его приобретения.

Допустим, вы хотите обновить элемент «оценка», который размечен так:

<p>My Score: <span id='my_score'></span></p> 

Чтобы сделать это, скажем, ваш JSON кормить «счет» размещается в/данных/счет. Он возвращает JSON как это:

{score: 5} 

Если вы используете JQuery, например, вы можете запросить и обновить это значение следующим образом:

$.get('/data/score', function(data){ 
    $('#my_score').html(data['score']); 
}); 

Но что делает много предположений о чем ты» повторного использования и того, как он работает.

+0

Ок, похоже, это не будет быстрым решением. Я лучше всего научусь jQuery! –

+0

@Geraint Да, образец использования асинхронного запроса тоже немного учится. Вы должны научиться думать в событиях и обратных вызовах, а не предполагать, что все происходит в определенном порядке. Этот материал быстро усложняется, и если вы действительно начинаете здесь, возможно, стоит потратить усилия на изучение структуры, такой как Angular. http://angular.codeschool.com/ – dylrei

Смежные вопросы