Ottieni il valore selezionato del menu a discesa di carta

Sto utilizzando il polimero paper-dropdown-menu come menu a discesa per il mio progetto. Ora voglio ottenere il valore dell'opzione selezionata, quando un utente seleziona un'opzione dal menu a discesa.Ottieni il valore selezionato del menu a discesa di carta

Ecco la struttura HTML

<paper-dropdown-menu label="Color" class="text-color-labels"> 
    <paper-dropdown class="dropdown"> 
     <core-menu class="menu" id="textColor"> 
      <paper-item value="#000000">Black</paper-item> 
      <paper-item value="#522A19">Dark Brown</paper-item> 
      <paper-item value="#7D331E">Light Brown</paper-item> 
      <paper-item value="#EDCCBA">Tan</paper-item> 
      <paper-item value="#B89325">Old Gold</paper-item> 
      <paper-item value="#B7A967">Vegas Gold</paper-item> 
      <paper-item value="#29753A">Kelly Green</paper-item> 
     </core-menu> 
    </paper-dropdown> 
</paper-dropdown-menu>

ho cercato di ottenere il valore utilizzando questo codice:

$("body").on("core-select", ".text-color-labels", function(){ 
    var selectedItem = document.querySelector('#textColor').selectedItem; 
    var selectedColor = selectedItem.textContent; 
    console.log(selectedColor); //gives Black, Dark Brown, Light Brown etc 
})

Ma non mi dà il valore della discesa. Come ottenerlo?

fonte

2015-04-30 Kanav

Se 'core-select' è un evento dal quadro che sarebbe possibile che il valore selezionato passi alla funzione di callback come parametro ?! – marcel

Se questo è il [collegamento] corretto (https://github.com/Polymer/core-selection/blob/master/core-selection.html#L121) a questa libreria, sembra che quando questo 'core-select' evento viene generato, inoltre invia 'item' con esso:' this.fire ("core-select", {isSelected: isSelected, item: item}); ' –

La prima cosa che ho letto sul documento è che puoi accedere l'oggetto selezionato con 'detail.item'. L'evento verrà attivato quando un elemento è stato selezionato E deselezionato, quindi dovresti controllare anche con 'detail.isSelected' – marcel

In Polymer 1.0 è possibile utilizzare l'attributo on-iron-select in paper-dropdown-menu. Per esempio: la funzione

<paper-dropdown-menu label="Color" class="text-color-labels" on-iron-select="_itemSelected">

Polimero:

_itemSelected : function(e) { 
    var selectedItem = e.target.selectedItem; 
    if (selectedItem) { 
     console.log("selected: " + selectedItem.innerText); 
    } 
    },

fonte

2015-08-17 13:04:57

Non utilizzare selectedItem, preferisci usare var selectedId = e.target.selected; – Dimitrii

Aggiornamento gestore vostro evento come così:

$("body").on("core-select", ".text-color-labels", function(e) { 
    var selectedItem = e.target.selected, 
     selectedColor = selectedItem.textContent; 
    console.log(selectedColor); //gives Black, Dark Brown, Light Brown etc 
})

fonte

2015-04-30 08:28:15

<paper-dropdown-menu label="Color" class="text-color-labels" on-iron-select="_itemSelected">

Se si desidera che il valore dell'elemento selezionato:

_itemSelected : function(e) { 
    var selectedItem = e.target.selectedItem; 
    if (selectedItem) { 
     console.log("selected: " + selectedItem.value); 
    } 
}

fonte

2016-09-22 19:49:11

Ottieni il valore selezionato del menu a discesa di carta

risposta

Problemi correlati