2016-11-15 1 views
0

Ich bin hier seit Stunden festgefahren. Ich muss herausfinden, welcher Wert in der Dropdown-Liste nach dem Klicken ausgewählt wird. Alle Zeilen werden dynamisch wie dieses Bild generiert. all the rows are dynamically generatederhalten Wert eines Dropdown-Menüs mit plain Javascript aus einer dynamisch generierten Zeile

Ich kann den Kind-Knoten und die HTML bekommen, aber kann nicht den ausgewählten Wert erhalten. Mein Code bisher.

var parent_element=e.parentElement.parentElement.parentElement.previousSibling.previousSibling.previousSibling.previousSibling; 
var selected_element = parent_element.childNodes[1].getElementsByClassName('selectpicker'); 
    console.log(selected_element); 

Html-Struktur. Jede Hilfe wird geschätzt. Vielen Dank im Voraus

<div class="col-md-12 neighbourhood-data neighbour-2"> 
    <div class="row"> 
     <div class="col-md-2"> 
      <select name="" class="selectpicker form-control" data-live-search="true"> 
       <option value="">--Select One--</option> 
       <option value="1">One</option> 
       <option value="2">Two</option> 
       <option value="3">Three</option> 
       <option value="4">Four</option> 
      </select> 
     </div> 
     <div class="col-md-1"> 
      <input type="text" class="form-control" placeholder="Distance"> 
     </div> 
     <div class="col-md-8"> 
      <div class="row"> 
       <div class="col-md-2"> 
        <button type="button" class="btn btn-info" onclick="getDistanceLocation(this)">Get distance from google</button> 
       </div> 
       <div class="col-md-10"> 
        <div class="row text-center"> 
         <div class="col-md-2"> 
          <input type="checkbox" checked="checked"> 
         </div> 
         <div class="col-md-2"> 
          <input type="checkbox"> 
         </div> 
         <div class="col-md-2"> 
          <input type="checkbox"> 
         </div> 
         <div class="col-md-2"> 
          <input type="checkbox"> 
         </div> 
         <div class="col-md-2"> 
          <input type="checkbox"> 
         </div> 
         <div class="col-md-2"> 
          <input type="checkbox"> 
         </div> 
         </div> 
        </div> 
       </div> 
      </div> 
      <div class="col-md-1"> 
       <button type="button" class="btn btn-danger neighbourhood-remove-button">Remove</button> 
      </div> 
     </div> 
     </div> 
+0

Mögliches Duplikat [ausgewählten Wert in Drop-Down-Liste mit JavaScript Get?] (Http://stackoverflow.com/questions/1085801/get-selected-value-in-dropdown-list -using-javascript) –

+0

Ich kann hier keine ID angeben, da es mehrere Zeilen mit den gleichen Elementen geben wird. Ich muss den Wert erhalten, nachdem die Schaltfläche innerhalb dieser Zeile angeklickt wurde. – Amir

Antwort

0
var value = selected_element.options[selected_element.selectedIndex].value; 
+0

versuchte das schon, aber uncaught typeerror bekommen. kann nicht lesen Eigenschaft von undefined – Amir

0

Sie müssen nur den Wert Eigenschaft von dem Element. Hier ist ein Licht Beispiel:

function getValue() { 
 
    var el = document.querySelector('#selecty'), 
 
     val = el.value; 
 
    alert("You picked: " + val) 
 
}
<select id='selecty'> 
 
    <option value="1">One</option> 
 
    <option value="2">Two</option> 
 
    <option value="3">Three</option> 
 
</select> 
 

 
<button onclick="getValue()">What did I pick?</button>

+0

Kann ID hier nicht verwenden, wird es mehrere Zeilen mit den gleichen Elementen geben, wie die Zeile dynamisch generiert. Ich habe den Benutzercode geändert. var val = e.querySelector ('. Selectpicker'), val = val.value; Warnung ("Sie haben ausgewählt:" + val); Aber bekommen Uncaught TypeError: Kann Eigenschaft 'Wert' von Null nicht lesen – Amir

+0

Egal wie Sie das Element abrufen, war die ID nur ein Beispiel. Aber klingt, als ob dein Selektor nicht funktioniert hat, bist du sicher, dass du dort die passende Klasse hinzugefügt hast? – casraf

+1

müssen Sie 'val.options [selected_element.selectedIndex] .value' ausführen, weil die Variable' val' den '