Установить значение поля WTForms для стиля CSS - PullRequest
Новая
       7

Установить значение поля WTForms для стиля CSS

0 голосов
/ 03 января 2019

Я хочу вставить HiddenField в циклическую HTML-форму и определить значение этого скрытого поля в качестве цвета CSS соответствующего кликабельного элемента div.Это означает, что если пользователь нажимает на div до его красного цвета, а затем отправляет свою форму, я должен получить обратно стиль фона css #FF0000 в качестве значения HiddenField.

Вот кликабельный div и функция IИспользую для ввода: 

<div class="cell">
    <div style="background: #00cc00;" onclick="setColor(this)"></div>
</div>

    var backgrounds = ["#ffbf00", "#FF0000", "#00cc00"];
    function setColor(el) {
        el.colorIdx = el.colorIdx || 0;
        el.style.backgroundColor = backgrounds[el.colorIdx++ % backgrounds.length];
    }

и вот мое скрытое поле: 

{{ form.chosen_colour }}

Это достижимо?

1 Ответ

0 голосов
/ 03 января 2019

Для тех, кто заинтересован, я решил эту проблему, заменив скрытое поле скрытым вводом и связав его с JavaScript следующим образом: 

<input type="hidden" name="user_{{ user.user_id }}" id="user_{{ blogpost.blogpost_id }}">

 var backgrounds = ["#ffbf00", "#FF0000", "#00cc00"];
    function setColor(el, state_id) {
        el.colorIdx = el.colorIdx || 0;
        el.style.backgroundColor = backgrounds[el.colorIdx++ % backgrounds.length];
        var hidden_color = document.getElementById('user_' + blogpost_id);
        hidden_color.value = el.style.backgroundColor
    }

Я также использовал следующее для доступа к скрытому входному значению в бэкэнде Flask: 

value = request.form['user_14']
...