kopia lustrzana https://github.com/wagtail/wagtail
Make user confirm before navigating away from changed page editor
rodzic
224f3f5c37
commit
11b9ed6732
|
@ -4,6 +4,7 @@ Changelog
|
|||
1.4 (xx.xx.xxxx)
|
||||
~~~~~~~~~~~~~~~~
|
||||
|
||||
* The page editor now produces a warning if the user navigates away without saving changes
|
||||
* The `Document` model can now be overridden using the new `WAGTAILDOCS_DOCUMENT_MODEL` setting (Alex Gleason)
|
||||
* Wagtail no longer depends on django-compressor
|
||||
* Snippets now support a custom `edit_handler` property (Mikalai Radchuk)
|
||||
|
|
|
@ -10,6 +10,11 @@ Wagtail 1.4 release notes - IN DEVELOPMENT
|
|||
What's new
|
||||
==========
|
||||
|
||||
Protection against unsaved changes
|
||||
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
|
||||
|
||||
The page editor interface now produces a warning if the user attempts to navigate away while there are unsaved changes.
|
||||
|
||||
|
||||
Custom document models
|
||||
~~~~~~~~~~~~~~~~~~~~~~
|
||||
|
|
|
@ -36,6 +36,49 @@ function initTagField(id, autocompleteUrl) {
|
|||
});
|
||||
}
|
||||
|
||||
/*
|
||||
* Enables a "dirty form check", prompting the user if they are navigating away
|
||||
* from a page with unsaved changes.
|
||||
*
|
||||
* It takes the following parameters:
|
||||
*
|
||||
* - formSelector - A CSS selector to select the form to apply this check to.
|
||||
*
|
||||
* - options - An object for passing in options. Possible options are:
|
||||
* - ignoredButtonsSelector - A CSS selector to find buttons to ignore within
|
||||
* the form. If the navigation was triggered by one of these buttons, The
|
||||
* check will be ignored. defaults to: input[type="submit"].
|
||||
* - confirmationMessage - The message to display in the prompt.
|
||||
* - alwaysDirty - When set to true the form will always be considered dirty,
|
||||
* prompting the user even when nothing has been changed.
|
||||
*/
|
||||
function enableDirtyFormCheck(formSelector, options) {
|
||||
var $form = $(formSelector);
|
||||
var $ignoredButtons = $form.find(
|
||||
options.ignoredButtonsSelector || 'input[type="submit"],button[type="submit"]'
|
||||
);
|
||||
var confirmationMessage = options.confirmationMessage || ' ';
|
||||
var alwaysDirty = options.alwaysDirty || false;
|
||||
var initialData = $form.serialize();
|
||||
|
||||
window.addEventListener('beforeunload', function(event) {
|
||||
// Ignore if the user clicked on an ignored element
|
||||
var triggeredByIgnoredButton = false;
|
||||
var $trigger = $(event.target.activeElement);
|
||||
|
||||
$ignoredButtons.each(function() {
|
||||
if ($(this).is($trigger)) {
|
||||
triggeredByIgnoredButton = true;
|
||||
}
|
||||
});
|
||||
|
||||
if (!triggeredByIgnoredButton && (alwaysDirty || $form.serialize() != initialData)) {
|
||||
event.returnValue = confirmationMessage;
|
||||
return confirmationMessage;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
$(function() {
|
||||
// Add class to the body from which transitions may be hung so they don't appear to transition as the page loads
|
||||
$('body').addClass('ready');
|
||||
|
@ -207,4 +250,3 @@ $(function() {
|
|||
}, 10);
|
||||
});
|
||||
});
|
||||
|
||||
|
|
|
@ -74,6 +74,19 @@
|
|||
<script>
|
||||
$(function(){
|
||||
$('#page-edit-form .tab-content section.active input').first().focus();
|
||||
|
||||
/* Make user confirm before leaving the editor if there are unsaved changes */
|
||||
{% trans "This page has unsaved changes." as confirmation_message %}
|
||||
enableDirtyFormCheck(
|
||||
'#page-edit-form',
|
||||
{
|
||||
confirmationMessage: '{{ confirmation_message|escapejs }}',
|
||||
|
||||
{% if form.errors %}
|
||||
alwaysDirty: true,
|
||||
{% endif %}
|
||||
}
|
||||
);
|
||||
});
|
||||
</script>
|
||||
{% endblock %}
|
||||
|
|
|
@ -99,4 +99,21 @@
|
|||
{% block extra_js %}
|
||||
{{ block.super }}
|
||||
{% include "wagtailadmin/pages/_editor_js.html" %}
|
||||
|
||||
<script>
|
||||
$(function() {
|
||||
/* Make user confirm before leaving the editor if there are unsaved changes */
|
||||
{% trans "This page has unsaved changes." as confirmation_message %}
|
||||
enableDirtyFormCheck(
|
||||
'#page-edit-form',
|
||||
{
|
||||
confirmationMessage: '{{ confirmation_message|escapejs }}',
|
||||
|
||||
{% if form.errors %}
|
||||
alwaysDirty: true,
|
||||
{% endif %}
|
||||
}
|
||||
);
|
||||
});
|
||||
</script>
|
||||
{% endblock %}
|
||||
|
|
|
@ -217,7 +217,7 @@ def create(request, content_type_app_name, content_type_model_name, parent_page_
|
|||
'parent_page': parent_page,
|
||||
'edit_handler': edit_handler,
|
||||
'preview_modes': page.preview_modes,
|
||||
'form': form, # Used in unit tests
|
||||
'form': form,
|
||||
})
|
||||
|
||||
|
||||
|
@ -319,7 +319,7 @@ def edit(request, page_id):
|
|||
'edit_handler': edit_handler,
|
||||
'errors_debug': errors_debug,
|
||||
'preview_modes': page.preview_modes,
|
||||
'form': form, # Used in unit tests
|
||||
'form': form,
|
||||
})
|
||||
|
||||
|
||||
|
@ -379,6 +379,7 @@ def preview_on_edit(request, page_id):
|
|||
'page': page,
|
||||
'edit_handler': edit_handler,
|
||||
'preview_modes': page.preview_modes,
|
||||
'form': form,
|
||||
})
|
||||
response['X-Wagtail-Preview'] = 'error'
|
||||
return response
|
||||
|
@ -424,6 +425,7 @@ def preview_on_create(request, content_type_app_name, content_type_model_name, p
|
|||
'parent_page': parent_page,
|
||||
'edit_handler': edit_handler,
|
||||
'preview_modes': page.preview_modes,
|
||||
'form': form,
|
||||
})
|
||||
response['X-Wagtail-Preview'] = 'error'
|
||||
return response
|
||||
|
|
Ładowanie…
Reference in New Issue