Получение данных из входных данных, динамически добавляемых в FieldList - PullRequest
Новая
       61

Получение данных из входных данных, динамически добавляемых в FieldList

0 голосов
/ 22 марта 2019

Я пытаюсь извлечь данные из списка входов, динамически добавляемых в FieldList. Я использую JavaScript для добавления элементов ввода. Но когда я пытаюсь использовать запрос, чтобы получить введенные данные, я ничего не получаю. Если я запрашиваю данные из ввода с конкретным именем добавленного ввода, я могу получить данные обратно. Но мне нужно знать, сколько элементов ввода на самом деле в списке. Я предполагаю, как мой код структурирован, что я не получаю FieldList после того, как он заполнен.

Вот мой код: 

class SubDirForm(FlaskForm):
subDirName = TextField(validators=[DataRequired()])

class SubDirsForm(FlaskForm):
    subDirList = FieldList(FormField(SubDirForm), min_entries=0)
    submit = SubmitField(label='Print')
    addField = ButtonField(label='Add Field', id='addNewField')


@bp.route('/', methods=['GET', 'POST'])
@bp.route('/index', methods=['GET', 'POST'])
def index():
    form = SubDirsForm()    
    if form.validate_on_submit():
        flash('{}'.format(request.form.getlist('subDirList')))
        flash('{}'.format(request.form.get('subdir1'))) # Hard coding an input name works      
        return redirect(url_for('main.display'))   
    return render_template('index.html', title=('Home'), form=form)


<script>
    $(document).ready(function() {
        var addCount = 1;            
        $("#addNewField").click(function() {
            var newInput = $("#subDirList");
            newInput.append(GetDynamicTextBox("", addCount));
            $("#subDirList").append(newInput);
            addCount += 1;
        });
    });

    function GetDynamicTextBox(value, addCount) {
        return '<div>' + 'Subdirectory&nbsp' + addCount + ':&nbsp' +
        '<input id = "subdir' + addCount + '"name = "subdir' + addCount + '"type="text" value = "' + value + '" />&nbsp;' +
        '<input type="button" value="Remove" class="remove" />' + '</div>' ;
    }

    $(function () {
        $("#addNewField").click(function() {
            $("#subDirList").append(GetDynamicTextBox("", addCount));                

        });

        $("body").on("click", ".remove", function () {
            $(this).closest("div").remove();
            addCount -= 1;
        });
    });
</script>
...