question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Define custom media (CSS/JS) per ModelView

See original GitHub issue

Django offers a neat way to define JS/CSS dependencies that get loaded automatically when rendering the form: https://docs.djangoproject.com/en/1.10/topics/forms/media/

If I wanted to have something similar in flask-admin, I’d have to extend 4 templates:

      # Templates
    list_template = 'admin/model/list.html'
    """Default list view template"""

    edit_template = 'admin/model/edit.html'
    """Default edit template"""

    create_template = 'admin/model/create.html'
    """Default create template"""

    details_template = 'admin/model/details.html'
    """Default details view template"""

Or is there an easier way to achieve this? If not, is there general demand for supporting this?

Issue Analytics

  • State:closed
  • Created 7 years ago
  • Comments:6 (4 by maintainers)

github_iconTop GitHub Comments

1reaction
alxvallejocommented, May 24, 2018

@vgavro I know this is old but I’m getting an error when trying to load a local script from my static dir:

In ModelView: extra_js = [url_for(‘static’, filename=‘admin/admin.js’)]

Attempted to generate a URL without the application context being pushed. This has to be executed when application context is available.

1reaction
vgavrocommented, Dec 5, 2016

It’s easy to extend: just drop this template to /templates/admin/master.html

{% extends 'admin/base.html' %}
{% block tail_js %}
  {{ super() }}
  {% if admin_view.extra_js %}
    {% for js in admin_view.extra_js %}
      <script src="{{js}}"></script>
    {% endfor %}
  {% endif %}
{% endblock %}

And add this to your ModelView:

class MyModelView(ModelView):
    extra_js = ['//cdn.ckeditor.com/4.6.0/standard/ckeditor.js']

Anyway, I agree this would be better to have in flask-admin base templates.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Working with JavaScript Media Queries | CSS-Tricks
The defined media query will return a MediaQueryList object. It is an object that stores information about the media query and the key ......
Read more >
media - CSS: Cascading Style Sheets - MDN Web Docs
The @media CSS at-rule can be used to apply part of a style sheet based on the result of one or more media...
Read more >
The "class" and "css" bindings - Knockout.js
The class and css bindings add or remove one or more named CSS classes to the associated DOM element. This is useful, for...
Read more >
What is MVC? Model View Controller - DevOpsSchool.com
The MVC is an architectural pattern that separates an application into three main logical components Model, View, And Controller.
Read more >
postcss-custom-media-with-spaces - npm
Start using postcss-custom-media-with-spaces in your project by running ... where custom media can be imported from, which might be CSS, JS, ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found