2014-07-30 3 views
0

Я использую Select2 с JQuery-редактируемым и сталкиваясь с ненормальным поведением Select2, то, что я делаю, отображается редактируемая таблица информации с использованием шаблона ejs, и по мере того, как пользователь нажимает на CBA, открывается в окне select2, которое имеет первоначально выбранный результат, а затем пользователь может добавлять или удалять параметры в нем, параметры поступают из источника базы данных, а когда пользователь выбирает параметры, он добавляет пустой параметр в базу данных с выбранным параметром, массив выглядит этоSelect2 вставляет пустую текстовую опцию в динамический список

[ "ABCD", "ONAB", "", "BCNU"]

Я где-то читал о allowClear: true и добавил placeHolder, но мне это совсем не помогло. Поскольку все делается динамически, я не могу найти, где добавляется эта пустая опция.

код ниже:

Эйс/HTML код Выберите 2

<tr> 
<td width="40%">Select CBA(s)</td> 
<td> 
    <a class="cbaSelectUnit" data-emptytext="Select CBA(s)" data-original-title="Select CBA(s)" data-type="select2"></a> 
</td> 

Javascript для Select 2

$("a[data-name='Cba']").editable({ 
    showbuttons: 'false', 
    emptytext: 'None', 
    display: function(values) { 
     var html = []; 
     html.push(values); 
     $(this).html(html); 
    }, 
    select2: { 
     multiple: true, 
     allowClear: true, 
     placeholder: "Select CBA(s)", 
     ajax: { 
      // url is copied from data-source via x-editable option-passing mechanism 
      dataType: 'json', 
      // pass the '?format=select2' parameter to API call for the select2-specific format 
      data: function(term, page) { 
       return { 
        deptId: departmentId, 
        format: 'select2' 
       }; 
      }, 
      // transform returned results into the format used by select2 
      results: function(data, page) { 
       return { 
        results: data 
       }; 
      } 
     }, 
     // what is shown in the list 
     formatResult: function(cba) { 
      return cba.text; 
     }, 
     // what will appear in the selected tag box 
     formatSelection: function(cba) { 
      return cba.text; 
     }, 
     // rendering id of the values to data.value requirement for Select 2 
     id: function(cba) { 
      return cba.value; 
     }, 
     // what is shown in the selected-tags box 
     initSelection: function(element, callback) { 
      var id = $(element).val(), 
       result = id.replace(/^,\s*$/, ',').split(",").map(function(v) { 
        return { 
         id: v, 
         text: v 
        }; 
       }); 
      callback(result); 
     } 
    } 
}); 

Формат, в котором код возвращается из базы данных: -

Facility.findOne({ _id: department.Facility }, function(err, facility) { 
    if (err) { 
     res.send(500, err); 
    } else if (!facility) { 
     res.send(404, 'Facility not found'); 

    } else if (req.query.format && req.query.format === 'select2') { 
     var result = facility.Cba.map(function(c) { 
      return { value: c, text: c }; 
     }); 
     res.json(result); 

    } 
}); 

Изображение показывает пустой ящик, добавленный себя

Image showing an empty box added by itself Как массив выглядит после того, как я редактирую

enter image description here

ответ

0

Так что это была просто синтаксическая ошибка, я был d йти узнал сам,

Я возвращался cba.value как идентификатор, но initSelection возвращался

{идентификатор: v, текст: v}

должно быть значение & текст вместо id & текст.

 // what is shown in the selected-tags box 
    initSelection: function(element, callback) { 
     var id = $(element).val(), 
      result = id.replace(/^,\s*$/, ',').split(",").map(function(v) { 
       return { 
        value: v, 
        text: v 
       }; 
      }); 
     callback(result); 
    } 

 Смежные вопросы

  • Нет связанных вопросов^_^