consulta calendario

[kaninox]

Hola masters
Tengo un script en el cual muestro un calendario al hacer click en un boton.
el problema es que necesito crear otro input asociado al calendario y que al hacer click me muestre en su ID, me refiero al input la fecha seleccionada.
solo me resulta con uno el segundo ya no me corre? alguna idea?

la llamada la hago de la siguiente forma :

Código HTML:

<input type="text" id='date_input'/><input type ="button" value="..." onClick="calendar_load('date_input',$F('date_input'));"/>
 

entonces mi idea es agregar otro input de forma

Código HTML:

<input type="text" id='date_input2'/><input type ="button" value="..." onClick="calendar_load('date_input2',$F('date_input2'));"/>
 

en mi funcion function calendar_load no se como agregar el date_input2 ?

Código Javascript:

function calendar_load(date_input,value)
{
    //days of the week
    var header= new Array();
    header[1]='Dom';
    header[2]='Lun';
    header[3]='Mar';
    header[4]='Mie';
    header[5]='Jue';
    header[6]='Vie';
    header[7]='Sáb';
    //var meses = new Array ("Enero","Febrero","Marzo","Abril","Mayo","Junio","Julio","Agosto","Septiembre","Octubre","Noviembre","Diciembre");
    var dateFormat='d/m/y'; // d/m/y 
    
    $('wrapper_calendario').style.visibility='visible';
    var date = new Date(value);
    if(dateFormat=='d/m/y')
    {
        var vals=value.split('/');
        date.setDate(vals[0]);
        date.setMonth(vals[1]-1);
        date.setYear(vals[2]);
    }
    var day =date.getDate();
    var month=date.getMonth()+1;
    var year=date.getFullYear();
    if(!checkdate (month, day, year))
    {
        date = new Date();
        day =date.getDate();
        month=date.getMonth()+1;
        year=date.getFullYear();
    }
    var table = new Element('table',{
    id:date_input+'_table',
    cellspacing:'0'                                         
    });
    
    var thead= new Element('thead');
    
    var tr = new Element('tr');
    for (k=1;k<8;k++)
    {
        var th = new Element('th');
        th.update(header[k]);
        tr.insert(th);
    }
    thead.insert(tr);
    table.insert(thead);
    
    var today=new Date();
    
    var days=daysInMonth(month,year);
    
    wdate=date;
    wdate.setDate(1);
    
    var week=date.getDay();
    var tr= new Element('tr');
    if (week>=1)
    {   
        var td= new Element('td',{'colspan':week,'class':'padding'});
        tr.insert(td);
    }   
    for (n=1;n<=days;n++)
    {
        week++;
        if (week==8)
        {
            table.insert(tr);
            
            tr= new Element('tr');
            week=1;
        }
        var nclass="";
        if (today.getDate()==n && (today.getMonth()+1)==month && (today.getFullYear())==year )
        {nclass="today";}   
        
        var savedate=month+"/"+n+"/"+year;
        
        td =new Element('td',{'class':nclass,
                              onClick: "changeDate('"+date_input+"','"+ savedate +"');"});
        td.update(n);
        tr.insert(td);
        
    }
    if (week<7)
    {
        td= new Element('td',{colspan:(7-week),'class':'padding'});
        tr.insert(td);
    }
    table.insert(tr);
    var div= new Element('div',{id:date_input+'_controls',align:'center',style:'position:relative;'});
    
    var previous= calculate_month(month,year,'previous',dateFormat);
    
    var href= new Element('a',{ href:"javascript:void(0);",onClick:"calendar_load('"+date_input+"','"+previous+"');"})
    href.update('<< ');
    div.insert(href);
    var span= new Element('span');
    span.update(month+' / '+year);
    div.insert(span);
    
    var next= calculate_month(month,year,'next',dateFormat);
    
    var href= new Element('a',{ href:"javascript:void(0);",onClick:"calendar_load('"+date_input+"','"+next+"');"})
    href.update(' >>');
    div.insert(href);
    
    $(date_input+'_calendar').innerHTML='';
    $(date_input+'_calendar').insert(div);
    
    var divtable= new Element('div',{align:'center'});
    divtable.insert(table)
    
    $(date_input+'_calendar').insert(divtable);
    $(date_input+'_calendar').innerHTML='<input type="hidden" id=\''+date_input+'_format\' value=\''+dateFormat+'\'/>'+$(date_input+'_calendar').innerHTML;
    return false;
}
 
 
function calculate_month(actualMonth,actualYear,operation,dateFormat)
{
    if (operation=='next')
    {
        actualMonth++;
        if (actualMonth==13)
        {
            actualMonth=1;
            actualYear++;
        }   
    
    }
    else //  previous
    {
        actualMonth--;
        if (actualMonth==0)
        {
            actualMonth=12;
            actualYear--;
        }   
        
    }   
    
    var date;
    if (dateFormat=='d/m/y')
    {date='1/'+actualMonth+'/'+actualYear;} 
    else
    {date=actualMonth+'/1/'+actualYear;}    
    return date;
}
 
function checkdate (month, day, year) {
    var myDate = new Date();
    myDate.setFullYear( year,(month-1),day );
    var ret=month >= 1 && month <= 12 && year >= 1 && year <= 3000 && ((myDate.getMonth()+1) == month && day<32);
    return ret;
}
 
function changeDate(element,originalDate)
{
    var date = new Date(originalDate);
    var day =date.getDate();
    var month=date.getMonth()+1;
    var year=date.getFullYear();
    
    
    if ($F(element+'_format')=='d/m/y')
    {
        $(element).value=day+'/'+month+'/'+year;
    }
    else
    {
        $(element).value=month+'/'+day+'/'+year;
    }
    
    $(element+'_calendar').innerHTML="";
    $('wrapper_calendario').style.visibility='hidden';
    return false;
}
function daysInMonth(month,year){
    days=[0,31,29,31,30,31,30,31,31,30,31,30,31]; 
    last=0;
    if (month==2)
    {
        date=new Date(year,1,29)
        seeMonth=date.getMonth();
        if((seeMonth+1)!=month){last=28}
    }
    else
    {
        last=days[month]
    }
    return last;
}
 

lo otro si se fijan al comeinzo tengo comentado un array de meses? se supone que haciendo luego meses[month] me deberia funcionar pero me da un undefined? a que puede deberse esto? la idea es poner nombre del mes arriba y no el numero.

El calendario usado es el de esta web :http://www.codigogratis.com.ar/-post...prototype.html
Demo : http://codigogratis.com.ar/xx/calendar/

Saludos

[caricatos]

Tema movido desde javascript

[kaninox]

Sorry por reflotar el post pero me urge saber como agregar en la funcion otro campo de hecho estuve viendo algo y creo que tendria que agregar un arreglo a la funcion pero como le hago para me coja el nombre pasado por el id?

[masterpuppet]

Que tal kaninox, que error te muestra la consola de firebug?(asumo que si estas trabajando con js firebug esta instalado y activo), igual por lo que vi del script, cada input debe tener un div asociado,

este input:

Código HTML:

<input type="text" id='date_input2'/>
<input type ="button" value="..." 
       onClick="calendar_load('date_input2',$F('date_input2'));"/>
 

deberia tener este div(o algún otro wrapper lo que importa es que sea el mismo id del input + '_calendar')

Código HTML:

<div id="date_input2_calendar" class="calendar"></div>
 

con esto te mostraria dos calendarios independientes, con respecto al tema de los meses, que valor tiene month cuando no te funciona? y por último el script usa prototype de forma precaria:

1. No deberia tener onlick en los elementos Unobtrusive JavaScript, deberia utilizar observe.
2. Los estilos setearlos por medio de Element.setStyle
3. El contenido nuevo de un nodo setearlo a través de Element.update

Saludos.

[kaninox]

Holas masterpuppet gracias por responder mira la verdad el js no es para nada mi fuerte hay cosas que no entiendo muy bien como van como Element.setStyle etc... para mi es chino mandarin por ello me baje el script, para mi sirve que funcione.
ahora el tema del div asociado lo entiendo y si me muestra por cada boton un calendario aparte el tema es que cuando hago click sobre el calendario 2 me pone los datos en el input 1 o simplemente no lo hace. ya que en el script en a funcion solo se declara un solo input : function calendar_load(date_input,value)
entonces mi pregunta es como le paso al date_input un date_input2 u otro por ejemplo.?

lo de los meses es mas que nada un tema de estetica no me quita el sueño como lo otro pero el problema me lo da con diciembre me sale undefined y luego empieza a verse desde febrero :/ es como si estuviera corrido un mes.

Gracias.

[masterpuppet]

Iniciado por kaninox

ahora el tema del div asociado lo entiendo y si me muestra por cada boton un calendario aparte el tema es que cuando hago click sobre el calendario 2 me pone los datos en el input 1 o simplemente no lo hace.

Lo acabo de probar y funciona bien, asigna la fecha al input correspondiente, deberias instalarte el firebug, para poder tener una idea de que puede estar pasando

Iniciado por kaninox

ya que en el script en a funcion solo se declara un solo input : function calendar_load(date_input,value)
entonces mi pregunta es como le paso al date_input un date_input2 u otro por ejemplo.?

aca me perdi, queres agregar otro parametro a la funcion o queres pasar un input diferente ?, si lo que queres es pasar un input diferente a la funcion es como lo estas utilizando ahora y si lo que queres es agregar un tercer parametro deberias cambiar la firma de la funcion seria:

Código Javascript:

function calendar_load(date_input,value, mi_otro_parametro){
....
}
 

y para utilizarlo

Código HTML:

<input value="..." 
     onclick="calendar_load('date_input',$F('date_input'), 'param');" type="button">
 

Iniciado por kaninox

lo de los meses es mas que nada un tema de estetica no me quita el sueño como lo otro pero el problema me lo da con diciembre me sale undefined y luego empieza a verse desde febrero :/ es como si estuviera corrido un mes.

Date.getMonth() te devuelve el mes de la fecha de 0 a 11 siendo 0 Enero

Código Javascript:

...
var month=date.getMonth()+1;// agrega 1 para ajustar
meses[month];//mal
meses[date.getMonth()];//bien
 

Saludos.

[kaninox]

Ya entendi masterpuppet no te habia entendido lo de cambiar el div estaba ademas agregando input2... en la funcion del javascript era hay donde estaba mal, ya me funciona con mas de un calendario y lo de los meses tambien me va bien, el único problema que tengo es con el mes 2 del año 2012 y el 2008 etc...? sabrias por que no me muestra ese mes?
revise el calendario y todo lo demás funciona ok, ese mes simplemente no se me despliega información alguna, alguna idea?

saludos y muchas gracias.

[masterpuppet]

Bug spotted!!!, te va a fallar en todos los años bisiestos, la forma rapida de solucionarlo seria agregar un else a la función daysInMonth

esto:

Código Javascript:

function daysInMonth(month,year){
...
if((seeMonth + 1) != month){ last = 28 }
...
}
 

deberia ser esto:

Código Javascript:

function daysInMonth(month,year){
...
if((seeMonth + 1) != month){ last = 28 }
else{ last=days[month]; }
...
 

Saludos.

[kaninox]

Wow gracias por responder tan rápido y acertado muchas gracias por la ayuda esta probado funciona ok.