Скажем, у меня есть веб-сайт, который показывает пользователю десять изображений и просит их классифицировать каждое изображение, нажимая на кнопки. Кнопка для «смешного», кнопка для «страшного», кнопка для «красивого» и так далее. Эти кнопки не являются эксклюзивными. Картинка может быть смешной и страшной.
Пользователь нажимает на «забавную» кнопку. Запрос AJAX отправляется в базу данных, чтобы пометить это изображение как забавное. Загорается «забавная» кнопка, назначая класс в DOM, чтобы пометить его как «вкл».
Но пользователь допустил ошибку. Они хотели нажать на следующую кнопку. Они должны снова нажать «смешно», чтобы выключить его, верно?
На данный момент я не уверен, какой самый эффективный способ продолжить.
База данных знает, что установлен «смешной» флаг, но неэффективно запрашивать базу данных каждый раз, когда нажимается кнопка, чтобы сказать, установлен этот флаг или нет, а затем выполнить второй вызов базы данных, чтобы переключить его.
Стоит ли выводить состояние флага базы данных из DOM, т. Е. Если у этой кнопки есть класс "вкл", то флаг должен быть установлен и иметь ответвление в этой точке?
Или было бы лучше иметь структуру данных в Javascript на странице, которая дублирует состояние каждого изображения в базе данных, так что каждый раз, когда я устанавливаю флаг базы данных в true, я также устанавливаю значение в данных Javascript к истине и так далее?