How to send via ajax the value of the selected option in a select?

-1

I have two selects, one for states and one for cities.

I want to get the value of the select state with the change event, send it via ajax, and retrieve cities that has the corresponding value.

The only error you are giving in my code is to say that the variable I send via post is undefined

Here are the codes and the error:

<select name="Estado" id="estado" class="campo selectEstado form-control">
    <option value="">Selecione seu estado</option>
    // Outros options
 </select>

<select name="Cidade" id="cidade" class="campo selectCidade form-control">
    <option value="">Selecione sua cidade</option>
    // Outros options
 </select>


$('#estado').on('change',function(){
        var uf = $("#estado option:selected").val();
        $.ajax({
            type: "POST",
            url: "scripts/retornaMunicipio.php",
            data: uf,
            success:function(data){
            data = $.parseJSON(data);
            $.each(data.retorno, function (i) {
                // código
             });

                                    },
            error:function(data){
            }
        });
    });

File returnsMunicipal.php

$uf = $_POST["uf"];
// Esse uf não está sendo definido

The following is the error:

PHP Notice:  Undefined index: uf in C:\inetpub\teste\httpdocs\retornaMunicipio.php on line 15

My only problem is this, this $uf variable is not getting the value sent by ajax. The paths of the files are right. How can I resolve this?

    
asked by anonymous 11.08.2016 / 21:44

1 answer

2

Try this:

     $.ajax({
        type: "POST",
        url: "scripts/retornaMunicipio.php",
        data: {uf: uf},
        success:function(data){
           data = $.parseJSON(data);
           $.each(data.retorno, function (i) {
            // código
           });
        },
        error:function(data){
        }
    });
    
11.08.2016 / 21:48