Reading selected value from dropdownlist dynamically

Question

I have two columns in my table and I need dynamically to read their values and store them in to array (myCollection).

$(function() {
    $('#myButton').on('click', function() {

        var myCollection = [];

        $('#MainContent_gvKarakteristike tbody').find('tr:gt(0)').each(function(i, e) {
            var row = $(e);
            myCollection.push({
                label: valuefromType(row.find(row.find('td:eq(1)').children())),
                opis: valuefromType(row.find(row.find('td:eq(2)').children()))
            });
        });

        console.log(myCollection);

        function valuefromType(control) {
            var type = $(control).prop('nodeName').toLowerCase();

            switch (type) {
                case "input":
                    return $(control).val();
                case "span":
                    return $(control).text();
                case "select":
                    return $(control).val();
            }
        }
    });
});

When I execute the code this is the result in the console (I entered some values in to the second column):

0: Object { label: "1", opis: "test55" }

1: Object { label: "2", opis: "test66" }

2: Object { label: "5", opis: "3" }

3: Object { label: "6", opis: "2" }

4: Object { label: "9", opis: "test77" }

Everything works fine but instead values "3" and "2" I need selected names in those two drop downs to be shown (Prolom Lacquer, 1 Strip).

Justinas · Accepted Answer

Use this selector to get selected option:

$('option:selected', control)

and you will have what you need. Next call .text() to get option text:

$('option:selected', control).text();

$(function() {
  $('#myButton').on('click', function() {

    var myCollection = [];

    $('#MainContent_gvKarakteristike tbody').find('tr:gt(0)').each(function(i, e) {
      var row = $(e);
      myCollection.push({
        label: valuefromType(row.find(row.find('td:eq(1)').children())),
        opis: valuefromType(row.find(row.find('td:eq(2)').children()))
      });
    });

    function valuefromType(control) {
      var type = $(control).prop('nodeName').toLowerCase();

      switch (type) {
        case "input":
          return $(control).val();
        case "span":
          return $(control).text();
        case "select":
          alert('Selected text:' + $('option:selected', control).text());
          return $('option:selected', control).text();
      }
    }
  });
});




  
    Karakteristike
     
    Opis
  
  
    
      GRP Total_Thickness


    
    
      1


    
    



      


    
  
  
    
      GRP Wear Layer thickness


    
    
      2


    
    



      


    
  
  
    
      GRP Surface treatment



    
    
      5


    
    

      




    
  
  
    
      GRP Pattern



    
    
      6


    
    

      




    
  
  
    
      GRP PIM product hierarchy



    
    
      9

Reading selected value from dropdownlist dynamically

Answers (1)

Related Questions