tyukavin_denis
@tyukavin_denis
junior developer

Как реализовать отправку формы?

Доброго времени суток!
Подскажите, пожалуйста, как в modx можно реализовать отправку формы?

Суть: есть личный кабинет клиента с выполненными заказами. Необходимо, чтобы при нажатии на кнопку "Запросить документы" напротив любого из заказов менеджеру на почту приходило письмо с номером заказа и отправителем.
  • Вопрос задан
  • 58 просмотров
Решения вопроса 1
cloudyone
@cloudyone
Люблю создавать сайты.
Пример обычной формы с Ajax.
1) Установить FormIt. (Документация)
2) Установить AjaxForm. (Документация)
3) Создать категорию Forms. (тут будут чанки websiteForm и websiteFormEmail)
4) Чанк websiteForm (Форма заказать создание веб-сайта.)
Сделать аналогично.
<!-- FORM -->
<form action="[[~[[*id]]]]" class="ajax_form af_example" enctype="multipart/form-data" method="post">
    <div class="row">
        
    <!-- name -->
    <div class="col-sm-6">
       <div class="form-group has-feedback">
        <label class="control-label" for="af_name">Введите ФИО: <span class="required">*</span></label> 
            <div class="input-group"><span class="input-group-addon"><i class="fa fa-user fa-fw"></i></span>
            <input type="text" name="name" id="af_name" class="form-control input-sm" minlength="4" maxlength="30" 
                value="[[+fi.name]]" placeholder="В формате, Неверов Владислав Сергеевич">
            </div>
       </div>
    </div>
        
     <!-- email -->            
     <div class="col-sm-6">
         <div class="form-group has-feedback">
             <label class="control-label" for="af_email">Введите email: <span class="required">*</span></label> 
             <div class="input-group"><span class="input-group-addon"><i class="fa fa-envelope fa-fw"></i></span>
             <input type="email" name="email" id="af_email" class="form-control input-sm" maxlength="30" 
                value="[[+fi.email]]" placeholder="В формате, neverov@gmail.com">
             </div>
         </div>
     </div>
        
    <!-- type -->            
    <div class="col-sm-6">
        <div class="form-group has-feedback">
            <label class="control-label" for="af_site-type">Тип сайта: <span class="required">*</span></label>
            <select class="form-control" id="af_site-type" name="site-type">
            <option value="Не выбрано" [[!+fi.site-type:is=`Не выбрано`:then=`selected`]]>Выбрать</option>
            <option value="Сайт-визитка" [[!+fi.site-type:FormItIsSelected=`Сайт-визитка`]]>Сайт-визитка</option>
            <option value="Kорпоративный сайт" [[!+fi.site-type:FormItIsSelected=`Kорпоративный сайт`]]>Kорпоративный сайт</option>
            <option value="Интернет-магазин" [[!+fi.site-type:FormItIsSelected=`Интернет-магазин`]]>Интернет-магазин</option>
            <option value="Индивидуально" [[!+fi.site-type:FormItIsSelected=`Индивидуально`]]>Индивидуально</option>
            </select>
        </div>
    </div>
        
    <!-- mob -->            
    <div class="col-sm-6">
        <div class="form-group has-feedback">
            <label class="control-label" for="tel">Номер телефона:</label> 
            <div class="input-group"><span class="input-group-addon"><i class="fa fa-phone fa-fw"></i></span>
            <input type="tel" name="tel" id="tel" class="form-control input-sm" maxlength="30" 
                   pattern="[0-9]{10,11}" value="[[+fi.tel]]" placeholder="В формате, 0993640397">
            </div>
        </div>
    </div>
  </div><!-- /.row -->
    
  <!-- message -->
  <div class="form-group has-feedback">
      <label class="control-label" for="af_message">Введите сообщение:</label> 
      <textarea id="af_message" name="message" class="form-control input-sm" style="height: 100px;" maxlength="500" 
      rows="3" placeholder="Введите сообщение от 10 до 500 символов.">[[+fi.message]]</textarea>
  </div>
    
  <label class="checkbox-inline">
      <input type="hidden" name="policies[]" value="">
      <input type="checkbox" id="af_policies" name="policies[]" value="1" [[!+fi.policies:FormItIsChecked=`1`]] autocomplete="off">
      <span class="required">*</span>Нажимая на кнопку "Сделать заказ", я даю <a href="ссылка на страницу согласия">согласие на обработку персональных данных.</a></label><hr>
     
     <p>Загрузите ТЗ в формате .doc .docx или .pdf</p>
     <p><input type="file" id="af_file" name="file" multiple accept="application/msword,.docx,application/pdf">
     
     <hr>
    
  <!-- captcha --> 
    
  <p>
      <button type="reset" class="btn btn-main btn-sm">Очистить</button>
      <button class="btn btn-last btn-sm" type="submit">Сделать заказ</button>
  </p>
    
</form><!-- /.FORM -->

5) Чанк websiteFormEmail (Шаблон сообщения на Email.)
<h3>[[++site_name]]</h3>
    <p>ФИО: [[+name]]</p>
    <p>E-mail: [[+email]]</p>
    <p>Тип сайта: [[+site-type]]</p>
    <p>Телефон: [[+tel]]</p>
    <p>Сообщение: [[+message]]</p>
    <p>Согласие на обработку данных: [[+policies:if=`[[+policies]]`:eq=`1`:then=`Принял`:else=`Не принял`]]</p>
    <p>Файл: [[+file]]</p>

6) Создать ресурс на котором будет вызываться форма.
[[!AjaxForm? 
      &form=`websiteForm` 
      &snippet=`FormIt` 
      &hooks=`email,FormItSaveForm`
      &placeholderPrefix=`fi.`
      &emailSubject=`Сообщение с сайта о заказе`
      &emailTo=`тут почта@gmail.com`
      &emailFrom=`vkode@vkode`
      &emailTpl=`websiteFormEmail`
      &validate=`name:minLength=^4^,
                 name:name:required,
                 email:email:required,
                 site-type:required,
                 message:minLength=^10^,
                 policies:required,`
      &validationErrorMessage=`В форме содержатся ошибки!`
      &successMessage=`Сообщение успешно отправлено!`
]]
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через TM ID
Похожие вопросы
Marronnier Санкт-Петербург
от 70 000 до 120 000 руб.
Glamy Санкт-Петербург
от 70 000 руб.
CAPYBARA digital Самара
от 40 000 до 50 000 руб.
14 авг. 2018, в 22:43
350 руб./за проект
14 авг. 2018, в 19:03
10000 руб./за проект
14 авг. 2018, в 18:10
1000 руб./в час