如何在使用带有laravel的AJAX数据时设置Select2的选定值?

时间:2016-07-15 12:12:59

标签: jquery ajax laravel tags select2

控制器@更新

  //Update
  $course = Course::findOrFail($id);
  $course->name = Input::get('name');
  $course->code = Input::get('code');
  $course->credits = Input::get('credits');
  $course->description = Input::get('description');

  $course->tags()->sync(Input::get('tags')); // Use of sync method

  //return [$course];
  $course->save();
  //Redirect
  Session::flash('message', 'Successfully edited the course : '.$course->name);
  return $this->show($course->code);

HTML

<pre>
<div class="form-group">
     {{Form::label('tags', 'Tag')}}
     {{Form::select('tags[]',[],null,array('multiple'=>'multiple','name'=>'tags[]','id'=>'tag_list','class'=>'form-control'))}}
   </div>
</pre>

选择2脚本

function tagResultTemplater(tag) {
    return tag.name + " : " + tag.type;
  }

  function tagSelectionTemplater(tag) {
    return tag.id + " "+tag.name + " : " + tag.type;
  }
  $("#tag_list").select2({
    ajax: {
      url: "{!! route('tags.json') !!}",
      dataType: 'json',
      delay: 250,
      tags: true,
      data: function (params) {
        return {
          q: params.term, // search term
        };
      },
      processResults: function (data) {
        return {
          results: data
        };
      },
      cache: true
    },
    minimumInputLength: 1,
    placeholder: function(){
      $(this).data('placeholder');
    },
    templateResult: tagResultTemplater,
    templateSelection: tagSelectionTemplater

  });

我正在将课程管理系统作为一个研究项目,简而言之,课程和标签之间存在多对多的关系,我想使用同步方法和Select2软件包来附加和取消课程中的标签。一种方便的方法,但是在使用ajax数据时我找不到设置Select2的选定值的方法。如果有人能提供一个如何做到这一点的简单指南,那将非常感激:D。

2 个答案:

答案 0 :(得分:0)

在类似情况下,我只能避免使用表单生成器

<select name="tags" id="tag_list" class="form-control" multiple>
   @foreach ($course->tags as $tag)
      <option value="{{ $tag->id }}" selected>{{ $tag->name }}</option> 
   @endforeach
</select>

答案 1 :(得分:0)

由于这是Ajax请求,因此控件未填充数据。 在Select2 v.4>中,如果您不想遵循官方文档的建议,则可以使用类似此JS函数的设置初始值

function initSelect2(control, key, value){
    var data = {
        id: key,
        text: value
    };
    var initOption = new Option(data.text, data.id, false, false);
    control.append(initOption);
    control.val(value).trigger('change');
}

然后打电话

initSelect2( $('#tags'), '{{ $tag->id }}', '{{ $tag->name }}');

设置默认/初始值