Question

I was wondering if someone could help me with a simple question?
i have a dropdown list when i select an item, i want to get the value from it using jquery.
I use the .val() method, but the issue is the items value has a space in it such as “Type A”
and it only returns “Type” leaving out the A. I want the full text how could i accomplish this?

Updated code:

XML:

<?xml version="1.0" encoding="ISO-8859-1"?>

<categories>
<category type='Type A'>
    <genre>1</genre>
    <genre>2</genre>
</category>
<category type='Type B'>
     <genre>3</genre>
     <genre>4</genre>
     <genre>5</genre>
</category>
<category type='Type C'>
    <genre>6</genre>
</category>
</categories>

Full jQuery Code:

$.ajax({
        type: "GET",
        url: "myxml.xml",
        dataType: "xml",
        success: function(data){
            xml = data;
            });
        }
    });

    return {getXml : function() 
    { 
        if (xml) return xml;
    }};
})();

/* On Category Change */
$(".category").change(function(){
    var type = $(this).val();
    alert(type);
});

HTML

<select class='category'>
</select>

Thanks in advance!

Answer 1

There is a difference between text and value. It sounds like you want the text that is visible in the option , not the value of it which is not visible.

$(".category").change(function(){
    var type = $(this).val();

    var currSelectedText= $(this).find('option:selected').text();
    alert(currSelectedText);
});