Загрузчик с питоном и колбой

Question

Я делаю предпосылку: я работаю над школьным проектом, и я могу использовать следующие технологии: python, flask, bootstrap, JavaScript и JQuery.

У меня есть кнопка (которую я назову «Обновить продукт»), для которой «onclick» должен включить одну из следующих кнопок: https://www.w3schools.com/howto/howto_css_loading_buttons.asp, кнопка «Обновить продукт» должна быть скрыта и должна вызывать функцию в python (пример: updateProducts ()). В конце этой функции (функция возвращает ok или ko), я возвращаю сообщение (используя flash), но я не знаю, как скрыть кнопку «Загрузка» и снова показать кнопку «Обновить продукт».

Вы можете мне помочь?

Answer 1

Вот шаги для достижения этого.

1. Добавить кнопку загрузки со скрытым классом.

2. При нажатии кнопки «Обновить продукт» должны произойти следующие действия.

   $(".update_button").on("click", function(e){ $(".loading_button").show(); // show loading button $(".update_button").hide(); // hide update button $.ajax({}) // send ajax request to update product, on success, hide loader and show update button });

Answer 2

Вот один из способов.
Когда вы визуализируете шаблон в python, вы можете передать переменную для управления видимостью кнопки.

render_template('page.html', visible=True)

Затем на вашей странице возможно что-то подобное (находится на Скрытие кнопки в Javascript и адаптировано)

<script>
var hidden = {{ visible|safe }};
function action() {
    if(hidden) {
        document.getElementById('button').style.visibility = 'hidden';
    } else {
        document.getElementById('button').style.visibility = 'visible';
    }
}

Вы также можете изменить переменную с помощью функции onclick на самой странице. Ваша кнопка для вызова функции Python может выглядеть примерно так:

<input type="button" id="toggler" value="Toggler" onClick="/funcionName" />

Не забудьте использовать @app.route("/functionName") перед функцией python.

Надеюсь, это близко к тому, что вы хотели.