<script type="text/javascript">
    /* GEO */
    $(document).on("ready", function(){

        var $estados = $("#estados");
        var $municipios = $("#municipios");

        $.post('/geo/estados', function(data, textStatus, xhr) {
            $.each(data, function(index, val) {
                var option = '<option value="' + val.id +'">' + val.estado +'</option>';
                $estados.append(option);
            });
        },'json');

        $estados.on("change", function(){
            var id = $(this).val();
            resetMunicipios();
            $.post('/geo/estado/' + id, function(data, textStatus, xhr) {
                $.each(data, function(index, val) {
                    var option = '<option value="' + val.id +'">' + val.ciudad +'</option>';
                    $municipios.append(option);
                });
            },'json');
        });

        function resetMunicipios(){
            $municipios.empty();
            var option = '<option> -- Seleccione --</option>';
            $municipios.append(option);
        }
    });
</script>