<div data-values="wrap">
   <div class="row">
      <div class="col-xs-3 m-b-2">
         <a href="#" data-form-add class="btn btn-success btn-block"><span
               class="bi bi-plus-lg"></span>&nbsp;{'buttonAddValue'|translate}</a>
      </div>
   </div>

   <div class="wpj-panel wpj-panel-default">
      <div class="wpj-panel-heading">
         <div class="row">
            <div class="col-xs-6">
                <small>{'parameter_name'|translate}</small>
            </div>
            <div class="col-xs-6">
               <small>{'parameter'|translate}</small>
            </div>
         </div>
      </div>
      <div class="wpj-list-group">
          {foreach $body.data.parameters as $key => $row}
              <div class="wpj-list-group-item" {if $key == 0}data-form-new style="display:none" {else}data-form-item{/if}>
                 <div class="row">
                    <div class="col-xs-6">
                       <label for="data[parameters][{$key}][name]">{'parameter_name'|translate}</label>
                       <input type="text" class="form-control input-sm" name="data[parameters][{$key}][name]" maxlength="50"
                              value="{$row.name}">
                    </div>
                    <div class="col-xs-6">
                       <label for="data[parameters][{$key}][id_parameter]">{'parameter'|translate}</label>
                       <div class="input-group wpj-input-group">
                          <select class="selecter" name="data[parameters][{$key}][id_parameter]" data-type="parameter"
                                  data-preload="Parameters"
                                  data-filter-type="autocomplete" data-autocomplete="parameters"
                                  id="parameters{$key}_preload">
                              {$index = "parameter{$key}"}
                              {if $row.id_parameter}
                                 <option value="{$row.id_parameter}" selected>{$row.id_parameter}</option>
                              {else}
                                 <option value="" selected>{'notSelected'|translate:'products'}</option>
                              {/if}
                          </select>
                          <a class="btn btn-danger" title="{'buttonDeleteValue'|translate}" data-form-delete>
                             <input class="hidden" type="checkbox" name="data[parameters][{$key}][delete]">
                             <span class="bi bi-trash"></span>
                          </a>
                       </div>
                    </div>
                 </div>
              </div>
          {/foreach}
      </div>
   </div>
</div>
<script type="application/javascript">
   {block initForm}
   initForm({
      selector: '[data-values=wrap]',
      beforeAdd: function (callback) {
         var $item = callback();
         window.preloadAutocompletes($item);
      }
   });
   {/block}
</script>
