Как получить доступ к элементам веб-формы в webform.html.twig


Я пытаюсь найти способ доступа к элементам веб-формы из webform.html.twig.

Мне нужно оформить форму; обернуть некоторые элементы и добавить кучу стилей , все, что у меня есть в webform.html.twig, - это переменная "дети", которая отображает всю форму, в то время как мне нужно обращаться к каждому элементу индивидуально.

Я нашел в Интернете ссылку на webform-form.html.twig, которая может сделать то, что мне нужно, однако я не могу найти ее в шаблоне веб-формы папка

Http://cgit.drupalcode.org/webform/tree/templates/webform-form.html.twig?id=1135b65031cd6cd195c2e638300e5ef945a6f652

Мы высоко ценим любую помощь в этом вопросе.

Author: Ibrahim Samir, 2017-04-01

4 answers

Я нашел решение для этой ситуации.

  1. создайте файл tempalte для своей формы (например, веб-форма--newsletter.html.twig)
  2. существует переменная (элемент), в которой вы можете получить доступ к каждому полю формы следующим образом:

{{элемент.элементы.ВАШЕ ИМЯ_ПОЛЯ }}

  1. вам нужно вывести действие формы (отправить) в конце ссылки на форму:

{{элемент.действия}}

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

{{элемент.форм_токен}}

{{элемент.form_build_id}}

{{элемент.форм_ид}}

Мой окончательный шаблон формы выглядит так:

<div class="request-form">
  <div class="form-wrap clearfix">
    <div class="col-md-4 form-desc">
      {{ element.elements.form_description }}
    </div>
    <div class="col-md-8">
      <form{{ attributes }}>
        {{ title_prefix }}
        <div class="row">
          <div class="col-md-6">
            {{ element.elements.name }}
            {{ element.elements.email }}
            {{ element.elements.phone }}
          </div>
          <div class="col-md-6">
            {{ element.elements.message }}
            {{ element.form_token }}
            {{ element.form_build_id }}
            {{ element.form_id }}
            {{ element.actions }}
          </div>
        </div>
        {{ title_suffix }}
      </form>
    </div>
  </div>
</div>

Надеюсь, это поможет кому-нибудь еще

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

{{элемент.форм_токен}}

Заслуга принадлежит маэстроджед Шаблон ветки веб-формы вызывает ошибку "форма устарела"

 5
Author: Ibrahim Samir, 2017-05-14 07:07:36
<div class="contact-box">
  <div class="wrap">
    {{ element.elements.form_token }}
    {{ element.elements.form_build_id }}
    {{ element.elements.form_id }}
    <div class="request-form">
      <div class="form-wrap clearfix">
        <div class="col-md-4 form-desc">
          {{ element.elements.form_description }}
        </div>
        <div class="col-md-8">
          <form{{ attributes }}>
            {{ title_prefix }}
            <div class="row">
              <div class="col-md-6">
                {{ element.elements.salutation }}
                {{ element.elements.company }}
                {{ element.elements.first_and_last_name }}
                {{ element.elements.phone_number }}
                {{ element.elements.phone_number }}
                {{ element.elements.e_mail }}
                {{ element.elements.theme }}
                {{ element.elements.meeting }}
              </div>
              <div class="col-md-6">
                {{ element.elements.message }}
                {{ element.form_token }}
                {{ element.form_build_id }}
                {{ element.form_id }}
                {{ element.elements.actions }}
              </div>
            </div>
            {{ title_suffix }}
          </form>
        </div>
      </div>
    </div>
  </div>
</div>
 1
Author: Shamsher Alam, 2018-06-01 15:36:24

Я знаю, что это поздний ответ, но я не видел следующего подхода, упомянутого где-либо еще. Я думаю, что приведенные выше ответы немного банальны. Что я делаю, так это редактирую html-файл ветки отправки веб-формы с моей собственной разметкой, прямо над строкой {{form}}. Таким образом, по сути, я бы получил доступ к вводу имени и метке, введя {{form.elements.name}} между моими тегами html, а затем между моей разметкой и строкой {{form}} введите следующее {% set form =form|without('elements') %}

Это сохраняет маркер формы, идентификатор формы, идентификатор сборки формы, чтобы форма могла отправить

 1
Author: Christopher Koivu, 2020-01-26 13:34:36

Веб-формы в Drupal 8 в основном представляют собой просто массивы визуализации FAPI с пользовательским интерфейсом и некоторыми улучшениями. Чтобы узнать, как оформить веб-форму и ее элементы, вам следует поискать статьи о тематических формах в Drupal 8, которые вернут несколько полезных сообщений в блоге, подобных этому.

 0
Author: jrockowitz, 2017-04-04 00:51:26