2014-05-12 14 views
9

Czy ktoś wie, czy można otworzyć programowo wybrane w angularjs. Ive triedJak otworzyć programowo programowo

angular.element(el).trigger('focus'); 
angular.element(el).trigger('click'); 
angular.element(el).trigger('mousedown'); 

Nic nie działa.

Próbowałem też

$scope.doSomething = function(){ 
    setTimeout(function() { 
     var el = document.getElementById('test'); 
     var e = document.createEvent("MouseEvents"); 
     e.initMouseEvent("mousedown", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null); 
     worked = el.dispatchEvent(e); 
    }, 0); 

} 

Powyższy zestaw ostrość ale nie otwieraj select.

Czy to możliwe?

+2

http://stackoverflow.com/questions/249192/how-can-you-programmatically-tell-an-html-select-to-drop-down- na przykład z powodu –

+0

dziękuję, próbowałem, ale to nie działa w angularjs. Zaktualizowałem moje pytanie – user727507

+0

Proszę, zrób skrzypce –

Odpowiedz

-6

miałem ten sam problem i wreszcie jestem tworzyć własne dyrektywy:

angular.module('openselect', []) 
    .directive('openselect', function() { 
     var showDropdown = function (element) { 
      var event; 
      event = document.createEvent('MouseEvents'); 
      event.initMouseEvent('mousedown', true, true, window); 
      element.dispatchEvent(event); 
     }; 
     return { 
      restrict: 'A', 
      scope: { 
       'elemento': '@' 
      }, 
      link: function (scope, elem, attrs, ctrl) { 
       elem.bind('click', function() { 
        var elemento = document.getElementById(scope.elemento); 
        showDropdown(elemento); 
       }); 
      } 
     }; 
    }); 

używać:

<div style="position:relative"> 
<span ng-show="submittedForm.contry.$error.required && co_form.contry.$error.required" class="label label-danger">Indicanos tu país</span> 
<select name="country" class="form-control input-md" ng-model="formCheckout.country" id="myCountry" placeholder="España" required> 
    <option value="6" selected="selected">España</option> 
    <option value="1">Alemania</option> 
    <option value="15">Portugal</option> 
</select> 
<span class="glyphicon glyphicon-chevron-down" style="position: absolute; right: 10px; color: #A6A6A6; top: 18px;" openselect elemento="myCountry"></span> 

dyrektywy dodaje do każdego tagu przechodzącą id select (Elemento), które chcesz otworzyć.

Możesz zobaczyć bardzo podstawowy kod javscript w dyrektywie, jeśli chcesz użyć go w innym kontekście;

nadzieję, że pomoże; D

+5

jego niehonorowość, aby skopiować kogoś innego geniuszu rozwiązanie, papuga to jak własne i nie dać im żadnych kredytów. – r3wt

+0

To pełna hańba. –

0

spróbować tej

function openSelect(selectId) { 
 
    var event = new MouseEvent('mousedown', { 
 
     'view': window, 
 
     'bubbles': true, 
 
     'cancelable': true 
 
    }); 
 
    var cb = document.getElementById(selectId); 
 
    cb.size=4; 
 
    cb.dispatchEvent(event); 
 
} 
 
openSelect("testId");

lub przeczytać więcej tutaj Triggering built-in events

+0

Nie działa dla mnie w przeglądarce Firefox, tylko w Chrome. Jaki jest problem? –

+0

Drogi Karel, testuję go na Firefoxie, działa. Może być błąd javascript? – haste

0

Odpowiedź udzielana przez haste nie działa:

var cb = element[0].getElementsByClassName('some-selector')[0]; 
var event = new MouseEvent('mousedown', { 
    'view': window, 
    'bubbles': true, 
    'cancelable': true 
});       
cb.dispatchEvent(event); 

używam bardziej prostą metodę:

var cb = element[0].getElementsByClassName('some-selector')[0]; 
angular.element(cb).triggerHandler('click');