标签: ui-select2

我正在尝试将select2加载项用作具有自动完成功能的更多文本框(与下拉列表相比).这意味着如果用户键入了不在列表中的内容,我希望此自定义值保留为表单的值.

我搜索了stackoverflow并找到了以下内容:

禁用"找不到匹配项"文本并在select2上自动完成

选择2,当没有选项匹配时,应出现"其他"

他们都没有保持"自定义"价值.

是的,我们可以像这样添加占位符select2,

$("#e2_2").select2({
placeholder: "Select a State"
});

但是我需要这样的东西,

在这里你可以看到linkedin提供"键入另一个专业领域".意味着当您再次选择专业知识时,它会显示占位符以供选择 我想用select2做同样的事情.

请帮忙.

我有一个简单的select2 init,我希望在默认情况下禁用它而不用后续链接.select2("enable", false).

HTML:

<input type='hidden' value="192" data-init-text='Bla bla' name="input" id="test" style="width:300px;" />

JS:

$(document).ready(function() {
    $('#test').select2({
        minimumInputLength: 3,
        placeholder: "Search",
        enable: "false", // I want this to be working!
        ajax: {
            url: "http://www.weighttraining.com/sm/search",
            dataType: 'jsonp',
            quietMillis: 100,
            data: function(term, page) {
                return {
                    types: ["exercise"],
                    limit: -1,
                    term: term
                };
            },
            results: function(data, page ) {
                return { results: data.results.exercise }
            }
        },
        formatResult: function(exercise) { 
            return "<div class='select2-user-result'>" + exercise.term + "</div>"; …

有问题的人使用angular-ui-select？

得到这个错误

GET http://localhost/select2/select.tpl.html 404 (Not Found) angular.js:8539
Error: [$compile:tpload] Failed to load template: select2/select.tpl.html

从文档中 - 我只需要引用select.js和select.css

题 :

如何将默认值设置为角度ui-select

从对象和对象获取的下拉值不具有默认值.

和ui-select应该在前端设置默认值.

例如:

下拉值如下

1 -all fruits 2 -apple 3 -banana 4-water melon

从2到4的值是从服务器发送的对象派生的.但是前端需要设置默认值,即1 - 所有水果

通过ui-select2参考下面的示例集如何在ui-select中迁移它？

<select ng-model="fID" class="select"  ui-select2 data-placeholder="select fruit">
            <option value="">All fruits</option>
            <option ng-repeat="f in frits value="{{f.fID}}">{{f.name}}</option>
        </select>

<ui-select theme="select2" ng-model="fruits.selected">
            <ui-select-match placeholder="select please" allow-clear="false">                    {{$select.selected.name}}
</ui-select-match>
            <ui-select-choices repeat="f in fruits | filter:$select.search">
                <div ng-bind-html="f.name | highlight: $select.search:'underline'"></div>
            </ui-select-choices>
        </ui-select>

http://plnkr.co/edit/a3KlK8dKH3wwiiksDSn2?p=preview https://github.com/angular-ui/ui-select 链接:angular-ui/ui-select

下午好!

我正在尝试使用UI-Select来填充与模型相关联的表单.使用控制器通过以下方式从服务器接收模型数据:

<form action="index.php" method="post" class="form-horizontal" ng-controller="WorkPlanController as ctrl" ng-init="init(6)">

<!-- this work perfectly! -->
    <textarea name="workplan_approver_post" ng-model="workplan.approver_post"></textarea>

<!-- here I have troubled -->
<div ng-controller="LookupController as lookupCtrl" ng-init="lookupCtrl.initLookup('corriculum_speciality_directions')">
<ui-select ng-disabled="disabled" multiple ng-model="workplan.profiles" theme="select2">
<ui-select-match placeholder="???????? ???????? ?? ??????">{{$item.value}}</ui-select-match>
<ui-select-choices repeat="item.key as item in items track by $index | filter: $select.search">
<div ng-bind-html="item.value | highlight: $select.search"></div>
</ui-select-choices>
</ui-select>
</div>

</form>

WorkPlanController是一个简单的REST服务:

application
    .controller("WorkPlanController", [
        '$scope',
        'WorkPlan',
    function($scope, workPlanFactory){
        $scope.workplan;
        $scope.workplan = {
            profiles: []
        };
        $scope.init = function($id){
            workPlanFactory.get({id: $id}, …

在angularjs我有一个ui-select:

<ui-select ng-model="itemSelected.selected" theme="selectize" ng-disabled="disabled">
   <ui-select-match placeholder="Select an item...">{{$select.selected.Name}}</ui-select-match>
   <ui-select-choices repeat="item in itemsList">
      <span ng-bind-html="item.Name"></span>
   </ui-select-choices>
</ui-select>

如何在加载页面时从代码中选择项目？当我在控制器中加载页面时,我得到$scope.itemsList:如何从中选择特定项目controller？

谢谢

问题是，当您在使用 ngAnimate 的 Angular 项目中有一个 ui-select 并单击它来输入内容时，您将无法输入，直到您再次单击输入元素。基本上，它似乎只关注第二次点击。

这似乎是引导主题的问题，并且列表中没有任何项目。

http://plnkr.co/edit/jqXDJLN33U75EO9imGER?p=preview

  <ui-select ng-model="country.selected" theme="bootstrap" ng-disabled="disabled" style="width: 300px;">\n    <ui-select-match placeholder="Select or search a country in the list...">{{$select.selected.name}}</ui-select-match>\n    <ui-select-choices repeat="country in countries | filter: $select.search">\n      <span ng-bind-html="country.name | highlight: $select.search"></span>\n      <small ng-bind-html="country.code | highlight: $select.search"></small>\n    </ui-select-choices>\n  </ui-select>\n

var app = angular.module(\'selectizeDemo\', [\n  \'ngAnimate\',\n  \'ngSanitize\', \n  \'ui.select\'\n  ]);\n\napp.controller(\'MainCtrl\', function($scope) {\n\n    $scope.countries = [];\n\n  /*$scope.countries = [ \n    {name: \'Afghanistan\', code: \'AF\'},\n    {name: \'\xc3\x85land Islands\', code: \'AX\'},\n    {name: \'Albania\', code: \'AL\'},\n …

我正在使用ui-select2并尝试点击编辑按钮打开新页面.我看到一些奇怪的问题.我第一次打开新页面时它打开正常,但是当我取消它并再次打开同一页面时,通过单击编辑,它会给我以下错误:

select2.full.min.js:3 The select2('destroy') method was called on an element that is not using Select2
angular.js:13708 TypeError: Cannot read property 'destroy' of undefined
at n.a.fn.select2 (select2.full.min.js:3)
at HTMLSelectElement.<anonymous> (select2.js:175)
at HTMLSelectElement.dispatch (jQuery-2.1.4.min.js:3)
at HTMLSelectElement.r.handle (jQuery-2.1.4.min.js:3)
at Object.trigger (jQuery-2.1.4.min.js:3)
at n.triggerHandler (jQuery-2.1.4.min.js:3)
at Function.pa.fn.on.pa.cleanData (angular.js:1865)
at n.remove (jQuery-2.1.4.min.js:3)
at angular.js:5504
at Object.push (angular.js:5085)

通过阅读这个消息,似乎我将不得不定义destroy方法,但我没有得到如何在我的控制器中定义destroy方法以及如何调用取消按钮(取消方法)调用..以下是select的代码片段:

<select ui-select2 class="form-control input-lg" ng-model="cityId" ng-change="loadLocality()">
                                <option ng-repeat="city in cities|orderBy:'name'|filter:'ACTIVE':true" value="{{city.id}}">{{city.name}}</option>
                            </select>

我正在尝试从下拉列表中选择一个值,并从angularJs中的相应选择ID中获取数据

我想出了angular-ui/ui-select指令

<ui-select ng-model="customer" theme="selectize">
     <ui-select-match placeholder="Customer List">{{$select.selected.Name}}</ui-select-match>
        <ui-select-choices repeat="customer in customers | filter: $select.search">
            <span ng-bind-html="customer.Name | highlight: $select.search"></span>
            <small ng-bind-html="customer.Id.toString() | highlight: $select.search"></small>
        </ui-select-choices>
</ui-select>

在我的控制器上我得到了客户方法

$scope.setActiveCustomer = function(customer) {
  customersService.getCustomers(customer).then(function(response) {
    $scope.selectedCustomer = response;
  });
};

我的问题是

• 一旦我选择客户哪个事件我应该用于fire setActiveCustomer(如onchange或其他东西).当我使用ng-click 事件多次激发因为ng-click使用控制激活.

• 另一件事是我如何设置ui-select的初始值？

谢谢

我有一个select2下拉菜单,您需要先输入2个字符,然后选择您的项目.我无法用量角器测试这个.

var select2 = element(by.css('div#s2id_person'));
select2.click();
select2.sendKeys('ip');
select2.sendKeys(protractor.Key.ENTER);

当您尝试sendKeys时,以下内容会出现无法关注元素的错误.

角度版本:AngularJS v1.3.6 http://github.com/angular-ui/ui-select:版本:0.8.3

var p1 = {name:'Ramesh',email:'Ramesh@email.com',年龄:99};

   $scope.people = [
            { name: 'Amalie',    email: 'amalie@email.com',    age: 12 },
            { name: 'Wladimir',  email: 'wladimir@email.com',  age: 30 },
            { name: 'Samantha',  email: 'samantha@email.com',  age: 31 },
            { name: 'Estefanía', email: 'estefanía@email.com', age: 16 },
            { name: 'Natasha',   email: 'natasha@email.com',   age: 54 },               
            { name: 'Adrian',    email: 'adrian@email.com',    age: 21 },
            p1
        ];

 $scope.people.selected = p1 ;

HTML:

  <ui-select  class="full-width-select select" ng-model="people.selected" theme="select2">
                <ui-select-match  allow-clear="false">{{$select.selected.name}}</ui-select-match>
                <ui-select-choices repeat="person in people | filter:$select.search"> …

我尝试了AngularJS ui-select演示应用程序:https://github.com/angular-ui/ui-select2/tree/master/demo进行多选.我尝试的具体示例是具有预定义值的多选.最初它加载两个预选状态.单击条目时,下拉列表显示未定义.和model有两个字符的州名.我错过了什么吗？

plunker链接:http://plnkr.co/edit/IeWSZX2MDq1GfXbm3hQB

HTML:

<input type="text" style="width:300px" ui-select2="multi" ng-model="multi2Value" />

片段:

var states = [
  { text: 'Alaskan/Hawaiian Time Zone', children: [
    { id: 'AK', text: 'Alaska' },
    { id: 'HI', text: 'Hawaii' }
  ]},
  { text: 'Pacific Time Zone', children: [
    { id: 'CA', text: 'California' },
    { id: 'NV', text: 'Nevada' },
    { id: 'OR', text: 'Oregon' },
    { id: 'WA', text: 'Washington' }
  ]}, ...}

$scope.multi2Value = [
    { id: 'CT', …