Parsing from WTForms into an Array in MongoDB

Question

I'm attempting to parse from WTForms a list of Ingredients and a Method to create a cookbook page in jinja, the app so far reads from the database and can display the data best in an ordered list from the array. My problem is werkzeug is throwing an error when attempting to submit the data, and therefore not pushing any data from the forms into the database.

I've attempted to use custom forms within the form group for the page itself, this has enabled me to at least display the forms with more forms for the ingredients. I had also tried using the prebuilt WTForms imports for this too.

I've taken a look on the documentation for wtforms and the mongodb documentation too and this hasnt helped clarify my issue.

For code this is my approuting

def addrecipe():
    if 'username' not in session:
        flash('Not possible for none members! Please create an account.')
        return redirect(url_for('register'))


    form = RecipeForm()
    user = mongo.db.users.find_one({"name": session['username'].title()})

    if request.method == 'POST' and form.validate_on_submit():
        recipe = mongo.db.Recipes
        recipe.insert_one({'recipe_name': request.form['recipe_name'], 
                    'recipe_type': request.form['recipe_type'], 
                    'recipe_desc': request.form['recipe_desc'],
                    'serving': request.form['serving'],
                    'prep_time': request.form['prep_time'],
                    'cook_time': request.form['cook_time'],
                    'ingredients': request.form['ingredients'],
                    'method': request.form['method'],
                    'img_url': request.form['image']})
        flash('Recipe success!')
        return redirect(url_for('index'))
    return render_template('addrecipe.html', form=form)

My database looks similar however the Ingredients and the method parts are arrays.

The forms page here

class IngredientForm(FlaskForm):
    description = StringField()

class MethodsForm(FlaskForm):
    method = StringField()

class RecipeForm(FlaskForm):
    recipe_name = StringField('Recipe Name:')
    recipe_type = StringField('Recipe Type:')
    recipe_desc = StringField('Description:')
    serving = StringField('Serving Size:')
    prep_time = StringField('Preparation Time:')
    cook_time = StringField('Cooking Time:')
    ingredients = FieldList(StringField(IngredientForm), 'Ingredients:', min_entries=4, max_entries=25)
    method = FieldList(StringField(MethodsForm), 'Method:', min_entries=4, max_entries=10)
    img_url = StringField('Got a photo link?:')
    submit = SubmitField('Add Recipe')

I'm expecting my submit button to push straight out to the database with a new recipe that then enables my templating to build this to my landing page immediately, however the werkzeug error is showing 400: bad request KEYError 'Ingredients'.

I Appreciate any help with this, this is all a little new to me on the backend side!

Answer 1

So, after doing some digging and playing around with the code as per usual it was something I hadn't actually thought of yesterday due to being so engrossed in other ways to do it. It was a basic bit of vanilla python to split these items into an array.

In my app.py file I have amended it to use a .split(",") separator to parse these into the arrays in the database.

recipe.insert_one({'recipe_name': request.form['recipe_name'],
                            'recipe_type': request.form['recipe_type'],
                            'recipe_desc': request.form['recipe_desc'],
                            'serving': request.form['serving'],
                            'prep_time': request.form['prep_time'],
                            'cook_time': request.form['cook_time'],
 Here -->                  'ingredients': request.form['ingredients'].split(","),
   Here -->                'method': request.form['method'].split(","),
                            'img_url': request.form['img_url']})

This results in it parsing directly to the database without a problem. However limiting the number of fields present (This should be sorted easily enough with some scss for those particular forms.)

Updated forms.py

class RecipeForm(FlaskForm):
    recipe_name = StringField('Recipe Name:')
    recipe_type = StringField('Recipe Type:')
    recipe_desc = StringField('Description:')
    serving = IntegerField('Serving Size:')
    prep_time = IntegerField('Preparation Time:')
    cook_time = IntegerField('Cooking Time:')
    ingredients = StringField('Ingredients:')
    method = StringField('Method:')
    img_url = StringField('Got a photo link?:')
    submit = SubmitField('Add Recipe')