javascript - Chosen select work on chrome but not firefox/IE -


i load options database chosen select angularjs, code works expected on chrome browsers on firefox or internet explorer code doesn't load options.

i tried switch directive angular chosen library, 1 works on browser ng-change doesn't triggers function associated event.

this original code(work on chrome only): html

       <select ng-model="addcapas" ng-change="aplicarfiltro()"              multiple class="control-group html-multi-chosen-select"              multiple="multiple" chosen style="width: 100%;">        <option ng-repeat="filt in filtros"  value={{filt.nombre}}>{{filt.nombre}}</option>                             </select>   

the js file:

app.directive('chosen', function($timeout) {     var linker = function(scope, element, attr) {          scope.$watch('', function() {             $timeout(function() {                 element.trigger('chosen:updated');             }, 0, false);         }, true);         $timeout(function() {             element.chosen();         }, 0, false);     };     return {         restrict: 'a',         link: linker     }; }); 

the part load options on select:

app.controller("appctrl", function ($http,$scope) {       $http({url: "/ewisemaps/catalogocomp",         data: $.param({             catalogo: "capas",         }),         method: 'post',         headers: {             'content-type': 'application/x-www-form-urlencoded; charset=utf-8'}     }).success(function (res) {          if(res!=null){                           $scope.filtros = [];             $scope.capas = [];             $scope.addtipolog = [];             angular.foreach(res.oapi, function (index, value) {                 if(index.tipo == 1){                     $scope.filtros.push({id: index.id, nombre: index.nombre, valor: index.valor, orden: index.orden});                                   $scope.capas.push(index.nombre);                 }else{                     $scope.addtipolog.push({id: index.id, nombre: index.nombre, valor: index.valor, orden: index.orden});                 }                        });                      console.log("carga de capas completa");                }else{             console.log("error al cargar catalogos\n");         }     }); 

when use chosen angular change module code : var app = angular.module('app', ['localytics.directives']); , delete chosen directive.

any hints on why works on chrome? or why chosen angular doesn't trigger ng-change event?

edit: added server site can test http://192.168.15.100:8008/ewisemaps/capas

according angular-chosen docs:

note: don't try use ngmodel ngrepeat. won't work. use ngoptions. it's better way.

this implies using ng-repeat select tag cause unexpected behavior -- example, across different browsers.

try getting rid of option tag , use ng-options:

   <select ng-model="addcapas"             ng-options="filtro filtro in filtros"            ng-change="aplicarfiltro()"             multiple class="control-group html-multi-chosen-select"             multiple="multiple" chosen style="width: 100%;"                          </select>   

fyi: link server site won't work on stackoverflow. can connect directly ip address if you're on same area network computer trying connect.


Comments

Popular posts from this blog

java - pagination of xlsx file to XSSFworkbook using apache POI -

Unlimited choices in BASH case statement -

apache - How do I stop my index.php being run twice for every user -