Question

在我的项目中，电影与演员之间，电影与类别之间存在多对多的关系。当我尝试制作电影然后尝试使用Select2添加演员和类别时，它没有列出可用选项（输入字段看起来像灰色，就像它们被锁定了一样）。我查看了脚本是否正在加载。这是我的代码。

  MovieController:

  public function create()
  {  
    $actors = Actor::pluck('actor_name', 'id');
    $categories = Category::pluck('category_name', 'id');
    return view('movies.create', compact('actors', 'categories'));
  }

  create.blade.php:

       @extends('layouts.app')

       @section('title', '| Upload Movie')

       @section('stylesheets')

         {!! Html::style('css/select2.min.css') !!}

       @endsection

       @section('content')

         <div class="container">
            <div class="row">
                <div class="col-md-12">
                  <div class="row">
                    <div class="col-md-6">
                       {!! Form::open(['method'=>'POST', 'action'=> 'MovieController@store']) !!}
                      <div class="form-group">
                        {!! Form::label('movie_name', 'Name:') !!}
                        {!! Form::text('movie_name', null, ['class'=>'form-control'])!!}
                      </div>
                      <div class="form-group">
                        {!! Form::label('actor_id', 'Actors:') !!}
                        {!! Form::select('actor_id[]', $actors, null, ['class'=>'form-control select2-multi', 'multiple' => 'multiple']) !!}
                     </div>
                     <div class="form-group">
                        {!! Form::label('category_id', 'Category:') !!}
                        {!! Form::select('category_id[]', $categories, null, ['class'=>'form-control select2-multi', 'multiple' => 'multiple']) !!}
                     </div>
                     <div class="form-group">
                        {!! Form::submit('Upload Movie', ['class'=>'btn btn-primary']) !!}
                     </div>
                        {!! Form::close() !!}
                     </div>
                   </div>
                 </div>
             </div>
         </div>
         @endsection

         @section('scripts')

         {!! Html::script('js/select2.min.js') !!}

         <script type="text/javascript">

         $('.select2-multi').select2();

         </script> 

         @endsection

Answer 1

直接来自Select2文档：

在“准备就绪”之前，无法安全地操纵DOM。为确保浏览器初始化Select2控件之前DOM已准备就绪，请将代码包装在$（document）.ready（）块中。每页只需要一个$（document）.ready（）块。

https://select2.org/getting-started/basic-usage

因此您的代码应为：

<script type="text/javascript">
    $(document).ready(function() {
          $('.select2-multi').select2();
     });
</script>

为什么我的Select2在Laravel项目中不起作用？

1 个答案: