Невозможно добавить опцию фильтра клиента, используя jQuery selectize и Angular.js - PullRequest
0 голосов
/ 09 июля 2019

Я пытаюсь добавить опцию фильтра в выпадающий список, используя библиотеку выбора jQuery, но она не работает должным образом. Я предоставляю свой код ниже.

<div class="col-md-6" style="margin-bottom: 15px;">
   <div class="input-group bmargindiv1 col-md-12">
     <span class="input-group-addon ndrftextwidth text-right oditek-form"
           style="width:180px">City Name :</span>
        <select class="form-control oditek-form" name="citycode1"
                id="citycode1" ng-model="citycode1"
                ng-options="result.name for result in listOfCity1 track by result.value ">
            <option value="">City</option>
        </select>
   </div>
</div>
    $scope.listOfCity1=[];
        //$scope.citycode=$scope.listOfCity[0];
        var url11='../service/admin/service/service.php?action=getAllCityData';
        var method='GET';
        var data11='';
        DataService.connectToServerSideScript(method,url11,data11)
        .then(function(response) {
            if (response.length >0) {
                angular.forEach(response,function(obj){
                    var cdata={'name':obj.city_name,'value':obj.id};
                    $scope.listOfCity1.push(cdata);
                })
            }
        },function(error) {

        })

Вот мой выпадающий список, который получает динамические данные. Здесь я реализую библиотеку selectize.js, как показано ниже.

<script src="js/selectize.js" type="text/javascript"></script>
<script type="text/javascript">
    $('#citycode1').selectize();
 </script>

Здесь моя проблема в том, что в раскрывающемся списке поле не отображает никаких данных в своем списке после добавления этой библиотеки, а также ширина поля уменьшается до очень маленького размера. Сгенерированная часть HTML-кода приведена ниже.

<div class="input-group bmargindiv1 col-md-12">
<span class="input-group-addon ndrftextwidth text-right oditek-form" style="width:180px">City Name :</span>
<select class="form-control oditek-form selectized ng-pristine ng-untouched ng-valid ng-empty" name="citycode1" id="citycode1" ng-model="citycode1" ng-options="result.name for result in listOfCity1 track by result.value " tabindex="-1" style="display: none;"><option value="" class="" selected="selected"></option><option label="Khordha" value="6">Khordha</option><option label="Puri" value="3">Puri</option><option label="Cuttack" value="2">Cuttack</option><option label="Bhubaneswar" value="1">Bhubaneswar</option></select><div class="selectize-control form-control oditek-form single"><div class="selectize-input items not-full"><input type="select-one" autocomplete="off" tabindex="" id="citycode1-selectized" placeholder="City" style="width: 25px;"></div><div class="selectize-dropdown single form-control oditek-form" style="display: none;"><div class="selectize-dropdown-content"></div></div></div>
</div>

Здесь мне нужны все данные в списке, которые можно отфильтровать по тексту пользовательского типа.

...