Javascript 根据烧瓶动态显示甜警报_Javascript_Python_Html_Flask_Sweetalert

Javascript 根据烧瓶动态显示甜警报

javascript python html flask

Javascript 根据烧瓶动态显示甜警报,javascript,python,html,flask,sweetalert,Javascript,Python,Html,Flask,Sweetalert,所以我有一个表单，从中检查mysql表中是否存在数据。如果是，并且用户选中了复选框，则同一表单的数据将用于数据库中的另一个表。这是相关的烧瓶代码： @app.route('/result', methods=['GET', 'POST']) def my_index(): if request.method == 'POST': forms = vendorForm() vN = history.query.filter_by(id=forms.vend

所以我有一个表单，从中检查mysql表中是否存在数据。如果是，并且用户选中了复选框，则同一表单的数据将用于数据库中的另一个表。这是相关的烧瓶代码：

@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>


供应商详细信息
检查供应商详细信息
{{form.csrf_token}
供应商公司
{{form.vendorCompany（class=“input text”）}
厂商名称
{form.vendorName（占位符='vendorName'，class=“input text”）}
SOP编号
{form.sopName（占位符='Enter SOP Number'，class=“input text”）}
SOP版本
{form.sopVer（占位符='Enter SOP Version'，class=“input text”）}
是否要捕获此供应商的活动？
查看详细信息
函数验证（）
{
喷火({
标题：“供应商培训有效”，
文本：“已记录供应商活动！”，
图标：“成功”，
closeOnConfirm:false
});
}

除了我想根据不同的情况显示来自sweet alert的消息外，其他一切都正常

因此，如果r==None，用户应该得到一个警告，表明供应商培训无效
如果r不是None，并且他们没有选中复选框，则会发出不同的警报，以此类推。 sweet警报按预期在onClick上运行，但我想用flask的结果动态设置它。请帮忙

您正在向烧瓶端点发布表单，该端点返回（“”，204）。给这只猫剥皮有很多方法，但你可以

使用Axios之类的库向端点发出POST http请求，然后根据结果返回一些JSON onject。此JSON可以保存操作是否成功完成以及一条“消息”。在HTML中的javascript代码中，根据返回的内容和相应的警报，会有一个if-else

或

返回类似于render_template的内容（myhtmlfile.html，sweetalert=true，message=“my message”）在myhtmlfile.html中，有一个类似于以下内容的块：

等等。。。。。。。。。。

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

未测试，但这是我的想法，我自己会选择选项一。

因此，我应该呈现一个简单的html文件来显示消息，而不是返回204，对吗？

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