Filter states and cities from library cities-states-js

Question

Filter states and cities from library cities-states-js

Asked 9 years ago

Viewed 3,577 times

2

The code below is working perfect (using city-states-js), I wish only the state of Minas Gerais and São Paulo, how do I do?

<script type="text/javascript" src="http://cidades-estados-js.googlecode.com/files/cidades-estados-1.2-utf8.js"></script> 
<script type="text/javascript">
window.onload = function() {

  new dgCidadesEstados({
    estado: document.getElementById('estado'),
    cidade: document.getElementById('cidade'),
     estadoVal: '<%=Request("estado") %>',
     cidadeVal: '<%=Request("cidade") %>'
  });
}
</script>


</head>
<body>    
<form id="sistema" name="sistema" method="post" action="">
<label>Estado</label>
    <select id="estado" name="estado"></select>
    <label>Cidade</label>
    <select id="cidade" name="cidade"></select>
</form>
</body>

2 answers

4

Why don’t you erases states you don’t want? This saves your users 60 kB of bandwidth.

In the link above you have a version where I deleted the other states. You can copy and serve the file from your server. The result is this: http://jsfiddle.net/w938st7q/

I’m sorry but I don’t know how to do it. I’m learning there’s no way I can help myself. ?

– ALEX BROOK

2015/06/17 at 20:31
1

@ALEXBROOK takes a fresh look at the answer. (ctgPi: edited, changes if you find wrong, +1)

– Sergio

2015/06/18 at 07:38
It was excellent was just what I wanted. Sérgio only now needed to redirect the user once he chose the city to a page

– ALEX BROOK

2015/06/20 at 18:21

Browser other questions tagged javascript

You are not signed in. Login or sign up in order to post.

by Guilherme Nascimento • **98,651** points · Answer 1 · 2015-06-18T03:16:29+00:00

I suggest that after executing dgCidadesEstados, you can use removeChild, for this it will be necessary two loops and a if, example:

Note: recommend updating the library to version 1.4 (27/05/2015 - now it’s maintained on github) github and googlecode are not hosts (cdns) of codes, I recommend that you copy the .js to your server

var estados = document.getElementById('estado');
var cidades = document.getElementById('cidade');
    
cidades.onchange = function()
{
    if (cidades.value !== "") {
        //Para o redirecionamento troque esta linha por window.location
        //veja o exemplo no final da resposta para ter um exemplo
        alert(estados.value + " - " + cidades.value);
    }
};

new dgCidadesEstados({
    estado: estados,
    cidade: cidades,
    estadoVal: '<%=Request("estado") %>',
    cidadeVal: '<%=Request("cidade") %>'
});

var opts = estados.getElementsByTagName("option");
var i = 0, j = opts.length, e, remove = [];

for (; i < j; i++) {
    e = opts[i];
    if (e.value !== "" && e.value !== "MG" && e.value !== "SP") {
        //Pega o elemento que será removido e adiciona ao vetor/array
        remove.push(e);
    }
}

i = 0;
j = remove.length;

for (; i < j; i++) {
    //Remove todos que são diferentes de Minas Gerais, São Paulo e vazio (este ultimo equivale ao "Selecione um estado")
    estados.removeChild(remove[i]);
}

<script src="//rawgit.com/robertocr/cidades-estados-js/master/cidades-estados-1.4-utf8.js"></script>
<select id="estado"></select>
<select id="cidade"></select>

If you want to redirect after selecting the city, use the event change, as in the example the beginning of the code should look like this (/a/70297/3635):

window.onload = function() {
    var estados = document.getElementById('estado');
    var cidades = document.getElementById('cidade');

    cidades.onchange = function()
    {
        if (cidades.value !== "") {
            //Basta modificar está linha conforme a necessidade
            window.location = "pagina.asp?estado=" + estados.value + "&cidade=" + cidades.value
        }
    };

    new dgCidadesEstados({
        estado: estados,
        cidade: cidades,
        estadoVal: '<%=Request("estado") %>',
        cidadeVal: '<%=Request("cidade") %>'
    });

    var opts = estados.getElementsByTagName("option");
    var i = 0, j = opts.length, e, remove = [];

    for (; i < j; i++) {
        e = opts[i];
        if (e.value !== "" && e.value !== "MG" && e.value !== "SP") {
            //Pega o elemento que será removido e adiciona ao vetor/array
            remove.push(e);
        }
    }

    i = 0;
    j = remove.length;

    for (; i < j; i++) {
        //Remove todos que são diferentes de Minas Gerais, São Paulo e vazio (este ultimo equivale ao "Selecione um estado")
        estados.removeChild(remove[i]);
    }
};