Як виконати JS до та після AJAX події

Опубліковано Пт, 17/07/2015 - 23:55

У цій статті ми розглянемо проблеми виклику js евентів до і після спрацьовування подій.

Зміст

Виклик js евенту після ajax

Завдання легко вирішується за допомогою Ajax API. Для цього нам знадобиться функціяajax_command_invoke(). Ця функція викликає invoke команду, тобто. jQuery-ський код на стороні клієнта для елементів, які мають відповідний селектор. Призначений для простих команд jQuery, таких як attr(), addClass(), removeClass(), toggleClass() і т.д. Отже, код нашої простої форми наступний:

Опишемо аякс колбек. Тут, наприклад, отримуємо поточний час і передаємо його для наступної вставки в html за допомогою аяксу і за допомогою js функції.

Js файл буде містити наступний код:

Результат спрацювання подій наведено нижче.

події

Виклик js евенту до ajax

Насправді завдання зводиться до заміни порядку виклику командajax_command_after() іajax_command_invoke(), тобто.

Тепер ми отримуємо ситуацію, коли js відпрацьовує першим і вставляє час у повному форматі часу (нагадаємо, ajax отримує час у форматі timestamp).

події
Також можна повісити обробник подій на аяксову кнопку. Але будьтеуважні (!),onlcik() у вас не працюватиме, т.к. ця подія вже використовується ajax фреймворком. Тому, навішуйте евенти, відмінні відonclick(), наприклад,mousedown(),mouseup() і т.д. Ще одна з проблем, яка може виникнути - це запобігти виклику ajax (наприклад, зробити кнопку неактивною доти, доки користувач не заповнить певне поле). Тобто. у цій ситуації можна зробити таке:

  • Додати атрибутdisable для кнопкиajax відразу під час завантаження сторінки.
  • Додати подію на зміну поляchange() і відстежувати зміни тексту в полі. Якщо дані введені – прибирати атрибут disable, якщо поле порожнє – додавати його (атрибут) знову