Как создать поле Yii2 ActiveForm с несколькими классами HTML - PullRequest
Новая
       54

Как создать поле Yii2 ActiveForm с несколькими классами HTML

0 голосов
/ 17 сентября 2018

Я изо всех сил пытаюсь использовать ActiveForm Yii2 для создания определенного стиля HTML / CSS, который я хочу. Этот HTML-код ниже (с применением css) создает поле формы со значком внутри и кнопкой отправки внутри . 

<form action="" class="form form--type">
            <i class="bpi bpi--icon"></i>
            <input type="email" class="field field--style-round" placeholder="Email address">
            <button type="submit" class="button button--style-default">
              Submit
            </button>
          </form>

Все, что находится между открывающими и закрывающими тегами формы, включено в форму. Мне в основном нужно создать поле для ActiveForm Yii2, которое включает в себя все, что HTML и отображает его правильно.

Я попытался сохранить этот HTML-код и поместить $ form-> field (), где - это только значок и кнопка подтверждения, находящиеся вне его. Прямо сейчас я попытался передать этот стиль с использованием textInput ($ options = []) следующим образом: 

<?= $form->field($model, 'email')->textInput($options = 
         [
              'class' =>
                   ['form form--type-input-button-split', 'bpi bpi--email', 'field field--style-round'], 
              'placeholder' => 'Your email address',
              'button' =>
                   ['type' => 'submit', 'class' => 'button button--style-default']
         ])?>

Но он не отображает значок или кнопку отправки внутри поля, как мне нужно (кнопка не отображается вообще). Я уверен, что я не настраиваю кнопку прямо в этом массиве, но в целом, как вы создаете поле формы Yii2 с несколькими конкретными html-элементами (такими как ,

1 Ответ

0 голосов
/ 17 сентября 2018

Вы можете использовать свойство parts и свойство templete активного поля для настройки html-ввода, например: 

$form->field($model, 'email', [
  'parts' => [
    '{icon}' => '<i class="bpi bpi--icon"></i>',
    '{button}' => '<button type="submit" class="button button--style-default">Submit</button>'
  ],
  'template' => "{label}\n{icon}{input}{button}\n{hint}\n{error}"
])->textInput($options[
  'class' => 'form form--type-input-button-split bpi bpi--email field field--style-round'], 
  'placeholder' => 'Your email address',
])?>

Также вы можете настроить эти свойства для каждого поля формы, например: 

$form = ActiveForm::begin([
  'id' => 'myform',
  'fieldConfig' => [
    'parts' => [
      '{icon}' => '<i class="bpi bpi--icon"></i>',
      '{button}' => '<button type="submit" class="button button--style-default">Submit</button>'
    ],
    'template' => "{label}\n{icon}{input}{button}\n{hint}\n{error}"
  ],
]);
...