Мое веб-приложение предназначено для того, чтобы пользователи могли загружать свои файлы Excel, которые затем будут считываться и преобразовываться в DataFrame внутри моего приложения-колбы.Впоследствии мое приложение должно фильтровать DataFrame для удаления ненужных записей из DataFrame.Для этого я планирую настроить 2 поля динамического выбора:
1-е поле выбора - содержит список имен столбцов из фрейма данных 2-е поле выбора - соответствующие уникальные значения выбранного значения в 1-м выбореfield.
Так как же мне поступить так?
Я смотрел видео, которое научило меня, как использовать FlaskForm для создания этих динамических полей.Но я не могу настроить его, чтобы он подходил под мой https://www.youtube.com/watch?v=I2dJuNwlIH0
код стороны колбы (app.py):
class Form(Form):
column = SelectField('column', choices=list(upload_df.columns.values))
unique_value = SelectField('unique_value', choices=[])
@app.route('/upload_file')
def upload_file():
return render_template('upload.html')
@app.route('/testing_field', methods=['GET', 'POST'])
def testing():
if request.method == 'POST':
file = request.files['datafile']
if file and allowed_file(file.filename):
global upload_df
upload_df = pd.read_excel(file)
col = list(upload_df.columns.values)
form = Form()
global col_uni_val_dict
for i in col:
col_uni_val_dict[i] = upload_df[i].unique()
form.unique_value.choices = (col_uni_val_dict[col[0]]).tolist()
return render_template(
'index2.html',
form=form
)
@app.route('/col/<col>')
def unique_val(col):
unique_values = col_uni_val_dict[col].tolist()
return jsonify({'unique_val' : unique_values})
код стороны HTML:
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<form method="POST">
{{ form.crsf_token }}
{{ form.column }}
{{ form.unique_value }}
<input type="submit">
</form>
<script>
let col_select = document.getElementById('column');
let uv_select = document.getElementById('unique_value');
col_select.onchange = function(){
col = col_select.value;
fetch('/col/' + col).then(function(response){
response.json().then(function(data){
let optionHTML = "";
for (let uv of data.unique_val) {
optionHTML += '<option value="' + uv + '">' + uv + '</option>';
}
uv_select.innerHTML = optionHTML;
});
});
}
</script>
</body>
</html>
Ожидается: наличие 2-х полей динамического выбора на веб-странице. Факт: Продолжайте получать разные ошибки, например -> TypeError: невозможно распаковать не повторяемый объект int