Этот баннер — требование Роскомнадзора для исполнения 152 ФЗ.
«На сайте осуществляется обработка файлов cookie, необходимых для работы сайта, а также для анализа использования сайта и улучшения предоставляемых сервисов с использованием метрической программы Яндекс.Метрика. Продолжая использовать сайт, вы даёте согласие с использованием данных технологий».
Политика конфиденциальности
|
|
|
Автоматический обработчик html форм на JS
|
|||
|---|---|---|---|
|
#18+
Програмёр, вариант действительно не плохой и достоин применения и повторения, только мне что-то в нем не нравится, какое-то чутьё подсказывает, здесь что-то не то.... но это чисто моё субъективное мнение. это как ответ на Код: plaintext ... |
|||
|
:
Нравится:
Не нравится:
|
|||
| 06.11.2016, 17:56 |
|
||
|
Автоматический обработчик html форм на JS
|
|||
|---|---|---|---|
|
#18+
вадяПрограмёр, вариант действительно не плохой и достоин применения и повторения, только мне что-то в нем не нравится, какое-то чутьё подсказывает, здесь что-то не то.... но это чисто моё субъективное мнение. это как ответ на Код: plaintext Разумеется у этого метода есть недостатки :) Вот список тех, которые я смог найти: 1. Жрёт память для функции superAjaxFunction при каждом вызове 2. Невозможно на лету добавить новый обработчик (то есть, если у меня появится новый вариант обработки ответа, то дополнить объект с хэндлерами я не смогу) 3. Я не создал объект с функционалом и нигде его не сохранил. То есть в данном случае я не смогу в последующем управлять тем, что повесил на коллекцию/селектор. Обычно плагины jquery проектируются так, что повторный вызов изменяет существующий объект, добавляет к нему опции, а не создаёт новый поверх ранее созданных 4. Даже исправление предыдущих пунктов не исправит того, что разработчику придётся задумываться над тем, к чему он сейчас применяет superAjax, к коллекции или к селектору. Вызвав код дважды: один раз для селектора и один раз для коллекции, он повесит на элементы 2 обработчика параллельно :) Вот с первыми тремя пунктами можно очень просто справиться (я необходимый хак придумал ещё тогда, когда ООП на js учил, и привёл его к виду почти полностью повторяющему классическое ООП). С четвёртым, как я и написал, дела обстоят сложнее. Одно из возможных решений, это не проверять как был сделан вызов, а заставить разработчика в явном виде указать как он хочет вызвать superAjax. Но и тут свои минусы будут, при чём побольше в размерах, чем указанные :) ... |
|||
|
:
Нравится:
Не нравится:
|
|||
| 06.11.2016, 18:33 |
|
||
|
Автоматический обработчик html форм на JS
|
|||
|---|---|---|---|
|
#18+
Програмёр, самокритика похвальна. мне больше понравилась фраза, что в виде плагина, давно хотел в этом разобраться, счас есть код на котором можно разобраться ... |
|||
|
:
Нравится:
Не нравится:
|
|||
| 06.11.2016, 18:45 |
|
||
|
Автоматический обработчик html форм на JS
|
|||
|---|---|---|---|
|
#18+
вадясчас есть код на котором можно разобраться смеяться или плакать? https://learn.jquery.com/plugins/ несколько адекватнее будет ... |
|||
|
:
Нравится:
Не нравится:
|
|||
| 06.11.2016, 18:52 |
|
||
|
Автоматический обработчик html форм на JS
|
|||
|---|---|---|---|
|
#18+
Изопропилвадясчас есть код на котором можно разобраться смеяться или плакать? https://learn.jquery.com/plugins/ несколько адекватнее будет возможно, но тут как бы на "натурном" примере. и есть альтернативные варианты. в тоже время описаны минусы. ... |
|||
|
:
Нравится:
Не нравится:
|
|||
| 06.11.2016, 19:00 |
|
||
|
Автоматический обработчик html форм на JS
|
|||
|---|---|---|---|
|
#18+
Давайте тогда спроектируем плагин, который будет отвечать всем необходимым требованиям :) Типы выборок для манипуляций 1. отдельный узел DOM 2. коллекция узлов DOM 3. селектор (подписка) Для каждой из выборок должны выполняться следующие действия: 1. В случае первого вызова superAjax для узла DOM или для селектора, должен возвращаться новосозданный объект (для последующих манипуляций над ним) 2. В случае повторного вызова superAjax для узла DOM или для селектора, должен возвращаться ранее созданный объект (для последующих манипуляций над ним) 3. В случае вызова для коллекции узлов DOM, должен вернуть коллекцию ранее созданных объектов, соответствующих каждому из указанных узлов, дополнив её новыми объектами, для тех узлов, для которых метод вызывается впервые. Правила обращений к объектам плагина 1. Все вызовы направленные объекту-коллекции должны передаваться каждому из вложенных в него объектов. 2. Все методы объекта, кроме тех, для которых указано иное, должны возвращать указатель на этот объект (this) Общие требования 1. Плагин должен быть максимально инкапсулирован, что бы исключить пересечения с другими плагинами. Сам плагин должен быть представлен единой функцией superAjax, через которую будет производится доступ ко всем функциям плагина. 2. Плагин должен быть максимально оптимизирован по потреблению памяти. 3. Весь код плагина должен полностью соответствовать специчикации ECMAScript, а манипуляции с DOM должны полностью соответствовать спецификации HTML5 Функции плагина 1. superAjax - базовый метод плагина возвращающий его объект или коллекцию объектов /* следующие функции должны быть методами объекта, возвращаемого функцией superAjax */ 2. addHandler(name, callback) - метод, добавляющий обработчик к объекту (для возможности его последующего назначения) 3. removeHandler(name) - метод, удаляющий обработчик из объекта 4. resetHandlers() - метод, удаляющий все обработчики из объекта (сбрасывают обработчики) 5. setSuccess(name) - подписывает один из ранее добавленных обработчиков на событие success (точнее меняет атрибут data-success у формы/форм) 6. setError(name) - подписывает один из ранее добавленных обработчиков на событие error (точнее меняет атрибут data-error у формы/форм) 7. remove() - удаляет объект или вложенные в него объекты (если это коллекция), предварительно отписав его/их от нужных событий. Взаимодествие с объектом формы 1. При вызове методов setSuccess или setError, в атрибуты data-success и data-error должны быть записаны соответствующие значения (названия методов) 2. При попытке отправить форму, вызов должен быть перехвачен плагином, а отправка произведена по технологии ajax. Ответ сервера должен быть обработан методом-обработчиком, указанным в атрибутах data-success или data-error отправляемой формы, в зависимости от результата запроса. Если метод с указанным именем не был ранее добавлен в объект плагина соответствующий форме, то плагин должен бросить исключение. 3. Если форме соответствуют сразу 2 или более объектов плагина, то событие submit должен перехватить последний из них, а остальные объекты не должны никак на это событие реагировать (при чём сам плагин не должен вызывать stopPropagation события или прерывать цепочку вызовов, так как другие плагины также могут быть подписаны на событие submit указанной формы) Как-то так. Такое себе мини ТЗ, надеюсь понятное не только мне, но и кому-то ещё. Сейчас уже, к сожалению, подошло время поработать (а то не хочется до 5 утра сидеть с этим), а как освобожусь, постараюсь наваять плагин, соответствующий этим требованиям. Если кому интересно, присоединяйтесь (в том числе с поправками и дополнением требований, где это необходимо). ... |
|||
|
:
Нравится:
Не нравится:
|
|||
| 06.11.2016, 20:52 |
|
||
|
Автоматический обработчик html форм на JS
|
|||
|---|---|---|---|
|
#18+
ПрограмёрДавайте тогда спроектируем плагин, который будет отвечать всем необходимым требованиям :) Типы выборок для манипуляций 1. отдельный узел DOM 2. коллекция узлов DOM 3. селектор (подписка) Для каждой из выборок должны выполняться следующие действия: 1. В случае первого вызова superAjax для узла DOM или для селектора, должен возвращаться новосозданный объект (для последующих манипуляций над ним) 2. В случае повторного вызова superAjax для узла DOM или для селектора, должен возвращаться ранее созданный объект (для последующих манипуляций над ним) 3. В случае вызова для коллекции узлов DOM, должен вернуть коллекцию ранее созданных объектов, соответствующих каждому из указанных узлов, дополнив её новыми объектами, для тех узлов, для которых метод вызывается впервые. Правила обращений к объектам плагина 1. Все вызовы направленные объекту-коллекции должны передаваться каждому из вложенных в него объектов. 2. Все методы объекта, кроме тех, для которых указано иное, должны возвращать указатель на этот объект (this) Общие требования 1. Плагин должен быть максимально инкапсулирован, что бы исключить пересечения с другими плагинами. Сам плагин должен быть представлен единой функцией superAjax, через которую будет производится доступ ко всем функциям плагина. 2. Плагин должен быть максимально оптимизирован по потреблению памяти. 3. Весь код плагина должен полностью соответствовать специчикации ECMAScript, а манипуляции с DOM должны полностью соответствовать спецификации HTML5 Функции плагина 1. superAjax - базовый метод плагина возвращающий его объект или коллекцию объектов /* следующие функции должны быть методами объекта, возвращаемого функцией superAjax */ 2. addHandler(name, callback) - метод, добавляющий обработчик к объекту (для возможности его последующего назначения) 3. removeHandler(name) - метод, удаляющий обработчик из объекта 4. resetHandlers() - метод, удаляющий все обработчики из объекта (сбрасывают обработчики) 5. setSuccess(name) - подписывает один из ранее добавленных обработчиков на событие success (точнее меняет атрибут data-success у формы/форм) 6. setError(name) - подписывает один из ранее добавленных обработчиков на событие error (точнее меняет атрибут data-error у формы/форм) 7. remove() - удаляет объект или вложенные в него объекты (если это коллекция), предварительно отписав его/их от нужных событий. Взаимодествие с объектом формы 1. При вызове методов setSuccess или setError, в атрибуты data-success и data-error должны быть записаны соответствующие значения (названия методов) 2. При попытке отправить форму, вызов должен быть перехвачен плагином, а отправка произведена по технологии ajax. Ответ сервера должен быть обработан методом-обработчиком, указанным в атрибутах data-success или data-error отправляемой формы, в зависимости от результата запроса. Если метод с указанным именем не был ранее добавлен в объект плагина соответствующий форме, то плагин должен бросить исключение. 3. Если форме соответствуют сразу 2 или более объектов плагина, то событие submit должен перехватить последний из них, а остальные объекты не должны никак на это событие реагировать (при чём сам плагин не должен вызывать stopPropagation события или прерывать цепочку вызовов, так как другие плагины также могут быть подписаны на событие submit указанной формы) Как-то так. Такое себе мини ТЗ, надеюсь понятное не только мне, но и кому-то ещё. Сейчас уже, к сожалению, подошло время поработать (а то не хочется до 5 утра сидеть с этим), а как освобожусь, постараюсь наваять плагин, соответствующий этим требованиям. Если кому интересно, присоединяйтесь (в том числе с поправками и дополнением требований, где это необходимо). Наконец-то добрался.. :)) Итак, немного сменил систему вызовов. Теперь функция superAjax не возвращает объект, а просто создаёт новый или модифицирует (вызывает методы по имени). При попытке повторного создания вызов просто игнорируется. (показалось больше в стиле jquery возвращать объект jquery, чем какой-то самодельный) И ещё не заморачивался на случай, когда на один элемент повешано несколько обработчиков через разные селекторы (то, что отработать должен последний). Но там, наверное, будет достаточно в объект event добавить какой-то флаг. Ну и всё это дело ещё не тестировал... Потом ещё функционал с отправкой файлов добавлю, документацию напишу, сам плагин расширю и сделаю настраиваемым, залью на гит и стану знаменитым В общем код: Код: javascript 1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. 19. 20. 21. 22. 23. 24. 25. 26. 27. 28. 29. 30. 31. 32. 33. 34. 35. 36. 37. 38. 39. 40. 41. 42. 43. 44. 45. 46. 47. 48. 49. 50. 51. 52. 53. 54. 55. 56. 57. 58. 59. 60. 61. 62. 63. 64. 65. 66. 67. 68. 69. 70. 71. 72. 73. 74. 75. 76. 77. 78. 79. 80. 81. 82. 83. 84. 85. 86. 87. 88. 89. 90. 91. 92. 93. 94. 95. 96. 97. 98. 99. 100. 101. 102. 103. 104. 105. 106. 107. 108. 109. 110. 111. 112. 113. 114. 115. 116. 117. 118. 119. 120. 121. 122. 123. 124. 125. 126. 127. 128. 129. 130. 131. 132. 133. 134. 135. 136. 137. 138. 139. 140. 141. 142. 143. 144. 145. Если тут ещё кто-то есть - критикуйте. С удовольствием выслушаю поправки и замечания (возможно кто слёту баг какой потенциальный найдёт) ... |
|||
|
:
Нравится:
Не нравится:
|
|||
| 09.11.2016, 04:15 |
|
||
|
Автоматический обработчик html форм на JS
|
|||
|---|---|---|---|
|
#18+
Програмёр, т.е. для отправки данных нужно обязательно form? ... |
|||
|
:
Нравится:
Не нравится:
|
|||
| 09.11.2016, 08:37 |
|
||
|
Автоматический обработчик html форм на JS
|
|||
|---|---|---|---|
|
#18+
ПрограмёрПотом ещё функционал с отправкой файлов добавлю, документацию напишу, сам плагин расширю и сделаю настраиваемым, залью на гит и стану знаменитым вы молодец! )) Вот на кого равняться надо. Удачи! ... |
|||
|
:
Нравится:
Не нравится:
|
|||
| 09.11.2016, 10:45 |
|
||
|
Автоматический обработчик html форм на JS
|
|||
|---|---|---|---|
|
#18+
Petro123ПрограмёрПотом ещё функционал с отправкой файлов добавлю, документацию напишу, сам плагин расширю и сделаю настраиваемым, залью на гит и стану знаменитым вы молодец! )) Вот на кого равняться надо. Удачи! Это сарказм? :)) ... |
|||
|
:
Нравится:
Не нравится:
|
|||
| 09.11.2016, 13:15 |
|
||
|
Автоматический обработчик html форм на JS
|
|||
|---|---|---|---|
|
#18+
Програмёр, совсем нет). Никаких подвохов). У вас есть и терпение и практический код. ... |
|||
|
:
Нравится:
Не нравится:
|
|||
| 09.11.2016, 14:15 |
|
||
|
Автоматический обработчик html форм на JS
|
|||
|---|---|---|---|
|
#18+
вадяПрограмёр, т.е. для отправки данных нужно обязательно form? не понял вопрос... поясни. ... |
|||
|
:
Нравится:
Не нравится:
|
|||
| 09.11.2016, 14:37 |
|
||
|
Автоматический обработчик html форм на JS
|
|||
|---|---|---|---|
|
#18+
ПрограмёрвадяПрограмёр, т.е. для отправки данных нужно обязательно form? не понял вопрос... поясни. у меня со страницы поисходит отправка с 20-30 мест кода я делаю просто con.send(строка данных); ну и внужном месте обработчик, он может быть как простой функцией, так и свойством объекта. как такое организуется в твоём случае. как организована обработка ajax на сервере, такого объёма типов сообщений? зы надо сказать что по количеству кода для ajax на стороне клиента требуется больше..... ... |
|||
|
:
Нравится:
Не нравится:
|
|||
| 09.11.2016, 14:46 |
|
||
|
Автоматический обработчик html форм на JS
|
|||
|---|---|---|---|
|
#18+
вадяПрограмёрпропущено... не понял вопрос... поясни. у меня со страницы поисходит отправка с 20-30 мест кода я делаю просто con.send(строка данных); ну и внужном месте обработчик, он может быть как простой функцией, так и свойством объекта. как такое организуется в твоём случае. как организована обработка ajax на сервере, такого объёма типов сообщений? зы надо сказать что по количеству кода для ajax на стороне клиента требуется больше..... 1. компонент предназначен строго для превращения обычных форм в ajax формы. То есть он предназначен именно для работы с формами (при прямой отправке функцией ajax я вообще не вижу смысла в подобном компоненте). 2. Зависит от того, как спроектирована система. Сервер может принимать запросы по разным адресам... может сам запрос разбирать и принимать решение в какой обработчик отправить... а может и ещё как-то (или смешивать обе практики). По сути, этот код отправляет ровно ту же форму, что и при обычном синхронном запросе (с перезагрузкой страницы при обычной отправке), только делает это асинхронно, ничего не перезагружая. Потому немного удивляет вопрос... возможно я тебя просто не могу правильно понять... возможно ты от моего кода хочешь чего-то большего, чего я в него не закладывал :) 3. Это не код для отправки ajax. Это код для автоматического навешивания ajax на все формы, а также на селекторы. Тут больше кода для того, что бы это стало полноценным компонентом jquery :) Как я говорил, чистая отправка ajax - вообще одна команда Код: javascript 1. 2. 3. 4. 5. 6. 7. 8. ... |
|||
|
:
Нравится:
Не нравится:
|
|||
| 09.11.2016, 15:07 |
|
||
|
Автоматический обработчик html форм на JS
|
|||
|---|---|---|---|
|
#18+
Програмёр, 1,3 - понял. 2- меня интересует вариант когда на один url отправляется несколько запросов -20-30 как организовано? запросов типа приведённому в п.3. не конкретная реализация а принцип. ... |
|||
|
:
Нравится:
Не нравится:
|
|||
| 09.11.2016, 15:40 |
|
||
|
Автоматический обработчик html форм на JS
|
|||
|---|---|---|---|
|
#18+
вадяПрограмёр, 1,3 - понял. 2- меня интересует вариант когда на один url отправляется несколько запросов -20-30 как организовано? запросов типа приведённому в п.3. не конкретная реализация а принцип. Смотря зачем они туда отправляются :) как вариант в запросе может быть указан метод обработки (в самом массиве с данными быть одним из полей)... Ну а там на что фантазии хватит. На сервере может быть обычных switch..case, if...elseif...else или вообще могут существовать разные классы обработчики. Или же запрос может вызывать какой-то метод определённой модели (зачастую небезопасно). Но я уже не помню когда мне приходилось последний раз по одному url разнотипные запросы обрабатывать. Для каждого типа запроса свой action создаётся в контроллере и в нём всё что надо делается. А клиент соответственно в зависимости от смысла запроса (его типа) шлёт его на определённый action. Учитывая что эта потребность у меня была изначально и пропала с опытом, есть предположение, что потребность в таком возникает из-за неправильной архитектуры и если не всегда, то как минимум почти всегда может быть исключена посредством правильного проектирования. ... |
|||
|
:
Нравится:
Не нравится:
|
|||
| 09.11.2016, 17:25 |
|
||
|
Автоматический обработчик html форм на JS
|
|||
|---|---|---|---|
|
#18+
ПрограмёрНо я уже не помню когда мне приходилось последний раз по одному url разнотипные запросы обрабатывать. Для каждого типа запроса свой action создаётся в контроллере и в нём всё что надо делается. А клиент соответственно в зависимости от смысла запроса (его типа) шлёт его на определённый action. +1 Это и есть стандарт REST - разный урл по задаче. В противоположность - один канал+свой протокол, и внутри разбирайся расшифровывай. ... |
|||
|
:
Нравится:
Не нравится:
|
|||
| 09.11.2016, 17:34 |
|
||
|
Автоматический обработчик html форм на JS
|
|||
|---|---|---|---|
|
#18+
авторНо я уже не помню когда мне приходилось последний раз по одному url разнотипные запросы обрабатывать. Для каждого типа запроса свой action создаётся в контроллере и в нём всё что надо делается. А клиент соответственно в зависимости от смысла запроса (его типа) шлёт его на определённый action. Учитывая что эта потребность у меня была изначально и пропала с опытом, есть предположение, что потребность в таком возникает из-за неправильной архитектуры и если не всегда, то как минимум почти всегда может быть исключена посредством правильного проектирования. вот тут и возникает вопрос подхода к проектированию. и самое интересное, что если в одном яп это нормально, то в другом это считают нонсенсом. у меня для обработки запроса на сервере требуется порядка 10 строк (бывает и больше но не часто) - логика обработки данных сосредоточена в базе. генерить на каждый запрос свой url , а практически - файл - очень накладно. я их объединяю по принадлежности к странице. авторswitch..case, if...elseif...else от использования такого я отказался , потому как чепочка из 30 case или if выглядит не очень... ... |
|||
|
:
Нравится:
Не нравится:
|
|||
| 09.11.2016, 17:53 |
|
||
|
Автоматический обработчик html форм на JS
|
|||
|---|---|---|---|
|
#18+
вадя, ещё раз, MVC решит твою проблему :) Всё из-за того, что ты его отверг раньше времени. Один запрос не обязательно равен одному файлу. у меня вот зачастую на весь модуль 2 контроллера: 1 для админа и 1 для рядового пользователя. В каждом контроллере десятки функций (экшенов), а каждая из них отвечает за конкретный запрос (урл). Обычно функции в контроллерах разделяют не по правам, как я, а по смыслу... Но мне так удобнее... Я просто вкладываю в разбиение смысл "это действия для <<писателя>> контента, а эти для <<читателя>>". Учитывая что чётких правил по этому поводу нет, никто не может сказать что я не прав. Просто не помню на практике того, кто бы сказал, что ему так работать не удобно и он бы сделал иначе (многие мои решения подвергались такой критике, но это - никогда :)) ). ... |
|||
|
:
Нравится:
Не нравится:
|
|||
| 09.11.2016, 18:05 |
|
||
|
Автоматический обработчик html форм на JS
|
|||
|---|---|---|---|
|
#18+
Програмёр, твой подход, такой же как у меня, только не применяю громких слов ... |
|||
|
:
Нравится:
Не нравится:
|
|||
| 09.11.2016, 18:23 |
|
||
|
Автоматический обработчик html форм на JS
|
|||
|---|---|---|---|
|
#18+
вадяПрограмёр, твой подход, такой же как у меня, только не применяю громких слов Каких громких слов? ... |
|||
|
:
Нравится:
Не нравится:
|
|||
| 09.11.2016, 18:43 |
|
||
|
Автоматический обработчик html форм на JS
|
|||
|---|---|---|---|
|
#18+
skyANA, MVC ... ... |
|||
|
:
Нравится:
Не нравится:
|
|||
| 09.11.2016, 18:46 |
|
||
|
Автоматический обработчик html форм на JS
|
|||
|---|---|---|---|
|
#18+
вадяПрограмёр, твой подход, такой же как у меня, только не применяю громких слов Приехали. Подход тот же, только споров о гениальности на 12 станиц. ... |
|||
|
:
Нравится:
Не нравится:
|
|||
| 09.11.2016, 18:53 |
|
||
|
Автоматический обработчик html форм на JS
|
|||
|---|---|---|---|
|
#18+
вадяПрограмёр, твой подход, такой же как у меня, только не применяю громких слов Не могу согласиться. У нас принципиально разные подходы. Иначе мы бы столько не спорили :) ... |
|||
|
:
Нравится:
Не нравится:
|
|||
| 09.11.2016, 22:11 |
|
||
|
|

start [/forum/topic.php?fid=22&msg=39344219&tid=1444910]: |
0ms |
get settings: |
8ms |
get forum list: |
13ms |
check forum access: |
3ms |
check topic access: |
3ms |
track hit: |
61ms |
get topic data: |
10ms |
get forum data: |
3ms |
get page messages: |
48ms |
get tp. blocked users: |
1ms |
| others: | 10ms |
| total: | 160ms |

| 0 / 0 |
