Настраиваемая форма обратной связи

При кастомизации шаблона компонента под свою верстку ВАЖНО оставить служебные классы разметки с префиксом js - они отвечают за дефолтный js-функционал отправки формы. Основной класс формы - jsCustomForm, все остальные должны быть внутри него:

• jsCustomResult - контейнер результатов отправки формы (именно его можно удалить из шаблона, если оповещение об успешной или неуспешной отправке формы планируется выводить другим способом, к примеру, через модальное окно)
  
• jsCFTel - подключается к преустановленному полю телефона, если в настройках выбрана js-маска
  

Вызовы $arResult['FORM_ATTRIBUTES'] и $arResult['FORM_HIDDENS'] нельзя удалять из шаблона, это нарушит работу компонента.

Если у формы сложная разметка, то допускается добавить её в шаблон напрямую взамен дефолтной разметки, при этом нужно понимать, что сортировка полей в настройках перестанет работать, и необходимо соблюдать следующие правила:

• Для предустановленных полей зарезервированы имена полей: CF_NAME, CF_PHONE, CF_EMAIL, CF_COMMENT
  
• Для подключения маски телефона у поля должен быть класс jsCFTel
  
• К именам дополнительных полей в форме добавляется префикс CF_ (в настройках компонента у дополнительных полей формы префикс указывать не нужно)
  
• Имена дополнительных полей должны быть перечислены в параметре Список полей для формы (без префикса CF_), в противном случае эти поля будут проигнорированы
  
• У чекбоксов полей согласия обработки политики и обработки персональных данных зарезервированы имена CF_AGREE и CF_POLITICS соответственно, атрибут value должен быть Y
  
• У поля для файла зарезервировано имя CF_FILE
  
• Блоки оповещений валидации полей должны иметь класс CF_<имя поля>_error
  
• Для показа оповещения об успешной отправке внутри формы должен быть элемент с классом jsCustomResult
  
• Обязательно оставляем для формы служебный класс jsCustomForm
  
• Обязательно оставляем вызовы $arResult['FORM_ATTRIBUTES'] (вызывается внутри открывающего тега form) и $arResult['FORM_HIDDENS'] (вызывается после открывающего тега form)
  

Для кастомизации оповещений при отправке формы js инициирует событие cf_success, в которое передаются параметры message, success, errors и form. Пример js-кода обращения к событию:

document.addEventListener("cf_complete", function(event) {
    //console.log(event.detail)
    form = event.detail.form
    if (event.detail.success === true && form.getAttribute('id') === 'customFormId') {
        // выполняем действие в случае успешной отправки формы и если id формы customFormId
    }
})

Пример закомментированного кода для работы с событием cf_success есть в файле script.js в папке шаблона компонента.

Если на странице компонент вызывается более одного раза, то нет возможности в настройках отключить Bootstrap только для одной формы. В этом случае у нужной формы необходимо убрать bootstrap-классы в разметке шаблоне.