如何在我的网页上生成动态选择字段,并使用我的数据框架中的列名和唯一值



我的Web应用程序旨在允许用户上传其Excel文件,然后将其读取并转换为我的烧瓶应用程序中的数据框。随后,我的应用程序应该过滤数据框,以从数据框架中删除不必要的记录。为此,我打算设置2个动态选择字段:

1st select字段 - 包含来自dataframe的列名的列表第二选择字段 - 第一个选择字段中所选值的相应唯一值。

那么我该怎么做?

我看了一个视频,教会我如何使用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对象

基本上,您的问题是双重的:

1(您想获取数据框架的所有列名。为此,请参阅:从Pandas DataFrame列标题

获取列表

2(对于要获得唯一值的每列。为此,请参阅:在Pandas DataFrame中获取每一列的唯一值 - 为了帮助我创建较小的更易于管理的数据框,以在

上执行指标

最新更新