flask_mongoengine.panels.MongoDebugPanel conflicts with flask-admin

[jennyzeng]

After using the flask_mongoengine.panels.MongoDebugPanel, in flask-admin, in either the create or edit, it is not able to add new elements to a list. In the 'Post' model of the example below, with flask_mongoengine.panels.MongoDebugPanel, the 'add inner' button and the 'Add Lols' button are not working.

example:

import datetime
from flask import Flask
import flask_admin as admin
from flask_mongoengine import MongoEngine
from flask_admin.form import rules
from flask_admin.contrib.mongoengine import ModelView
from flask_debugtoolbar import DebugToolbarExtension
# Create application
app = Flask(__name__)

# Create dummy secrey key so we can use sessions
app.config['SECRET_KEY'] = '123456790'
app.config['MONGODB_SETTINGS'] = {'DB':  'testing'}
# Create models
db = MongoEngine()
db.init_app(app)

# Use debug toolbar pannel
app.config['DEBUG'] = True
app.config['DEBUG_TB_PANELS'] = (
    'flask_debugtoolbar.panels.versions.VersionDebugPanel',
    'flask_mongoengine.panels.MongoDebugPanel'
)
toolbar = DebugToolbarExtension()
toolbar.init_app(app)

# Define mongoengine documents
class User(db.Document):
    name = db.StringField(max_length=40)
    tags = db.ListField(db.ReferenceField('Tag'))
    password = db.StringField(max_length=40)

    def __unicode__(self):
        return self.name

class Todo(db.Document):
    title = db.StringField(max_length=60)
    text = db.StringField()
    done = db.BooleanField(default=False)
    pub_date = db.DateTimeField(default=datetime.datetime.now)
    user = db.ReferenceField(User, required=False)

    # Required for administrative interface
    def __unicode__(self):
        return self.title

class Tag(db.Document):
    name = db.StringField(max_length=10)

    def __unicode__(self):
        return self.name

class Comment(db.EmbeddedDocument):
    name = db.StringField(max_length=20, required=True)
    value = db.StringField(max_length=20)
    tag = db.ReferenceField(Tag)

class Post(db.Document):
    name = db.StringField(max_length=20, required=True)
    value = db.StringField(max_length=20)
    inner = db.ListField(db.EmbeddedDocumentField(Comment))
    lols = db.ListField(db.StringField(max_length=20))

class File(db.Document):
    name = db.StringField(max_length=20)
    data = db.FileField()

class Image(db.Document):
    name = db.StringField(max_length=20)
    image = db.ImageField(thumbnail_size=(100, 100, True))

# Customized admin views
class UserView(ModelView):
    column_filters = ['name']

    column_searchable_list = ('name', 'password')

    form_ajax_refs = {
        'tags': {
            'fields': ('name',)
        }
    }

class TodoView(ModelView):
    column_filters = ['done']

    form_ajax_refs = {
        'user': {
            'fields': ['name']
        }
    }

class PostView(ModelView):
    form_subdocuments = {
        'inner': {
            'form_subdocuments': {
                None: {
                    # Add <hr> at the end of the form
                    'form_rules': ('name', 'tag', 'value', rules.HTML('<hr>')),
                    'form_widget_args': {
                        'name': {
                            'style': 'color: red'
                        }
                    }
                }
            }
        }
    }

# Flask views
@app.route('/')
def index():
    return '<a href="/admin/">Click me to get to Admin!</a>'

if __name__ == '__main__':
    # Create admin
    admin = admin.Admin(app, 'Example: MongoEngine')

    # Add views
    admin.add_view(UserView(User))
    admin.add_view(TodoView(Todo))
    admin.add_view(ModelView(Tag))
    admin.add_view(PostView(Post))
    admin.add_view(ModelView(File))
    admin.add_view(ModelView(Image))

    # Start app
    app.run(debug=True)

[ljluestc]

import datetime from flask import Flask import flask_admin as admin from flask_mongoengine import MongoEngine from flask_admin.form import rules from flask_admin.contrib.mongoengine import ModelView from flask_debugtoolbar import DebugToolbarExtension

Create application

app = Flask(name)

Create dummy secret key so we can use sessions

app.config['SECRET_KEY'] = '123456790' app.config['MONGODB_SETTINGS'] = {'DB': 'testing'}

Create models

db = MongoEngine() db.init_app(app)

Use debug toolbar panel

app.config['DEBUG'] = True app.config['DEBUG_TB_PANELS'] = ( 'flask_debugtoolbar.panels.versions.VersionDebugPanel', 'flask_debugtoolbar.panels.mongo.MongoDebugPanel' ) toolbar = DebugToolbarExtension() toolbar.init_app(app)

Define mongoengine documents

class User(db.Document): name = db.StringField(max_length=40) tags = db.ListField(db.ReferenceField('Tag')) password = db.StringField(max_length=40)

def __unicode__(self):
    return self.name

class Todo(db.Document): title = db.StringField(max_length=60) text = db.StringField() done = db.BooleanField(default=False) pub_date = db.DateTimeField(default=datetime.datetime.now) user = db.ReferenceField(User, required=False)

# Required for the administrative interface
def __unicode__(self):
    return self.title

class Tag(db.Document): name = db.StringField(max_length=10)

def __unicode__(self):
    return self.name

class Comment(db.EmbeddedDocument): name = db.StringField(max_length=20, required=True) value = db.StringField(max_length=20) tag = db.ReferenceField(Tag)

class Post(db.Document): name = db.StringField(max_length=20, required=True) value = db.StringField(max_length=20) inner = db.EmbeddedDocumentListField(Comment) lols = db.ListField(db.StringField(max_length=20))

class File(db.Document): name = db.StringField(max_length=20) data = db.FileField()

class Image(db.Document): name = db.StringField(max_length=20) image = db.ImageField(thumbnail_size=(100, 100, True))

Customized admin views

class UserView(ModelView): column_filters = ['name'] column_searchable_list = ('name', 'password')

form_ajax_refs = {
    'tags': {
        'fields': ('name',)
    }
}

class TodoView(ModelView): column_filters = ['done']

form_ajax_refs = {
    'user': {
        'fields': ['name']
    }
}

class PostView(ModelView):

Customize the form for embedded documents

form_subdocuments = {
    'inner': {
        'form_subdocuments': {
            None: {
                'form_rules': ('name', 'tag', 'value', rules.HTML('<hr>')),
                'form_widget_args': {
                    'name': {
                        'style': 'color: red'
                    }
                }
            }
        }
    }
}

Flask views

@app.route('/') def index(): return 'Click me to get to Admin!'

if name == 'main':

Create admin

admin = admin.Admin(app, 'Example: MongoEngine')

# Add views
admin.add_view(UserView(User))
admin.add_view(TodoView(Todo))
admin.add_view(ModelView(Tag))
admin.add_view(PostView(Post))
admin.add_view(ModelView(File))
admin.add_view(ModelView(Image))

# Start app
app.run(debug=True)

[samuelhwilliams]

I am closing this issue as we're removing support for flask-mongoengine in the next release, because that library is no longer being maintained and is incompatible with recent versions of our core dependencies (eg flask, wtforms, etc).