Большое спасибо всем принимавшим участие в обсуждении сабжа. Задача решена. Дальше буду навешивать функционал и облагораживать код, но это уже другая история! ) Выкладываю то, что получилось, возможно кому нибудь пригодится.
Html:
{% extends 'base.html' %}
{% block content %}
<p><h3 class="helper">Добавляются здания, сооружения или территория предприятия</h3></p>
{% for cat, msg in get_flashed_messages(True) %}
<div class="flash {{cat}}">{{msg}}</div>
{% endfor %}
<form action="/add_building" method="post" class="form_add">
<p><label>Название: </label> <input type="text" name="building_name" value="" class='add_building_form' placeholder="Введите название здания" required></p>
<p><button type="button" value="Добавить" class="form_submit">Отправить</button></p>
</form>
<!--<script src="{{url_for('static', filename='js/add_building.js') }}"></script>-->
<script src="{{url_for('static', filename='js/proba.js') }}"></script>
<!--<script src="{{url_for('static', filename='js/execise.js') }}"></script>-->
<!--<script src="{{url_for('static', filename='js/ex1.js') }}"></script>-->
{% endblock %}
бэк построен на фласке, там тоже не все гладко, но там наведу порядок со временем, вот участок с обработчиком:
Код:
|
@app.route('/get_building', methods=['GET', 'POST'])
def get_building():
print(request.form)
build_name = request.form['building_name']
db = get_db()
mydbase = Building(db)
building_id = mydbase.getBuilding(build_name, ALL=False)
print('new_building', build_name)
print('building_id', building_id)
if (building_id):
print('Уже есть')
return json.dumps({'resp': "Old"})
else:
print('Новое здание')
return json.dumps({'resp': "New"}) |
Далее собственно JS:
'use strict';
const requestURL = '/get_building';
let frm = document.forms[0];
let but = frm.elements[1];
but.onclick = async function(event) {
let body = 'building_name=' + frm.building_name.value; //получаем 'building_name=123', Если ввели в форму 123
let answer = AJAX("POST", requestURL, body)
answer.then(data => {
if(data.resp=='New'){
console.log('Новое здание');
frm.submit();
}
else {
console.log('Старое здание');
}
})
.catch(err => console.log(err))
}
function AJAX(method, url, body = null) {
return new Promise((resolve, reject) => {
const xhr = new XMLHttpRequest()
xhr.open(method, url);
xhr.responseType = 'json';
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded')
xhr.onload = () => {
if (xhr.status >= 400) {
reject(xhr.response)
} else {
resolve(xhr.response)
}
}
xhr.onerror = () => {
reject(xhr.response)
}
xhr.send(body)
})
}
Знаю что кривенько написано, но в конце концов я только учусь!)