javascript - Laravel 通过 javascript 选择项目

Question

当我们在 laravel 中有 html 选择时，我们将在下面添加代码，它返回数据库值作为所选项目:

{{ $category->id == $product->category_id ? 'selected' : '' }}

喜欢:

<select class="form-control" name="category_id">
  @foreach($categories as $category)
    <option value="{{ $category->id }}" {{ $category->id == $product->category_id ? 'selected' : '' }}>{{ $category->title }}</option>
  @endforeach
</select>

如果我们使用 html select 就完美了，但现在我使用的是 ajax select 并返回数据，但我无法获取数据库中设置为所选选项的内容。

这是我的代码:

html

<div class="mt-20">
  {{ Form::label('category_id', 'Category') }}
  <select class="form-control" name="category_id">
     <option value="">Select Category</option>
       @foreach($categories as $category)
         <option value="{{ $category->id }}" {{ $category->id == $product->category_id ? 'selected' : '' }}>{{ $category->title }}</option>
       @endforeach
  </select>
</div>

<!-- sub category -->
<div class="mt-20">
  {{ Form::label('subcategory_id', 'Sub Category') }}
  <select class="form-control" name="subcategory_id">
    <option value="">Select Sub Category</option>
  </select>
</div>

javascripts

<!-- subcategory -->
<script>
  jQuery( document ).ready( function( $ ) {
    $('select[name="category_id"]').on('change', function() {
      $.ajaxSetup({
          headers: { 'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content') }
      });
       var CategoryId = $(this).val();
        if(CategoryId) {
            $.ajax({
              url: '{{ url('admin/subcategorylists') }}/'+encodeURI(CategoryId),
              type: "GET",
              dataType: "json",
              success:function(data) {
                $('select[name="subcategory_id"]').empty();
                var options = data.map(function(state) {
                    return $("<option class='form-control'>").val(state.id)
                                        .text(state.title);
                });
                $('select[name="subcategory_id"]').empty().append(options);
              }
            });
        }else{
          $('select[name="subcategory_id"]').empty().append("<option class='form-control' value='' selected>Select</option>");
        }
    });
  });
</script>

问题

1. 由于我的代码在编辑页面中，我需要选择子类别 使用默认选择的选项(这是保存在数据库中的值)， 我该怎么做？

Answer 1

只需将select 标记的值设置为您从数据库中获取的值。喜欢

$('select[name="subcategory_id"]').val("yourValue");