CODEWITHSUNDEEP
flaskflask-admin
Artie Leech
Artie Leech

Reputation: 387

In flask admin, add confirmation prompt when Save new record

Our users have the usual CRUD actions in various flask pages.

For one scenario, the Create action can be an intensive process, with lots of domain logic performed, and on occasion, items have been created accidentally.

Our users would now like to add a simple "Are you sure you want to create this Account?" prompt when they click the "Save" button. The next response would simply be Yes and No buttons.

It's not apparent how to add this - are we missing something obvious?

Upvotes: 2

Views: 962

Answers (1)

pjcunningham
pjcunningham

Reputation: 8046

Override the Flask-Admin create template for the particular view and add a JavaScript confirmation to the form's onSubmit event. Adding the confirm to the submit event handles the three submit buttons; 'Save', 'Save and Add Another' and 'Save and Continue'.

For example:

class UserView(ModelView):
    create_template = 'create_user.html'
    # ...

In the /templates/admin folder add html file 'create_user.html':

{% extends 'admin/model/create.html' %}

{% block tail %}
    {{ super() }}
    <script src="{{ admin_static.url(filename='admin/js/helpers.js', v='1.0.0') }}" type="text/javascript"></script>
    <script>
        (function ($) {
            $('form:first').on('submit', function() {
                return faHelpers.safeConfirm('{{ _gettext('Are you sure you want to save this record?') }}');
            });
        })(jQuery);
    </script>
{% endblock %}

Note there's a bug in Flask-Admin 1.5.3, helpers.js is missing from the distribution and you will need to add the safeConfirm function.

{% extends 'admin/model/create.html' %}

{% block tail %}
    {{ super() }}
    <script>
        (function ($) {

            function safeConfirm(msg) {
                try {
                    var isconfirmed = confirm(msg);
                    if (isconfirmed == true) {
                        return true;
                    }
                    else {
                        return false;
                    }
                }
                catch (err) {
                    return false;
                }
            }

            $('form:first').on('submit', function () {    
                return safeConfirm('{{ _gettext('Are you sure you want to save this record?') }}');
            });

        })(jQuery);

    </script>
{% endblock %}

Upvotes: 2

Related Questions