Filter states and cities from library cities-states-js

Asked

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>
javascript

2 answers

6

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]);
    }
};

  • But could you help me William ? I opened another question.

  • William I’m very bad at this sorry guy.. but I needed a real example. Should then delete new dgCidadesStates({ status: Document.getElementById('state'), city: Document.getElementById('city'), stateVal: '<%=Request("state") %>', cityVal: '<%=Request("city") %>'

  • William I apologize, as I told you I am learning now and I was very confused when he asked me to use the removeChild. I used this other code here (http://jsfiddle.net/w938st7q/) and it works better. I was able to remove the cities and manually insert them into the file.

  • Dear William, we are lay people seeking knowledge through another who has it. I’m sorry if you can’t understand and be patient about what we’re doing here.

  • 2

    @ALEXBROOK I’m not upset about your lack of knowledge, I’m upset that I provided you an example of REDIRECTING, you didn’t even say if it worked or not, I tried to guide you, and you insisted that the code ONLY removed the states, even though I explained that it also did the redirect. Now if you had said "William made such a mistake" or "William is not redirecting", I would have understood, but even this you reported. Alex I’m a nice person who was just trying to help you. That’s all.

4


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

  • 1

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

  • 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

Browser other questions tagged javascript

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