Foros del Web » Programando para Internet » Jquery »

Problema para obtener archivos de campos dinamicos

Estas en el tema de Problema para obtener archivos de campos dinamicos en el foro de Jquery en Foros del Web. Hola, espero alguien me pueda colaborar con mi dilema, la cuestion es la siguiente, tengo un formulario que se genera desde una base de datos, ...
  #1 (permalink)  
Antiguo 15/07/2014, 09:05
Avatar de sofranco  
Fecha de Ingreso: junio-2013
Mensajes: 8
Antigüedad: 10 años, 10 meses
Puntos: 0
Pregunta Problema para obtener archivos de campos dinamicos

Hola, espero alguien me pueda colaborar con mi dilema, la cuestion es la siguiente, tengo un formulario que se genera desde una base de datos, este formulario establece unos campos tipo FILE, a su vez hay un boton para agregar mas campos FILE dinamicamente mediante Jquery, todo esto hasta el momento me funciona de maravilla, el problema lo tengo al momento de obtener los archivos que se adjuntan, solo me aparece el primer archivo adjunto pero no carga ninguno de los generados dinamicamente. Primero crei que era problema del envio de archivos o el formulario, o que simplemente no estaba obteniendo bien los datos pero al intentar mostrar todos los datos enviados por $_FILES solo me muestra el primero, entonces el envio se realiza, los datos se reciben normalmente, pero los campos dinamicos son los unicos que no envian los datos, asi que creo que el error esta en la creacion de estos o el envio con ajax. Espero alguien me pueda orientar un poco sobre esto.

Este es el codigo PHP utilizado para crear el formulario:
Código PHP:
<?php
echo "<form method='POST' id='QuestionsINF' name='QuestionsINF'>";
$BD mysql_fetch_array(mysql_query("SELECT * FROM check_list WHERE check_list_id='".$_POST['id']."'"));
while (
$SQrow mysql_fetch_array($SelectQuestions)) {
    
$QSbd "check_list_infraestructura_preg".$SQrow['orden'];
    echo 
"<tr>";
    echo 
"<td><b>".$SQrow['orden']."</b></td>";
    echo 
"<td>".$SQrow['pregunta']."</td>";
    
$DatosPPV = array("SI"=>"SI","NO"=>"NO");
    echo 
"<td><select name='INF-".$SQrow['orden']."' id='INF-".$SQrow['orden']."'>
    <option value=''>SELECCIONAR</option>"
;
    foreach(
$DatosPPV as $indice=>$valor) {
    if (
$BD[$QSbd] == $valor) {
        echo 
"<option value='".$indice."' selected>".$valor."</option>";
    }else {
        echo 
"<option value='".$indice."'>".$valor."</option>";
    }
    }
    echo 
"</select>";
    echo 
"</td>";
    echo 
"<td>";
    
$OBbd "check_list_infraestructura_preg".$SQrow['orden']."_observacion";
    echo 
"<a name='INF".$SQrow['orden']."_ancla' id='INF".$SQrow['orden']."_ancla'></a><textarea name='INF-".$SQrow['orden']."-OBS' id='INF-".$SQrow['orden']."-OBS'    cols='70' rows='5'>".$BD[$OBbd]."</textarea>";
    
////////// AQUI ES DONDE VAN LOS ARCHIVOS ADJUNTOS ///////////
    
if ($SQrow['adjuntos'] == 'SI') {
        echo 
"Adjuntos:<div id='INF".$SQrow['orden']."_AdjDiv' name='INF".$SQrow['orden']."_AdjDiv' align='center'><div><input type='file' name='INF".$SQrow['orden']."_Adj[]' id='INF".$SQrow['orden']."_Adj[]'></div></div><a id='INF".$SQrow['orden']."_AddCampo' name='INF".$SQrow['orden']."_AddCampo' href='#INF".$SQrow['orden']."_ancla'>Adjuntar Otro</a>";
    }
    
//////////////////////////////////////////////////////////////
    
echo "</td>";
    echo 
"</tr>";
}
echo 
"<tr id='Buttons'><td colspan='4'><input type='button' name='Cancel2' id='Cancel2' value='CANCELAR CHECKLIST'>****<input type='submit' name='Next2' id='Next2' value='CONTINUAR - SIGUIENTE'></td></tr>";
echo 
"</form>";
?>
Con este script verifico los campos y realizo el envio del formulario:
Código Javascript:
Ver original
  1. $(document).ready(function() {
  2.     var CountQS = $("#CountQS").val();
  3.     $("#QuestionsINF").submit(function(e) {
  4.         var CQ2;
  5.         var ArrINFjs = new Array(CountQS);
  6.         var ArrINFjq = new Array(CountQS);
  7.         var ArrINFo = new Array(CountQS);
  8.         for (CQ2=1;CQ2<=CountQS;CQ2++) {
  9.             ArrINFjs[CQ2] = "INF-"+CQ2;
  10.             ArrINFjq[CQ2] = $("#INF-"+CQ2).val();
  11.             ArrINFo[CQ2] = $("#INF-"+CQ2+"-OBS").val();
  12.             if (ArrINFjq[CQ2] == "") {
  13.                 alert("Debe seleccionar una respuesta valida para la pregunta "+CQ2);
  14.                 document.getElementById(ArrINFjs[CQ2]).focus();
  15.                 return false;
  16.             }          
  17.         }  
  18.     var inputs = new FormData(this);
  19.         $.ajax({
  20.                     type: "POST",
  21.                     url: "includes/AlmacenandoChecklist.php",
  22.                     data: inputs,
  23.                     processData: false,
  24.                     contentType: false,
  25.                     beforeSend: function(){
  26.                           //imagen de carga
  27.                             $.blockUI({
  28.                                 message: '<h1>Cargando... Porfavor Espere...</h1>',
  29.                                 timeout: 2000
  30.                                 });
  31.                     },
  32.                     error: function(){
  33.                           alert("Error petición ajax.");
  34.                     },
  35.                     success: function(data){
  36.                           $("#cargando").css("display","table");
  37.                           $("#DataReady").empty();
  38.                           $("#DataReady").append(data);                                                            
  39.                     }
  40.               });
  41.               e.preventDefault();  
  42.     });
  43. });

Y este es el script encargado de generar los campos dinamicos para subir archivos:
Código Javascript:
Ver original
  1. $(document).ready(function() {
  2.     var Inc;
  3.     var Max = $("#CountQS").val();
  4.     var NameCampo = new Array(Max);
  5.     var IndCampo = new Array(Max);
  6.     var Etiqueta = new Array(Max);
  7.     var NameCampo = $("#IDQuestions").val();
  8.  
  9.     for (Inc = 1; Inc <= Max; Inc++) {
  10.             Etiqueta[Inc] = "#"+NameCampo+Inc+"_AddCampo";
  11.             $(Etiqueta[Inc]).AddCampo(Etiqueta[Inc], NameCampo, Inc);
  12.     }
  13. });
  14.  
  15.  
  16. jQuery.fn.AddCampo = function(etiqueta, nombreCampo, indice){
  17.    $(this).each(function(){
  18.       elem = $(this);
  19.       elem.data("etiqueta",etiqueta);
  20.       elem.data("nombreCampo",nombreCampo);
  21.       elem.data("indice",indice);
  22.      
  23.       elem.click(function(e){
  24.          e.preventDefault();
  25.          elem = $(this);
  26.          etiqueta = elem.data("etiqueta");
  27.          nombreCampo = elem.data("nombreCampo");
  28.          indice = elem.data("indice");
  29.          texto_insertar = '<div name="'+nombreCampo+indice+'_nDiv" id="'+nombreCampo+indice+'_nDiv"><hr width="50%"><input type="file" name="'+nombreCampo+indice+'_Adj[]" id="'+nombreCampo+indice+'_Adj[]"><a href="'+nombreCampo+indice+'_ancla" class="eliminar"> Borrar</a></div>';
  30.          indice ++;
  31.          elem.data("indice",indice);
  32.          nuevo_campo = $(texto_insertar);
  33.          elem.before(nuevo_campo);
  34.       });
  35.    });
  36.    $("body").on("click",".eliminar", function(e){
  37.         $(this).parent('div').remove();
  38.         return false;
  39.     });
  40.    return this;
  41. }

En el archivo que lee los datos enviados ("AlmacenandoChecklist.php") solo tengo print_r($_FILES); para visualizar todos los archivos que me envie el formulario.

Bueno antemano muchas gracias a los que se tomen la molestia de leer ^^ espero encontrar el problema, e intentado de muchas formas y aun no se en que fallo :S
  #2 (permalink)  
Antiguo 15/07/2014, 10:13
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.607
Antigüedad: 22 años
Puntos: 1284
Respuesta: Problema para obtener archivos de campos dinamicos

Hola:

La parte javascript la tratas con jQuery, así que movemos el tema a su foro...

Es preferible que pongas el código que recibe el navegador (ver código fuente), y a groso modo, los arrays los considera así php si los nombres terminan en un juego de corchetes.

Saludos
__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo
  #3 (permalink)  
Antiguo 17/07/2014, 08:37
Avatar de sofranco  
Fecha de Ingreso: junio-2013
Mensajes: 8
Antigüedad: 10 años, 10 meses
Puntos: 0
Respuesta: Problema para obtener archivos de campos dinamicos

Gracias caricatos, el codigo fuente ps arroja todo lo generado en php, los campos agregados con javascript, no estoy muy seguro si eso es normal.

Bueno creo haber encontrado el problema, pero estoy cruzado de manos, no se que esta mal. Les cuento, realice varias pruebas para descartar problemas:

1. Envie el formulario normalmente por POST mediante html (<form method='POST' id='QuestionsINF' name='QuestionsINF' method='post' action='index2.php?paginas=GuardarChecklist' enctype='multipart/form-data'>), y recoji los campos con printr($_FILES) y solo envia el campo tipo FILE que no es creado dinamicamente. No reconoce ninguno de los campos que la funcion jquery generaba.

2. crei que depronto era el script jquery asi que opte por generarlo en javascript y cree la siguiente funcion:
Código Javascript:
Ver original
  1. var incremento = 1;
  2. function Agregar_Campo (indice) {
  3.     var prefijo = "INF";
  4.    
  5.     nDiv = document.createElement("div");
  6.     nDiv.className = prefijo+indice+"_Archivo";
  7.     nDiv.id = "Adjunto"+incremento;
  8.    
  9.     nCampo = document.createElement('input');
  10.     nCampo.name = prefijo+indice+"_Adj[]";
  11.     nCampo.type = "file";
  12.  
  13.     nDiv.innerHTML = "Nombre: "+ nCampo.name + "<br>Tipo: "+ nCampo.type;
  14.    
  15.     nBorrar = document.createElement("a");
  16.     nBorrar.name = nDiv.id;
  17.     nBorrar.href = "#"+prefijo+indice+"_ancla";
  18.     nBorrar.className = "eliminar";
  19.     nBorrar.innerHTML = "Borrar";
  20.    
  21.     nHR = document.createElement("hr");
  22.     nHR.width = "50%";
  23.    
  24.     nDiv.appendChild(nHR);
  25.     nDiv.appendChild(nCampo);
  26.     nDiv.appendChild(nBorrar);
  27.     nContainer = document.getElementById(prefijo+indice+"_AdjDiv");
  28.     nContainer.appendChild(nDiv);
  29.    
  30.     $(document).ready(function() {
  31.         $("body").on("click",".eliminar", function(e){
  32.             $(this).parent('div').remove();
  33.             return false;
  34.         });
  35.         return this;
  36.     });
  37.     incremento++;
  38. }

No sirvio de mucho o mas bien no sirvio de nada, me dio el mismo resultado los mismos campos que no se envian.
Por esto creo que el problema esta en que los campos dinamicos no se estan generando correctamente, pero no logro encontrar la falla. Bueno sigo atento a alguna señal que me ilumine!! jejeje Gracias de nuevo
  #4 (permalink)  
Antiguo 17/07/2014, 09:11
Avatar de sofranco  
Fecha de Ingreso: junio-2013
Mensajes: 8
Antigüedad: 10 años, 10 meses
Puntos: 0
Respuesta: Problema para obtener archivos de campos dinamicos

Otra novedad bastante curiosa, resulta que en Google Chrome y en Mozilla Firefox no funciona (estos dos estan actualizados a sus ultimas versiones), pero en Internet Explorer 8+ funciona perfectamente. Ahora si estoy mas perdido que puedo hacer para que estos funcione en todo tipo de navegador >.<

Etiquetas: ajax, campos, dinamicos, formulario, funcion, input, javascript, js, php, select, valor
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 23:30.