Problema con input calendar en javascript

Citar

Escrito el 31 Ago 2011 02:33 pm

Encontré este calendario el cual quiero utilizar en un formulario de ingreso de datos a una DB, funciona muy bien el calendario, el problema es que yo necesito obtener la fecha del calendario y meterla en una variable en javascript para poderla mandar a un php que me graba en la base de datos, he estado utilizando document.getElementById('mi_id').value; pero con este codigono funciona, talvez alguien pueda ayudarme

Por el_chejin

Claber

725 de clabLevel

4 tutoriales

Genero:Masculino

Envíale un mensaje privado

En mi nave Espacial

@el_chejin

Citar

Escrito el 31 Ago 2011 06:48 pm

probaste obteniendo los tres elementos del calendario;

document.getElementById('month').value;
document.getElementById('day').value;
document.getElementById('year').value;

y despues mandar a llamar el contenido de cada caja en tu query?

Por bernoo

9 de clabLevel

Genero:Masculino

Envíale un mensaje privado Web

loco, enfermo, distraido

@bernoo

Citar

Escrito el 31 Ago 2011 07:03 pm

Pues por lo que se ve, lo único que debes hacer es consultar el value del input tipo hidden que el script genera. Lo dice la documentación. De hecho tiene la posibilidad que te devuelva la cadena en formato ISO mysql compatible al pasarle la cadena "YYYY-MM-DD" en el último parámetro.

Por DriverOp

Claber

2510 de clabLevel

Envíale un mensaje privado Web

Citar

Escrito el 31 Ago 2011 07:18 pm

DriverOp escribió:

Pues por lo que se ve, lo único que debes hacer es consultar el value del input tipo hidden que el script genera. Lo dice la documentación. De hecho tiene la posibilidad que te devuelva la cadena en formato ISO mysql compatible al pasarle la cadena "YYYY-MM-DD" en el último parámetro.

eso es lo que he tratado de lograr pero no encuentro como, acabo de empezar con javascript, segun el código:

Código Javascript :

<input type="button" onClick="alert(this.form.orderdate.value)" value="Show date value passed">

con ese boton muestra la fecha segun se haya configurado, en mi caso DD-MM-YYYY, pero al intentar meter ese resultado en una variable no lo he conseguido, ya que "orderdate" el nombre asignado no lo devuelve en un ID sino en Name, por lo que no pude obtener el resultado por medio de:

Código Javascript :

var fecha=document.getElementById('orderdate').value;

y no se como obtener ese valor pormedio del "name", lo unico que encuentro es getElemenstByName('orderdate') pero no funciona con .value

al final creo que haré lo que dice:

bernoo escribió:

probaste obteniendo los tres elementos del calendario;

document.getElementById('month').value;
document.getElementById('day').value;
document.getElementById('year').value;

y despues mandar a llamar el contenido de cada caja en tu query?

solo que habrá que modificar el archivo calendarDateInput.js por que no incluye los IDs de los input's.

Por el_chejin

Claber

725 de clabLevel

4 tutoriales

Genero:Masculino

Envíale un mensaje privado

En mi nave Espacial

@el_chejin

Citar

Escrito el 01 Sep 2011 12:08 pm

Pues hombre, el atributo name solo vale para los inputs si están dentro de un form. Muestra el código donde has insertado la llamada a la función.

Pero claro, es más cómodo hacer que el input hidden tenga un id, tal como dices.

Por DriverOp

Claber

2510 de clabLevel

Envíale un mensaje privado Web

Citar

Escrito el 01 Sep 2011 02:39 pm

pues si lo tengo dentro de un form te muestro el código y gracias por la ayuda.

Código Javascript :

<body>
<form>

<script>DateInput('orderdate', true, 'DD-MM-YYYY')

</script>
<input type="button" onClick="alert(this.form.orderdate.value)" value="Show date value passed">
</form>
onClick="alert(this.form.orderdate.value)"
</body>

y al dar click si me muestra la fecha en DD-MM-YYYY pero al querer meter esos datos en una variable para poder enviarla a la DB no encuentro como.

la solución que le dí fue que encontre en el codigo del dateInputCalendar.js utiliza el nombre asignado + _Day_ID o Month o Year generando las id's de cada input. pero para los meses tira un valor de 0 - 11 y los numeros menores a 10 envia solo 1 digito por lo que hice esta funcion para corregir esto:

Código Javascript :

<body>
<form>

<script>DateInput('orderdate', true, 'DD-MM-YYYY')

function showdate()
{
   
      var dias_val="";
   var meses_val="";
   
   var dia=document.getElementById('orderdate_Day_ID').value;
   var mes=document.getElementById('orderdate_Month_ID').value;
   var year=document.getElementById('orderdate_Year_ID').value;
   mes_bruto = parseInt(mes);//devuelve el numero de mes del 0 - 11
   meses = mes_bruto+1;//corrige el 0 y devuelve el valor del mes del 1-12
   if (meses<10){meses_val="0"+meses;}//si el valor de meses es menor a 10 añade el "0" antes del valor para dar un valor en 2 digitos ej: 01, 03, 09.
   else {meses_val=meses;}
   if (dia<10){dias_val="0"+dia;}
   else {dias_val=dia;}
   var fecha=dias_val+"-"+meses_val+"-"+year;
   alert (fecha);
   
}
</script>
<input type="button" onClick="return showdate();" value="Show date value passed">
</form>
</body>

y al final logre tener la variable fecha= "DD-MM-YYYY"

claro que quisiera si me pudieran explicar como obtener el valor sin necesidad de hacer esta funcion por que el calendario devuelve esos valores y puedo modificarlos por ejemplo "MM-DD-YYYY" o "YYYY-MM-DD" solo que no encuentro como obtener los datos.

Por el_chejin

Claber

725 de clabLevel

4 tutoriales

Genero:Masculino

Envíale un mensaje privado

En mi nave Espacial

@el_chejin

Citar

Escrito el 01 Sep 2011 02:54 pm

Hice un pequeño ejemplo para ilustrar lo que me parece que debes hacer:

Código HTML :

<!doctype html>
<html lang="es-AR">
<meta charset="utf-8" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="js/calendarDateInput.js" type="text/javascript"></script>
<script type="text/javascript">
function VerFecha() {
   var frm = document.form1;
   var fechasel = frm.fecha.value;
   alert(fechasel);
}
</script>
</head>
<body>
<form name="form1">
<script>DateInput('fecha',true,'YYYY-MM-DD')</script>
</form>
<button onClick="VerFecha();">Ver la fecha</button>
</body>
</html>

Como podrás ver, la diferencia crucial es que le doy un name al form que contiene el generador del calendario. En la función VerFecha() puedes ver que la variable "fechasel" contiene la fecha seleccionada y con formato compatible para MySQL.

Suerte.

Por DriverOp

Claber

2510 de clabLevel

Envíale un mensaje privado Web

Citar

Escrito el 01 Sep 2011 03:39 pm

Gracias, fijate que use tu codigo y me muestra este error

no se que es lo que pasa que no hay modo que me funcione

pero muchas gracias.

Por el_chejin

Claber

725 de clabLevel

4 tutoriales

Genero:Masculino

Envíale un mensaje privado

En mi nave Espacial

@el_chejin

Citar

Escrito el 01 Sep 2011 03:51 pm

Exactamente el código que he posteado.

Si eres de los que copia y pega sin mirar lo que está copiando y pegando... me temo que no voy a ayudarte.

Por DriverOp

Claber

2510 de clabLevel

Envíale un mensaje privado Web

Citar

Escrito el 01 Sep 2011 05:30 pm

si utilicé el codigo que mandaste pero no como copy paste, solo son pruebas que estoy haciendo antes de meter el codigo en lo que necesito, pero queria ver como funcionaba y por alguna extraña razón no me funcionaba, ahora lo probe en puro copy paste y si funciona la verdad no entiendo por que no funcionó en un principio.

yo habia utilizado algo parecido con un this.form.fecha.value; pero sin darle un nombre al form, y entiendo que creaste 2 variables una que agarra el document.form y el otro que agarra el frm+fecha.value y luego el valor final de la variable seria document.form1.fecha.value; pero no entiendo por que no lograba obtener el value

no es que yo copie y pegue código es solo que primero pruebo los codigos y luego los trato de descifrar, hacer cambios y variaciones para aprender pero ya me ha funcionado, entonces hice este codigo:

Código Javascript :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="js/calendarDateInput.js" type="text/javascript"></script> 
<script type="text/javascript"> 
   function VerFecha() 
   { 
         var fecha_final = document.nueva_forma.fecha.value; 
         alert(fecha_final); 
   } 
</script> 
</head> 
<body> 
   <form name="nueva_forma"> 
   <script>DateInput('fecha',true,'YYYY-MM-DD')</script> 
   </form> 
    <input type="button" onClick="return VerFecha();" value="ver fecha">
</body> 
</html>

al final del hilo aprendi bastante, incluso a usar el parseInt() que no lo habia utilizado antes :lol: