README

Nette 框架的 Select2 简单实现。

如何使用

1. 在配置中注册扩展

extensions:
    selectt: Selectt\DI\SelecttExtension

1. 添加一些配置

selectt:
  single:
    class: select2-ajax
    jsAttributes:
      allowClear: true
      placeholder: Please select option
      width: 100%
  multi:
    class: select2-ajax-multi
    jsAttributes:
      allowClear: true
      placeholder: Please select
      width: 100%

部分 jsAttributes 包含您喜欢的任何 Slelect2 参数。如果您只想在单个选择中使用该参数，也可以使用方法 ->addSelect2Attribute($name, $value) 在相应的对象上。

1. 将 Select2 包含到您的项目中
2. 初始化 Select2 以用于所需类

$(function(){
    $('.select2-ajax').each(function () {
        let params = $(this).data().select2Params;
        params.ajax = {
            url: $(this).data('select2-url'),
            dataType: 'json'
        };

        $(this).select2(params);
    });

    $('.select2-ajax-multi').each(function () {
        let params = $(this).data().select2Params;
        params.ajax = {
            url: $(this).data('select2-url'),
            dataType: 'json'
        };

        $(this).select2(params);
    });
});

1. 创建具有您自己的 Selectt\SelecttDataSource 实现的 ajax 自动完成组件

public function createComponentAutocomplete(): SelecttAutocompleteControl
{
  $a = new SelecttAutocompleteControl(new ArrayDataSource([
      1 => "Praha",
      2 => "Brno",
      3 => "Paříž",
      4 => "Hitler",
      5 => "patří",
      6 => "za",
      7 => "mříž"
  ]));
  $a->enableEmptyQuery();
  return $a;
}

1. 最后将 select2 或多选框添加到表单中。作为第二个参数提供自动完成组件！

public function createComponentForm(): Nette\Application\UI\Form
{
    $f = new Nette\Application\UI\Form();
    $f->addText("text", "text");
    $f->addSelect2("select2", $this['autocomplete'], "Best select in the world");
    $f->addSelect2Multi("select2multi", $this['autocomplete'], "Best multiselect ever");
    .
    .
    .
    return $f;
}

1. 盈利！