Как использовать массив лезвий (добавленный javascript) с помощью отдельного файла js?

#javascript #php #jquery #laravel #laravel-blade

#язык JavaScript #php #jquery #ларавель #ларавель-лезвие

Вопрос:

У меня есть функция javascript, подобная этой :

 function addRow(){ $('#mainbody').append('lt;trgt;'    'lt;tdgt;lt;select class="form-control" name="addmore[' i '][name]" id="name' i '" required gt;'    'lt;option disabled="disabled" selected="selected" value="" gt;Select Productlt;/optiongt;'    '@foreach($produk as $pro)'    'lt;option value="{{$pro-gt;id}}"gt;{{$pro-gt;nama}}lt;/optiongt;'    '@endforeach' )}  

Когда я использую скрипт в том же файле блейда (представления), он работает, но когда я отделяю функцию javascript и включаю скрипт в заголовок, он показывает синтаксис блейда буквально как {{ $pro-gt;id }} (не фактическое число от контроллера, но он добавляет новую строку с {{ $pro-gt;gt;имя }} в качестве значения).

Итак, мой вопрос в том, могу ли я создать отдельный файл для своей функции javascript ? Потому что я использую скрипт в режиме создания и редактирования, поэтому я хочу сделать свой вид более чистым.

Комментарии:

1. Потому что js не может скомпилировать код laravel. вы должны использовать js для каждого из них вместо laravel

Ответ №1:

Вы должны назначить $produk переменную js переменной, когда этот файл блейда был инициирован.

Приведенный ниже код может отображать $produk данные в переменную типа данных JS const.

 const produk = @json($produk)  

Затем вы можете сделать foreach внутри select тега

 produk.forEach(element =gt; {  // ...use `element`... });  

Ответ №2:

Движок шаблонов Laravel не может компилировать файлы javascript, но вы можете написать свой код javascript внутри файла blade. добавьте свой сценарий внутри блейда поместите свои данные в переменную json, сформированную, а затем выполните цикл для каждого из элементов, которые вы хотите

Попробуйте это example.blade.php

 lt;script type="text/javascript"gt; let produk = {!! json_encode($produk) !!};  function addRow(){  var tr = $('lt;trgt;lt;/trgt;');  var select = $(`lt;select class="form-control" name="addmore[]" required gt;lt;/selectgt;`);  for(const pro in produk) {  var td = $(`lt;option value="${ pro-gt;id }"gt;${ $pro-gt;name }lt;/optiongt;`);  select.append(td);  }  tr.append(select);  $('#mainbody').append(tr); } lt;/scriptgt;