Laravel 5.1(4)Text Field 動的増減＆入力補完

Text Field 入力補完：Autocomplete

Javascript使用、別途route、Controller側にDB検索して、結果をjsonにて返すソースを追加必要ある（省略）。

<script type="text/javascript">
 
    $(function() {
         $( "#allergy" ).autocomplete({
          source: "{{ route('autoAllergy') }}",
          minLength: 1,
          select: function(event, ui) {
            $('#allergy').val(ui.item.value);
          }
         });
    });
></script>

Text Field 動的増減＆入力補完：Dynamic Add/Remove

jQuery使用、動的増減＆入力補完、入力補完のソースが動的増減ソースに埋め込む。別途blade側にjquery-ui.css、jQuery-2.1.4.min.js（他のバージョンでもよいか）、jquery-ui.js、またinputタグのclassなど追加必要ある（省略）。

<script type="text/javascript">
var $i = 0;
$(".addmore").on("click", function () {
if($i > 20) alert('注意：最大20行まで追加できます');
else  {
    $(".addform").append("<div class='input-group control-group' style='margin-top:20px;width: 100%;'><input class='form-control' id='item"+$i+"'  placeholder='削除は右側の－キーをクリックして下さい' name='value[]' type='text'><div class='input-group-btn'><button class='btn btn-default deleteform' type='button'><i class='fa fa-minus'></i></button></div></div>");            
    $( "#item"+$i).autocomplete({source: "{{ route('autoAllergy') }}", minLength: 1, select: function(event, ui) { $("#item"+$i).val(ui.item.value);} });
}
$i++;
});
$("body").on("click", ".deleteform", function () {
$(this).parent().parent().remove();
});
</script>

但し、views.allergys.createの際、AllergysController側storeで、validateの際、未入力か入力エラーのtext項目があった場合、create画面に戻って、動的増やしたtext fieldが表示されなくなる現象が確認した。別途、create1を作成するか、Inputにより分岐して、増やしたtext fieldを再描写するのか、手を施す必要がある。