- Buenas a todos espero puedan ayudarme ya tengo un par de varias horas con esto y nada que encuentro la solucion, veran a raiz de que el atributo Date de html5 no me sirve en Mozilla Firefox busque otra alternativa en Google y me encontre con el Calendario Datepicker lo probe por separado de mi proyecto y de una vez me funciono lo cambie a español y todo fino todo bello, bien lo quise integrar a mi proyecto y hasta cierto punto pense que estaba bien hasta que me di cuenta que si añadia otro campo en mi documento el calendario en el segundo elemento clonado no funciona, para ser mas claro yo tengo el siguiente formulario.
Código HTML:
Ver original<form method="post" name="up_form" class="formulario"> <input type="hidden" name="insertar"> <th>Descripción Documento
</th> <th>Fecha del Documento
</th> <th>Fecha de Expiración
</th> <th>Adjuntar Archivo
</th> <select id="taxonomia" name="cod_clasificacion"> <input type="text" class="datepicke" name="fecha_doc" required /> <input type="text" class="datepicker" name="fecha_exp" required /> <input type="file" name="archivo[]"> <input type="hidden" name="codigo" value="<?php echo $fila["cod_emp"]; ?>">
Seleccionar archivo
<a href="#" id="btn-up" class="anex-up"> Anexar Otro Archivo
</a> <input id="btn-up" class="sub" type="submit" value="Cargar Documentos">
- Eso me da la siguiente interfaz.
- Si hago un click en cualquier de los dos input de Fecha del Documento y Fecha de Expiracion me sale el siguiente calendario.
.
- Ahora bien si yo hago un click en Añadir otro Archivo la fila de arriba se clona y se anexa de bajo, hice 2 click por lo tanto obtuve lo siguiente.
.
- Ok ahora el problema si yo doy click en los inputs CLONADOS de Fecha del Documento y Fecha de Expiracion no
"Hace nada" no se muestran los calendario.
- Con este codigo hago la clonacion de filas.
Código Javascript
:
Ver original$(document).ready(function() {
$(document).on('change', 'input:file', function(){ // NUEVA LINEA
if($(this).val())
{
// Si tiene valor, se muestra en el class .files
$(this).parent().find(".files").html($(this).val().replace("C:\\fakepath\\", ""));
}else{
// Si no tiene valor, se muestran los puntos ...
$(this).parent().find(".files").html("...");
}
});
$(document).on("click",".anex-up",function() {
$("#up_form tbody tr:eq(0)").clone().appendTo("#up_form tbody").append('<td class="eliminar"><div id="eliminar">x</div></td>');
// (Se selecciona la ultima fila agregada, y se modifica el valor html del elemento con la clase 'files')
$("#up_form tbody tr:eq(-1)").find(".files").html("..."); // NUEVA LINEA
});
$(document).on("click",".eliminar",function(){
var parent = $(this).parents().get(0);
$(parent).remove();
});
});
- Y para usar el Datepicker uso lo siguiente, esto lo tengo en el html donde tengo el formulario.
Código HTML:
Ver original $(document).ready(function() {
$( ".datepicker" ).datepicker();
$( ".datepicke" ).datepicker();
});
- Alguna idea? espero puedan ayudarme un Saludo.