Question

selectize的文档已经解释了如何使用create：function（input，callback）{....}将新项添加到数据库中。

在我的例子中，selectbox的基本模型不仅包含选项名称，还包含其他数据。

P.e。：我有一个包含国家/地区的选择框。选项由模型“Countries”填充，其中包含“country_name”，“top_level”，“currency”。选择框仅显示“country_name”。如果用户想要添加新的国家/地区，我想打开一个自举模式，让用户添加新的国家/地区数据，保存后我想使用refreshOptions（）刷新选择框。

我试图在

的第741行更改selectize.js

'option_create': function(data, escape) {
    return '<div class="create">Add <strong>' + escape(data.input) + </strong>&hellip;</div>';

到

'option_create': function(data, escape) {
    return '<a data-toggle="modal" data-keyboard="false" data-backdrop="static" data-target="#modal" href="... some link ...">New country</a>';

我可以在seletbox中写一个不存在的国家后看到该链接，但是当我点击它时没有任何反应。

我该如何解决这个问题？我已经接近放弃了： - ）

++++++++++++++++++++++++++++++++++ 用于删除选项的Javascript：

<script type="text/javascript">
    $(".chosen-search-94-departID").selectize({
      create: true,
      sortField: {field: 'text'},
      onOptionAdd: function (value, $item) { 
          var link='... link ...' + value;
          load_modal_content (link, '... csrf ...');
          $('#modal').modal('show');
          $item.selectize.removeOption(value);
      },
  });

Answer 1

使用onItemAdd（参见Usage page）可能更清晰/更简单，以便在添加新项目时定义行为。我认为，不需要改变selectize.js。

selectize.js调用href添加新选项

1 个答案: