Este foro ya no está activo, así que no puedes publicar nuevas preguntas ni responder a las preguntas existentes.

Formularios dinámicos

25 de noviembre de 2015

Hola

Estoy tratando de hacer un formulario que sirve para filtrar los datos de un reporte. Este formulario no está hecho con clases en Symfony2. Y en un comienzo carga ciertos datos predefinidos en varios <select>, pero luego, debe mostrar otros <select> según los datos que se hayan ido seleccionado.

Lo complejo está, en que estos <select> se van cargando a medida que se seleccionan los <select> definidos anteriormente. Es como, el típico ejemplo, seleccione el país, luego carga la estado/provincia y luego la ciudad.

Los datos debo cargarlos desde una base de datos. Estuve leyendo por ahi, que con jQuery y Ajax se puede hacer. Y que Symfony tiene varios Listener para formularios. Pero toda la información está refenciada a formularios con entidades, y yo no estoy trabajando asi.

Me vendría bien un poco de ayuda

Gracias


Respuestas

#1

Como no estás usando los formularios de Symfony, resolver este problema es "muy sencillo". Sólo tienes que seguir los pasos de cualquier tutorial que explique cómo hacer <select> encadenados con Ajax.

Lo único que toca a Symfony es hacer la consulta a la base de datos para obtener los datos de los <select>. Para ello, crea controladores normales y usa $request->isHttpXmlRequest() para saber si estás recibiendo una petición Ajax. Además, usa JsonResponse() en vez del Response normal para devolver los resultados a la petición Ajax, ya que lo típico es usar JSON para intercambiar información.

@javiereguiluz

25 noviembre 2015, 21:41
#2

Si usas los formularios de Symfony, puedes usar este bundle

@ramiroanacona

26 noviembre 2015, 14:05
#3

Hola, añado más info. a la respuesta de @javier,

acá te paso un código de ejemplo que espero encuentres de utilidad.

jQuery y Ajax.

Desde el lado del controller debes hacer lo sig. Agregar: use Symfony\Component\HttpFoundation\Response;

public function myMethodAction(){
        $em = $this->getDoctrine();
        $entities = $em->getRepository('NotificacionesBundle:Mensaje')->findBy(array('estado'=>1));
 
        if(count($entities) > 0){
 
/*
         Lógica de Ejemplo:
         $data_array = array("Prov. 1","Prov. 2","Prov. 3","Prov. 4", "Prov. 5");
*/
 
        }
 
        $return = array("result" => 200, "provincias_array"=> $data_array);
        $response = new Response(json_encode($return));
        $response->headers->set('Content-Type', 'application/json');
 
        return $response;
    }

Desde la plantilla Twig.

$('#cbPais').change(function(e){
e.preventDefault();
var path = "{{ path('ajax_entity', { 'idEntity': '?1', 'entidad': '?2', 'atributo': '?3' }) }}";
                path = path.replace('%3F1', idEntity);
                path = path.replace('%3F2', 'Provincia');
                path = path.replace('%3F3', 'pais');
               $.ajax({
                        type: "POST",           // tipo de consulta: POST/GET
                        url: path,      // URL o routing.
                        beforeSend: function(){ // ejecuta alguna acción antes de enviar el request.
                            $('#spinner_pais').show();
                        },
                        success: function(data){  // cuando es exitoso el resultado.
 
                            if(data.result !== 200){
                                 alert("Ops... Algo ha salido mal!");
                            }else{
                                cargarComboProvincias(data.provincias_array);
                            }
                        }
                })
                .fail(function(data){
                    alert("Ops... Algo ha salido mal!");
                })
                .always(function(data){
                    setTimeout(function(){
                        $('#spinner_pais').hide();
                    }, 500);
                });
});
 
function cargarComboProvincias(provincias_array){
  // Code...
}

Bueno espero te sirva! :)

@MrXXX0323

26 noviembre 2015, 21:23
#4

Muchas gracias por su ayuda.

Voy a probar las opciones que me dejaron y comento como me fue.

Saludos

@Enzo_B16

26 noviembre 2015, 22:21
#5

Me funciona a media. Me realiza la llamada, obtengo los datos desde el controlador, genero la respuesta en json. Pero no me carga el <select>. Symfony me devuelve los datos en JSON, pero no me carga el select en la vista (Twig). Dejo el codigo para que lo revisen.

<script type="text/javascript">
 $(document).ready(function(){
          //select de paises
     $("#form_paises").change(function(){
            var idComboPaises = $(this).val();
            $.ajax({
 
                type: "GET",
                url: "{{ path('ajax_path') }}" ,
                dataType: "json",
                traditional: true,
                data: {id: idComboPaises},
                success: function(json) {
                    $("#form_ciudades").html(json);//carga los datos en el select de ciudades
                } 
            });
        });
 });
</script>

@Enzo_B16

27 noviembre 2015, 14:20
#6

La carga de datos debes hacerla tu, es decir, nada se resuelve magicamente, todo hay que programarlo par que funcione como se espera.

lo que te está faltando es en el success, desarrollar una función que lea el json y cargue a través de código JS el combo ed ciudades que estás necesitando.

sería algo así:

success: function(data){
         if(data.result !== 200){
                                 alert("Ops... Algo ha salido mal!");
                            }else{
                                cargarComboProvincias(data.provincias_array);
                            }
}
 
function cargarComboProvincias(provincias_array){
  if(provincias_array.length > 0){
     for(var i=0; i < provincias_array.length; i ++){
       var option = " <option id=" + provincias_array[i].id ">" + provincias_array[i].nombre + "</option>";
       $("#form_ciudades").append(option);
     }
  }
}

@MrXXX0323

1 diciembre 2015, 14:31