Automatically select a select and press the button

Question

I got a field like <select>/<option> that when the user selects a value I call a function to popular another <select>, type the state and city combos, this is working, and then the user clicks on a button that makes an ajax call to bring some data to display.

What I need and I don’t know is when I get this first one <select> only one value, already selected, so make the call for that second select and already press the button even without the user select this second select.

For example, I have a select from another city state and a button. By selecting a state the user can already press the button or select a city and press the button, only when there is only one state already selected this state and also already trigger this button, giving only the user the option to select a city and then press the button.

I hope I haven’t been too confused and you can understand so you can help me.

<label for="estado">
<select>
    <option value="0"> ---Selecione--- </option>
    <option value="SP"> São Paulo </option>
</select>

<label for="cidade">
<select>
    <option value="0"> ---Selecione--- </option>
</select>

<button type="submit" id="listarItens">Buscar</button>

In this case if you only have the State of São Paulo already select and trigger the Search button, remembering that I have a function created that when the user selects the state calls this function.

$(document).ready(function() {
    changeSelect('estado', ['cidade'], 'selecionaCidades.php');

    $('#listarItens').click(function(event){
        event.preventDefault();
        //aqui executa algumas coisas como um ajax, mas isso acho que não preciso listar correto
    });


});

I don’t know if I need to pass all structure of this changeSelect function right.

Answer 1

Test use so to know if a select has only one option:

$('select').each(function () {
    var options = $(this).find('option');
    var qtdOptions = options.length;
    if (qtdOptions == 2)  {      // uso dois porque a sua primeira option é só uma guia
        this.selectedIndex = 1;  // escolher a segunda option
        $("select[name='estado']").change();
        $('#listarItens').trigger('click');  // carregar no botão!
    }
});

Example

This code searches all selects and if any have only one option (maybe wanted to use ==2 since it has the neutral text ---Selecione---). If you do not want to search all selects the code can be simpler.