Универсальный способ обнаружить, если форма HTML редактируется
Это то, что я в итоге использовал UUID.
import uuid
from django.db import models
from django.contrib.auth.models import User
class SluggedModel(models.Model):
slug = models.SlugField(primary_key=True, unique=True, editable=False, blank=True)
def save(self, *args, **kwargs):
if not self.slug:
uuid.uuid4().hex[:16] # can vary up to 32 chars in length
super(SluggedModel, self).save(*args, **kwargs)
class Meta:
abstract = True
3 ответа
В чистом javascript это было бы непростой задачей, но jQuery позволяет сделать это очень легко:
$("#myform :input").change(function() {
$("#myform").data("changed",true);
});
Затем перед сохранением вы можете проверить, было ли оно изменено:
if ($("#myform").data("changed")) {
// submit the form
}
В В примере выше форма имеет идентификатор, равный «myform».
Если вам это нужно во многих формах, вы можете легко превратить его в плагин:
$.fn.extend({
trackChanges: function() {
$(":input",this).change(function() {
$(this.form).data("changed", true);
});
}
,
isChanged: function() {
return this.data("changed");
}
});
Затем вы можете просто сказать:
$("#myform").trackChanges();
и проверить, форма изменилась:
if ($("#myform").isChanged()) {
// ...
}
На случай, если о JQuery не может быть и речи. Быстрый поиск в Google обнаружил Javascript-реализации хэш-алгоритмов MD5 и SHA1. При желании вы можете объединить все входные данные формы и хешировать их, а затем сохранить это значение в памяти. Когда пользователь готов. Снова объедините все значения и хеш. Сравните 2 хэша. Если они совпадают, пользователь не менял поля формы. Если они разные, значит, что-то было отредактировано, и вам нужно вызвать код сохранения.
Вот как я это сделал (без использования jQuery).
В моем случае я хотел, чтобы один конкретный элемент формы не учитывался, потому что это был элемент, который запускал проверку, и поэтому всегда будет меняться. Исключительный элемент называется «reporting_period» и жестко запрограммирован в функции «hasFormChanged()».
Для тестирования сделайте так, чтобы элемент вызывал функцию «changeReportingPeriod()», которую вы, вероятно, захотите назвать как-то иначе.
ВАЖНО: Вы должны вызывать setInitialValues(), когда значения были установлены в исходные значения (обычно при загрузке страницы, но не в моем случае).
ПРИМЕЧАНИЕ. Я не утверждаю, что это элегантное решение, на самом деле я не верю в элегантные решения JavaScript. Лично я делаю акцент в JavaScript на удобочитаемости, а не на структурной элегантности (как если бы это было возможно в JavaScript). Я вообще не беспокоюсь о размере файла при написании JavaScript, потому что для этого предназначен gzip, а попытка написать более компактный код JavaScript неизменно приводит к невыносимым проблемам с обслуживанием. Я не приношу извинений, не выражаю раскаяния и отказываюсь обсуждать это. Это JavaScript. Извините, я должен был прояснить это, чтобы убедить себя, что я должен утруждать себя публикацией. Будь счастлив! :)
var initial_values = new Array();
// Gets all form elements from the entire document.
function getAllFormElements() {
// Return variable.
var all_form_elements = Array();
// The form.
var form_activity_report = document.getElementById('form_activity_report');
// Different types of form elements.
var inputs = form_activity_report.getElementsByTagName('input');
var textareas = form_activity_report.getElementsByTagName('textarea');
var selects = form_activity_report.getElementsByTagName('select');
// We do it this way because we want to return an Array, not a NodeList.
var i;
for (i = 0; i < inputs.length; i++) {
all_form_elements.push(inputs[i]);
}
for (i = 0; i < textareas.length; i++) {
all_form_elements.push(textareas[i]);
}
for (i = 0; i < selects.length; i++) {
all_form_elements.push(selects[i]);
}
return all_form_elements;
}
// Sets the initial values of every form element.
function setInitialFormValues() {
var inputs = getAllFormElements();
for (var i = 0; i < inputs.length; i++) {
initial_values.push(inputs[i].value);
}
}
function hasFormChanged() {
var has_changed = false;
var elements = getAllFormElements();
for (var i = 0; i < elements.length; i++) {
if (elements[i].id != 'reporting_period' && elements[i].value != initial_values[i]) {
has_changed = true;
break;
}
}
return has_changed;
}
function changeReportingPeriod() {
alert(hasFormChanged());
}