0

Eu tenho o código abaixo para carregar as cidades:

$(function(){
        $('#cod_estados').change(function(){
            if( $(this).val() ) {
                $('#cod_cidades').hide();
                $('.carregando').show();
                $.getJSON('cidades.ajax.php?search=',{cod_estados: $(this).val(), ajax: 'true'}, function(j){
                    var options = '<option value=""></option>'; 
                    for (var i = 0; i < j.length; i++) {
                        options += '<option value="' + j[i].cod_cidades + '">' + j[i].nome + '</option>';
                    }   
                    $('#cod_cidades').html(options).show();
                    $('.carregando').hide();
                });
            } else {
                $('#cod_cidades').html('<option value="">– Escolha um estado –</option>');
            }
        });
    });

e o formulário:

<label for="cod_cidades">Cidade:</label>
    <span class="carregando">Aguarde, carregando...</span>
    <select name="cod_cidades" id="cod_cidades">
        <option value="">-- Escolha um estado --</option>
    </select>

ele funciona perfeitamente só que eu preciso fazer um select que traga as opções do banco e caso não haja a opção desejada pela pessoa ela possa adicionar, e quando isso acontecer eu atualizar somente o select.

3
  • seria tipo, ter um botão ao lado do select para o usuário adicionar uma nova opção ao select e seria salva no banco? Commented 19/07/2016 às 23:36
  • @fernandoandrade exatamente isso só que este código ai carrega no evento change ou seja depende da mudança de outro combo e o que eu tenho que fazer ele tem que abrir normal e só atulizar se o usuário adicionar algo mais no banco.
    – opeta
    Commented 19/07/2016 às 23:41
  • Você pode montar esse combo logo com o php e fazer uma função que recarregue ele caso o usuário adicione novas opções, já deixando selecionada a nova opção. Commented 19/07/2016 às 23:45

1 Resposta 1

1

Seria algo assim, poderia abrir um modal ou um outro formulário para o usuário informa o novo valor e ao salvar recarregaria o select.

$('#btn_adicionar').click(function(event) {
    event.preventDefault();
    $.ajax({
        url: 'salvar_cidade.ajax.php',
        type: 'POST',
        dataType: 'json',
        data: {cod_estados: estado, cod_cidades: novo_cod_cidade},
    })
    .done(function(j) {
        if (j.status) {
            recarregarCombo($('#cod_cidades'), estado, j.cod_cidades);
        } else {
            alert('Erro ao salvar nova cidade');
        }
    })
    .fail(function() {
        console.log("error");
    });

});

/**
 * recarrega as opções do select passado
 * @param  id_select seletor do combo que será recarregado
 * @param  {[type]} cod_estados    cod_estado para fazer a busca
 * @param  {[type]} valor_selected valor que será marcado no select
 * 
 */
function recarregarCombo($select, cod_estados, valor_selected) {
    $.getJSON('cidades.ajax.php?search=',{cod_estados: cod_estados, ajax: 'true'}, function(j){
        var options = '<option value=""></option>';
        for (var i = 0; i < j.length; i++) {
            var selected = j[i].cod_cidades == novo_valor ? 'selected' : '';
            options += '<option value="' + j[i].cod_cidades + '" '+ selected +' >' + j[i].nome + '</option>';
        }
        $select.html(options).show();
        $('.carregando').hide();
    });
}

Não se só esse valores bastam para salvar seu novo valor, mas aí você adiciona os que faltam

1
  • espero que te der uma ideia de como fazer Commented 20/07/2016 às 0:11

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .