Показывать оповещение о сбоях динамически в зависимости от flask

#javascript #python #html #flask #sweetalert

#javascript #python #HTML #flask #sweetalert

Вопрос:

итак, у меня есть форма, из которой я проверяю, существуют ли данные в таблице mysql. Если это произойдет, и если пользователь установил флажок, данные той же формы используются для другой таблицы в БД. Это соответствующий код flask:

 @app.route('/result', methods=['GET', 'POST'])
def my_index():
    if request.method == 'POST':
        forms = vendorForm()
        vN = history.query.filter_by(id=forms.vendorName.data).first()
        vC = history.query.filter_by(id=forms.vendorCompany.data).first()
        sN = history.query.filter_by(id=forms.sopName.data).first()
        sV = history.query.filter_by(id=forms.sopVer.data).first()

        sopVer = sV.sopVer
        sopName = sN.sopName
        vendorCompany = vC.vendorCompany
        venActivity = request.form.get('venActivity')
        vendorName = vN.vendorName
        cursor = mysql.connection.cursor()
        print(venActivity, vendorCompany, vendorName, )
        cursor.execute("select sopVer,sopName,vendorName,vendorCompany from history where sopVer='" str(sopVer) "' and sopName='" sopName "' and vendorName='" vendorName "' and vendorCompany='" vendorCompany "'")
        r = cursor.fetchone()
        mysql.connection.commit()
        if r== None:
            print("There are no results to this query!")
        else:
            print(r)
            if venActivity == "Yes":
                print("yes")
                sql = "INSERT INTO activity (vendorCompany, vendorName, assocName, activityDate) VALUES (%s, %s, %s, %s)"
                val = (vendorCompany, vendorName, user, "2008-7-04")
                cursor.execute(sql, val)
                mysql.connection.commit()
                cursor.close()
        
        return ('', 204)
 

И мой html-файл:

 <!doctype html>  
<html>
<head>
    <title>Vendor Details</title>
    <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="/static/new.css">
  
</head>
<body>
<section class="check_vendor">
    <h1 class="title">Check Vendor Details</h1>

    <div class="container">
        <form action="/result" method="POST" class="vendorForm row">
           {{ form.csrf_token }}
           <div class="form-field col-lg-6">
           <label htmlFor="vendorCompany", class="label">Vendor Company</label>
           {{ form.vendorCompany(class="input-text") }}
            </div>

            <div class="form-field col-lg-6">
           <label htmlFor="vendorName", class="label">Vendor Name</label>
           {{ form.vendorName(placeholder='Vendor Name', class="input-text") }}
           </div>

           <div class="form-field col-lg-6">
           <label htmlFor="sopName", class="label">SOP Number</label>
           {{ form.sopName(placeholder='Enter SOP Number', class="input-text") }}
           </div>

           <div class="form-field col-lg-6">
           <label htmlFor="sopVer", class="label">SOP Version</label>
           {{ form.sopVer(placeholder='Enter SOP Version', class="input-text") }}
           </div>

           <div class="box">
           <input type="checkbox" id="venActivity" name="venActivity" value="Yes">
            <span class="check"></span>
            <label for="venActivity"> Do you want to capture the activity with this vendor?</label>
            </div>

            <div class="form-field col-lg-12">
              <button type="submit" class="submit-btn" id="submit" onclick="validation()">Check Details</button>
              </div>
            </form>
        </div>
        </section>
        <script src="https://cdn.jsdelivr.net/npm/sweetalert2@10.12.5/dist/sweetalert2.all.min.js"></script>
        <script>

        function validation()
        {
            swal.fire({
            title:"Vendor Training Valid",
            text:"The Vendor activity has been recorded!",
            icon:"success",
            closeOnConfirm: false
            });
        }

        </script>

    </body>
</html>
 

Все работает, за исключением того, что я хочу показывать сообщения от sweet alert в зависимости от различных ситуаций.

  • Поэтому, если r == None, пользователи должны получить предупреждение о том, что обучение поставщика недействительно.
  • Если r не равно None, и они не установили флажок, другое оповещение и так далее. Оповещение о сбоях работает onClick, как и ожидалось, но я хочу установить его динамически с результатами из flask. Пожалуйста, помогите

Ответ №1:

Вы отправляете форму в конечную точку Flask, которая возвращает («, 204) . Есть много способов скинуть эту кошку, но вы могли бы…

  • Сделайте HTTP-запрос POST к конечной точке, используя библиотеку, подобную Axios, а затем, в зависимости от результата Flask, верните некоторый JSON onject. Этот JSON может содержать независимо от того, выполнено ли действие успешно или нет вместе с «сообщением». В вашем коде javascript в HTML у вас будет if else в зависимости от того, что было возвращено, и соответствующее оповещение.

или

  • Вы возвращаете что-то вроде render_template (myhtmlfile.html , sweetalert=true, message=»мое сообщение») и в myhtmlfile.html есть блок, который выглядит примерно так:

и т.д. и т.п……….

 {% if sweetalert=true %}
 <body onload="doMyAlerts('{{message}}');">
{% else %}
 <body>
{% endif %}
 

и т.д. и т.п………..

… функция ниже…

Вместе с функцией JavaScript, что-то вроде:

    function doMyAlerts(message)
        {
            swal.fire({
            title: message,
            text: message,
            icon:"error",
            closeOnConfirm: false
            });
        }
 

Не тестировался, но это было бы мое мышление, я бы сам выбрал первый вариант.

Комментарии:

1. Итак, вместо возврата 204 я должен отобразить простой HTML-файл только для отображения сообщения, верно?