Skip to content

Instantly share code, notes, and snippets.

@felipecolen

felipecolen/gist:8464cd59e9f0ad20b9e67fbb3480fb3b

Last active December 6, 2017 16:14
Show Gist options
  • Save felipecolen/8464cd59e9f0ad20b9e67fbb3480fb3b to your computer and use it in GitHub Desktop.
Save felipecolen/8464cd59e9f0ad20b9e67fbb3480fb3b to your computer and use it in GitHub Desktop.
Download ZIP
Select estado cidade via ajax jquery
Raw
gistfile1.txt
# no arquivo views.py
# recebe o ID do estado selecionado
def busca_cidades(request): # para selecionar o estado e repassar somente as cidades do estado selecionado
id = request.GET.get('id')
lista = Cidade.objects.filter(estado__id=id)
if lista.count() > 0:
lista_json = serializers.serialize("json", lista, fields=('id', 'cidade'))
else:
lista = [{"pk": "0", "fields": {'cidade': "Nenhum registro"}}]
import json
lista_json = json.dumps(lista)
return HttpResponse(lista_json, "application/json")
--------------------------------------------------------------------------------------------
# no urls
url(r'^busca_cidades/$', app_selecao.views_cadastro.busca_cidades),
--------------------------------------------------------------------------------------------
# no template html
<div class="col s12">#}
<div class="select-wrapper input-field col s4">
Endereço Estado
<select id="id_endereco_estado" name="endereco_estado" required>
<option value="" disabled selected>Selecione</option>
{% for uf in UFS %}
<option value="{{ uf.id }}">{{ uf.uf }}</option>
{% endfor %}
</select>
</div>
<div class="select-wrapper input-field col s8">
Endereço Cidade
<select id="id_endereco_cidade" name="endereco_cidade" required>
<option value="" selected>Escolha a Cidade</option>
</select>
</div>
</div>
<script>
$(document).ready(function(){
$('#id_endereco_estado').change(function(){
var $selectDDMaterial = $("#id_endereco_cidade").empty().html(' ');
$selectDDMaterial.append(
$("<option></option>").attr("value", "0").text("Selecione a Cidade")
);
var vId = $('#id_endereco_estado').val();
$.ajax({
url:'../../busca_cidades/?id='+vId,
datatype : 'json',
success:function(data,textStatus, XHR){
$selectDDMaterial = $("#id_endereco_cidade").empty().html(' ');
for(var i=0;i<data.length;i++){
$selectDDMaterial.append(
$("<option></option>").attr("value", data[i].pk).text(data[i].fields.cidade)
);
}$selectDDMaterial.trigger('contentChanged');
}
});
});
$('select').on('contentChanged', function() {
// re-initialize (update)
$(this).material_select();
});
});
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment