Yii2: добавление нового текстового поля при нажатии кнопки добавления

Question

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

<?php $form = ActiveForm::begin(); ?> 

     <?= $form->field($model, 'status_type')->textInput(['maxlength' => 
true]) ?> 

     <div class="form-group"> 
      <?= Html::submitButton($model->isNewRecord ? 'Create' : 
'Update', ['class' => $model->isNewRecord ? 'btn btn-success' : 'btn 
btn-primary']) ?> 
     </div> 

     <?php ActiveForm::end(); ?> 

, что я должен добавить в код для достижения этой цели.
Любая помощь будет оценена по достоинству.

Спасибо.

Answer 1

Я нашел решение следующим образом:
Js файл

jQuery(document).ready(function($){ 
    $('.my-form .add-items').click(function(){ 
     var n = $('.text-items').length + 1; 
     var box_html = $('<p class="text-items"><label for="item' + n + '">Item <span class="items-number">' + n + '</span></label> <input type="text" class="form-control" name="items[]" value="" id="item' + n + '" /> <a href="#" class="remove-items">Remove</a></p>'); 
     box_html.hide(); 
     $('.my-form p.text-items:last').after(box_html); 
     box_html.fadeIn('slow'); 
     return false; 
    }); 

    $('.my-form').on('click', '.remove-items', function(){ 
    //$(this).parent().css('background-color', '#FF6C6C'); 
    if($('.text-items').length > 1){ 
     $(this).parent().fadeOut('slow', function() { 
      $(this).remove(); 
      $('.items-number').each(function(index){ 
       $(this).text(index + 1); 
      }); 
     }); 
    } 
    return false; 
}); 
}); 

Посмотреть

<div class="my-form"> 

    <?php 
    if(!$model->isNewRecord){ 
     $items = StatusType::find()->where(['status_id'=>$model->id])->orderBy('order')->all(); 
     if(!empty($items)){ 
     foreach ($items as $item) { 
    ?> 

     <p class="text-items"> 
      <label for="item<?= $item->order ?>">Item <span class="items-number"><?= $item->order ?></span></label> 
      <input class="form-control" type="text" name="items[]" value="<?= $item->title ?>" id="item<?= $item->order ?>" /><br> 
      <a href="#" class="remove-items">Remove</a> 
     </p> 
    <?php }}else{ 
    ?> 
     <p class="text-items"> 
      <label for="item">Item <span class="items-number">1</span></label> 
      <input class="form-control" type="text" name="items[]" value="" id="item" /><br> 
      <a href="#" class="remove-items">Remove</a> 
     </p> 

    <?php 
     } } else{?> 
     <p class="text-items"> 
      <label for="item">Item <span class="items-number">1</span></label> 
      <input class="form-control" type="text" name="items[]" value="" id="item" /><br> 
      <a href="#" class="remove-items">Remove</a> 
     </p> 
    <?php }?> 
    <?= Html::button('Add More', ['class'=>'glyphicon glyphicon-plus btn btn-default btn-sm add-items']) ?> 
</div> 

Answer 2

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

https://www.youtube.com/watch?v=qqFpTBr323Y