How to know which select option has been selected

Question

I have a <select> and I need to know which <option> was selected.

<select class="formacao">
        <option>Ensino fundamental incompleto</option>
        <option>Ensino fundamental completo</option>
        <option>Ensino médio incompleto</option>
        <option>Ensino médio completo</option>
        <option>Ensino Superior</option>
</select>

I tried to solve here but jQuery just returns me the value of the first option.

I need to know when the "Higher Education" option is selected

Answer 1

Like something like that:

var conceptName = $('#aioConceptName').find(":selected").text();

You could still do it direct in javascript:

var box = document.getElementById('aioConceptName');

conceptName = box.options[box.selectedIndex].text;

Answer 2

Could include a value for each option as for example

    <select class="formacao">
            <option value="1">Ensino fundamental incompleto</option>
            <option value="2">Ensino fundamental completo</option>
    </select>

To get the text You can use

    //caso estivesse no primeiro item
    $('.formacao option:selected').text() // para texto (Ensino fundamental incompleto)
    $('.formacao').val() // para valor (1)

https://learn.jquery.com/using-jquery-core/faq/how-do-i-get-the-text-value-of-a-selected-option/

Answer 3

For the purpose of helping others, follow the full example:

$(document).ready(function () {

    $('#formacao').change(function () {

        var es = document.getElementById('formacao');

        esValor = es.options[es.selectedIndex].value;

        alert(esValor);
    });

});