Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #21 (permalink)  
Старый 05.04.2018, 13:46
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 11,650

Сообщение от Эдди
А это как делается?
В этом плане больше вопросов будет к вам, ибо "удалять с сервера файлы ajax-запросом" никак не получится, клиент только инициализирует запрос, асинхронный ли он или нет, это не важно, а удалять будет сервер. Но чтобы серверу знать что удалить, ему нужны параметры запроса. Картинок то на сервере много, и они ведь не валяются как бесхозные, а кому-то принадлежат, и эта принадлежность как связи тоже где-то на сервере может быть описана (а по уму именно так и делается). То есть, не просто удалить фото, но и связи по этому фото.

А значит успешная загрузка сервером фото, это возврат клиенту информации о том, как это фото идентифицируется на сервере, чтобы по этим параметрам можно было сделать запрос на корректное удаление фото и прочего с ним связанного.
Ответить с цитированием
  #22 (permalink)  
Старый 05.04.2018, 14:05
Профессор
Отправить личное сообщение для Эдди Посмотреть профиль Найти все сообщения от Эдди
 
Регистрация: 19.06.2010
Сообщений: 279

Сообщение от laimas Посмотреть сообщение
Но чтобы серверу знать что удалить, ему нужны параметры запроса.
Ясно, что это так. А я и передаю параметры запроса.
В качестве id или class могу использовать, в частности, название файла, который надо удалить, которое получаю в первом запросе ajax.
В качестве папки, из которой удалить, я указываю product_id.
Разве не так?

Указываю серверному сценарию, в какую папку сохранить
$.ajax({
  		url         : '/catalog/controller/extension/module/comment_img-upload.php?product_id=' + product_id,


Указываю, какую картинку удалить, предварительно вырезав имя файла из пути
img_name += '<br><img style="max-width: 500px; height: auto" src="/catalog/controller/extension/module/comment_img-uploads/product_id_' + product_id + '/' + fileName(val) + '">&nbsp;&nbsp;&nbsp;<img id="' + fileName(val) + '" src="/image/review/delete.png" width="20" height="20" alt="Удалить" />';


А вопрос был лишь в том, как отловить клик после динамической загрузки картинки.
Ответить с цитированием
  #23 (permalink)  
Старый 05.04.2018, 14:19
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 11,650

Сообщение от Эдди
В качестве id или class могу использовать, в частности, название файла, который надо удалить, которое получаю в первом запросе ajax. В качестве папки, из которой удалить, я указываю product_id.
Коли product_id, будем считать, что это добавление фото товару. В этом случае клиент может знать ID товара (product_id), но если id, которое "в качестве", это id добавленного фото, то оно будет известно только после загрузки фото и его связывании с товаром, то есть с product_id, то есть возвращать это клиенту. О чем я и говорил, и эти параметры и могут служить запросом для удаления. Имя тоже можно использовать, если знаем его и каталог, в котором фото находится. Все зависит от того как хранятся и связываются эти данные на сервере, чего я не знаю. А вот имя класса к данному процессу отношения не имеет.

Сообщение от Эдди
предварительно вырезав имя файла из пути
Если знаем путь /catalog/controller/extension/module/comment_img-uploads/product_id_' + product_id + '/, что удобно не писать помногу раз, а определить единожды, а успешная загрузка означает возврат сервером имени файла (не понятно тогда как при этом ошибки возможные обрабатываются), то можно ли обойтись без "вырезки"?

Но как бы вы не формировали запрос на удаление, картинку на клиенте можно удалять только тогда, когда сервер ответил - удалено.

Последний раз редактировалось laimas, 05.04.2018 в 14:35.
Ответить с цитированием
  #24 (permalink)  
Старый 05.04.2018, 14:45
Профессор
Отправить личное сообщение для Эдди Посмотреть профиль Найти все сообщения от Эдди
 
Регистрация: 19.06.2010
Сообщений: 279

laimas
А если забыть ВСЕ, о чем говорилось до сих пор. И взять только это:

На страницу динамически ajax-ом в цикле выводятся картинки".
У каждой есть свой конкретный id.

Как при клике по картинке вывести алерт "Hello! World." Отдельной функцией, а не вставкой динамического onclick в каждую картинку.
Поэтому я спросил, как повесить на картинку событие уже после ее динамической загрузки.

Вот вопрос.

P.S. Когда картинка изначально присутствует на странице - нет проблем. Когда динамически - проблема

Все тут.

Последний раз редактировалось Эдди, 05.04.2018 в 14:50.
Ответить с цитированием
  #25 (permalink)  
Старый 05.04.2018, 14:58
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 11,650

Сообщение от Эдди
А если забыть ВСЕ, о чем говорилось до сих пор.
Если забыть, то никак, ибо как раз все в связке, ибо запрос асинхронный и добавление картинок на страницу, это динамическое добавление их, при котором устанавливается им и обработчик.

Уж если говорить в контексте вашего добавления, то сначала это добавление, а удачный результат его, это уже редактирование. И если в первом случае (допустим каждое фото добавляется своим полем), это кнопка Добавить со своим обработчиком, а во втором случае, это уже кнопка Удалить, со своим обработчиком.

Если такая реализация, то выгодно делегировать обработку кнопок Добавить/Удалить общему родителю, который гарантировано есть на странице.

Либо - сервер ответил, что добавил. Клиент сформировал url к картинке, добавил ее на страницу и кнопку Удалить, которой устанавливается и обработчик.

И никаких проблем нет ни для первого случая, ни для второго.
Ответить с цитированием
  #26 (permalink)  
Старый 05.04.2018, 20:20
Профессор
Отправить личное сообщение для Эдди Посмотреть профиль Найти все сообщения от Эдди
 
Регистрация: 19.06.2010
Сообщений: 279

"делегировать обработку кнопок Добавить/Удалить общему родителю"...
---
В таком случае нужно просто нумеровать id картинки (0-1-2-3 и т.д.) и при прокрутке массива тоже использовать for с нумерацией.
Иначе, если делегировать родительскому элементу, то какие либо присваиваемые id тоже будут динамическими, и все останется по прежнему плохо. Так:?
Ответить с цитированием
  #27 (permalink)  
Старый 05.04.2018, 20:20
Профессор
Отправить личное сообщение для Эдди Посмотреть профиль Найти все сообщения от Эдди
 
Регистрация: 19.06.2010
Сообщений: 279

~~~ Сказал, не проверив. Пардон.
Ответить с цитированием
  #28 (permalink)  
Старый 05.04.2018, 21:43
Профессор
Отправить личное сообщение для Эдди Посмотреть профиль Найти все сообщения от Эдди
 
Регистрация: 19.06.2010
Сообщений: 279

Последний, наверное, вопрос.
Если явно задать id картинки и использовать метод on, то нормально.
$('body').on('click', '#abc', function(){
      alert('adfasdf');
  });

А если id картинки формируется динамически, то как в эту функцию вставить вместо '#abc' переменную?
Ответить с цитированием
  #29 (permalink)  
Старый 05.04.2018, 23:28
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 11,650

Сообщение от Эдди
Если явно задать id картинки и использовать метод on, то нормально.
Нет не нормально, я уж думал, что "~~~ Сказал, не проверив.", это о том, что есть понимание того, что "нужно просто нумеровать id картинки (0-1-2-3 и т.д.)", это просто зло усугубляющее ситуацию.

Каким образом банальная нумерация чего либо может иметь отношение к идентификации объекта?

Что в вашем случае является уникальным идентификатором загруженного на сервер фото? Нужно ли для каждой кнопки Удалить писать свой отдельный обработчик и отдельный запрос к индивидуальному серверному сценарию, или достаточно иметь один обработчик, один запрос отличающийся параметром, к одному сценарию?

Второе же ведь, о чем вы выше и пишите, и описываете код, тогда откуда могут рождаться мысли о вредном в данном случае - атрибуте id?

Пусть у вас идентификатор, это имя, тогда кнопки удаления и должны его содержать в атрибуте, например так data-del="name", а не вырезать его выискивая среди src. Тогда делегирование обработчика этим кнопкам, это

$(parent_selector).on('click', '[data-del]', function() {
     var btn = $(this),
         del = btn.data('del'), //то почему сервер узнает, что удалять
         etc ....
})


И делегировать нужно не тому, что удобно пишется, а ближайшему родителю, который всегда есть на странице.

Последний раз редактировалось laimas, 05.04.2018 в 23:31.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Не срабатывает событие click на динамически добавленный класс spo jQuery 10 16.11.2015 22:49
Срабатывает click со второго раза Gofol jQuery 5 14.01.2015 01:01
не срабатывает click по ссылке OlegALL Элементы интерфейса 3 22.12.2014 14:44
click срабатывает со второго раза jsuse jQuery 2 03.12.2011 02:44
Не срабатывает bind(и click) после load (или get) dijah jQuery 3 27.01.2009 20:05