Ayuda con Javascript

mijailrv · #1 (**permalink**) 14/11/2009, 01:04

Tengo la siguiente funcion en javascript... es un .js lo que necesito es saber como programar el html para que funcione ese javascript!!

este es el codigo

Código javascript:

Ver originalvar fechaVenc = vencimientos = new Array(); 
 vencimientos["00"] = 02;
 vencimientos["01"] = 02;
 vencimientos["02"] = 02;
 vencimientos["03"] = 02;
 vencimientos["04"] = 03;
 vencimientos["05"] = 03;
 vencimientos["06"] = 03;
 vencimientos["07"] = 03;
 vencimientos["08"] = 04;
 vencimientos["09"] = 04;
 vencimientos["10"] = 04;
  
  
 function calcular( numero, pago ){ 
    var cifras = numero.substr( numero.length - 2 ); 
    var fecha = vencimiento(cifras); 
    var hoy = new Date(); 
    var dia = hoy.getDate(); 
    var esteMes = hoy.getMonth(); 
    var sgteMes = 0; 
    var esteAno = hoy.getFullYear(); 
    var sgteAno = 0; 
    if(dia > fecha){ 
        if(esteMes == 11){ 
            sgteMes = 0; 
            sgteAno = esteAno + 1; 
        }else{ 
            sgteMes = esteMes + 1; 
            sgteAno = esteAno; 
        } 
        }else{ 
        sgteMes = esteMes; 
        sgteAno = esteAno;         
    } 
    var fechaVenc = new Date(); 
    fechaVenc.setFullYear(sgteAno); 
    fechaVenc.setMonth(sgteMes); 
    fechaVenc.setDate(fecha); 
    var diasFaltan = fechaVenc.valueOf() - hoy.valueOf(); 
    diasFaltan = diasFaltan / (1000 * 60 * 60 * 24); 
    var faltaPagar = pago / 30 * parseInt(diasFaltan); 
        alert(parseInt(faltaPagar)); 
    } 
function vencimiento(cifras){ 
 return vencimientos[cifras]; 
}

No se mucho de javascript.. seguro para muchos de ustedes al solo ojearlo sabran que forms o textarea o input hay que colocar y con que id para que funcione

David · #2 (**permalink**) 14/11/2009, 08:13

No necesita ningún textarea o input. Lo único que tienes que hacer es llamar a la función calcular() con los valores con que quieras realizar las operaciones.

mijailrv · #3 (**permalink**) 14/11/2009, 11:17

Disculpa mi ignorancia, pero a ver si entendí...

debo llamar a la función calcular ("numero", pago) pero... soy muy bruto para este tema... y no se como se hace... y yo quisiera que fuese posible colocar por ejemplo en un html valores predeterminados y un input para colocar el numero... y que luego al darle click a un botón me imagino que es el que se encargara de decir OnClick=("numero", pago)

a ver si me explico un poco mejor...

sera posible colocar un dos input de tipo texto para introducir los valores "numero" y los valores "pago"

Y luego un botón que sustituya los valores antes colocados para llamar a la función calcular ("numero", pago)

Yo intente esto y no me funciono.. aca el html

Código html:

Ver original<head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8">
    <title>Calcular</title>
    <script type="text/javascript" src="funcion.js" charset="utf-8"></script>
</head>
<body id="fraccionador" onload="">
    
    <form action="calcular_submit" method="get" accept-charset="utf-8">
        
    <input type="text" name="numero" value="" id="numero">
    <input type="text" name="pago" value="" id="pago">
    <input type="button" onClick="calcular('numero', pago)" name="calcular"
 value="Calcular" id="calcular">
    </form>
    
</body>

y que en el mismo html se coloque o imprima los valores...

¿como ejemplo que podría hacer?

Disculpen que pregunte cosas que quizás para ustedes sean demasiado sencillas pero estoy empezando en esto de programación en javascript y poco a poco voy aprendiendo... les ruego paciencia conmigo!!!

David · #4 (**permalink**) 14/11/2009, 11:50

Llama a la función así:

Código Javascript:

Ver originalcalcular(this.form.numero, this.form.pago);

Así va a tomar los valores de los campos.

mijailrv · #5 (**permalink**) 14/11/2009, 13:44

Cita:

Iniciado por David

Llama a la función así:

Código Javascript:

Ver originalcalcular(this.form.numero, this.form.pago);

Así va a tomar los valores de los campos.

A ver lo intente como dices pero no logro que imprima la funcion...

el codigo que coloque en el html es este... corigeme si me equivoco.

Código HTML:

Ver original<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
<head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8">
    <title>Calcular</title>
    <script type="text/javascript" src="fraccionador.js" charset="utf-8"></script>
</head>
<body id="calcular" onload="">
    
    <form>
        
    <input type="text" name="numero" value="" id="numero">
    <input type="text" name="pago" value="" id="pago">
    <input type="button" onClick="calcular(this.form.numero, this.form.pago);" name="calcular" value="Calcular" id="calcular">
    <p></p>
    </form>
    
</body>

mijailrv · #6 (**permalink**) 15/11/2009, 18:36

Por favor alguien que me ayude... se que es sencillo y podran hacerlo con solo mirar...

zerokilled · #7 (**permalink**) 15/11/2009, 19:05

a continuacion los siguiente errores:

el DOCTYPE esta incompleto.

Código:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
<head>

evita usar los nombres de identificadores en el codigo html. ¿que quiere decir eso? un identificador es un nombre dado a una variable o funcion en javascript. si usas ese mismo nombre para los atributos html como name y id, crea conflicto. el problema que presenta es que en lugar de el codigo referirse a una variable o funcion, este hace referencia al elemento en cuestion que tenga dicho valor en name o ID.
Código:
```
<body id="calcular" onload="">
...
<input type="button" onClick="calcular(this.form.numero, this.form.pago);" name="calcular" id="calcular" value="Calcular" />
```
los valores pasados a la funcion tienen que ir a la par con el tipo de valor que opera la funcion. en este caso estas pasando a la funcion las referencias de dos elementos en lugar del valor que estos contienen.
Código:
```
<input type="button" onClick="calcular(this.form.numero, this.form.pago);" name="calcular" id="calcular" value="Calcular" />
```

mijailrv · #8 (**permalink**) 15/11/2009, 22:10

y entonces cual seria el codigo para uno funcionando... no logro entender les recuerdo que soy nuevo...

a ver si entiendo lo de:

no colocarles los mismos ID a los elementos ya que crea conflictos...

lo que falta del DOCTYPE no me lo deja poner el foro segun por que debo tenar mas de 1 mes!!

luego seguí tus consejos añadiendo el .value al botón... sin embargo no logro hacer que funcione por ningún motivo

este es el codigo:

Código html:

Ver original<input type="button" onClick="calcular(formObj.num.value, formObj.pag.value);" value="Calcular">

sin embargo aun no me funciona!!!

que me falta no logro entender!!!

zerokilled · #9 (**permalink**) 15/11/2009, 22:24

no entiendo porque cambiastes la porcion en rojo,

Código:

<input type="button" onClick="calcular(formObj.num.value, formObj.pag.value);" value="Calcular">

lo unico que tenias que hacer era agregar al final de cada parametro .value. por otro lado, por si te es util, http://www.librosweb.es/javascript/index.html. por algun lugar tienes que comenzar porque imaginate! lo que quise decir en el segundo punto es que tienes que tienes que eliminar esos valores o cambiarlos por otros.

mijailrv · #10 (**permalink**) 15/11/2009, 23:03

a ver hago todo lo que tu dices... pero no me funciona!!!!

le doy al boton y no pasa nada!!

que esta mal?

Código html:

Ver original<body>
    
    <form>   
   <p><input type="text" value="" id="num"></p>
   <p><input type="text" value="" id="pag"></p>
   <p><input type="button" onClick="calcular(formObj.num.value, formObj.pag.value);" value="Calcular"></p>
    </form>
    
</body>

Podrias probarlo..?? quizas no funcione por que hay algo mal en el javascript o no se!!

zerokilled · #11 (**permalink**) 15/11/2009, 23:16

repito, no se que te ha dado con cambiar todo el codigo. esta vez no te funciona por lo siguiente:

no se sabe a que hace referencia formObj. es decir, formObj no esta definido en el codigo javascript. borra Obj.
Código:
```
<input type="button" onClick="calcular(formObj.num.value, formObj.pag.value);" value="Calcular">
```
aun no te funcionara luego de lo anterior porque esta vez haz cambiado el atributo de los elementos INPUTs. es decir, ahora tienen ID en lugar de name. cambia el atributo por name.
Código:
```
   <p><input type="text" value="" id="num"></p>
   <p><input type="text" value="" id="pag"></p>
```

mijailrv · #12 (**permalink**) 15/11/2009, 23:35

es que lo he intentado de todas las maneras posibles... por eso intente hacer el html nuevamente...

actualmente sin doctype etc lo tengo asi

Código html:

Ver original<head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8">
    <title>Calcular</title>
    <script type="text/javascript" src="fraccionador.js" charset="utf-8"></script>
</head>
<body>
    
    <form>
        
    <input type="text" value="" name="num">
    <input type="text" value="" name="pag">
    <input type="button" onClick="calcular(form.num.value, form.pag.value);" value="Calcular">
    <p></p>
    </form>
    
</body>

Y por nada del mundo logro que me diga el resultado.

zerokilled · #13 (**permalink**) 15/11/2009, 23:44

bien, supone que ahora al menos te muestre un cartel (una ventana alert). significa que ahora el codigo como tal esta funcionando y no hay ningun error a nivel de codigo. ahora bien, ¿cual es el resultado que debe mostrar? me estas dando la impresion que ni siquiera sabes que tipo de informacion debes entrar en los campos. del lugar donde sacastes el codigo, ¿indicaba que informacion debes entrar en los campos? o sea, para que funcione el codigo necesitas llenar los campos con una informacion. ¿cual es? no lo se porque aun no he analizado el codigo javascript.

David · #14 (**permalink**) 16/11/2009, 05:31

Diría yo que sigue habiendo error porque debería this.form en lugar de sólo form (ya que el formulario no tiene name)

mijailrv · #15 (**permalink**) 16/11/2009, 12:02

a ver, la función del script es esta: coloco un numero en el input numero, y un monto en el input pago... el script calcula segun la fecha de hoy cuantos dias faltan para para determinada fecha de cobro...

para eso los :

estas son las variables de vencimiento es decir para cada vencimiento vencimientos["numero"] = fecha de vencimiento;

Código javascript:

Ver originalvar fechaVenc = vencimientos = new Array(); 
 vencimientos["00"] = 02;
 vencimientos["01"] = 02;
 vencimientos["02"] = 02;
 vencimientos["03"] = 02;
 vencimientos["04"] = 03;
 vencimientos["05"] = 03;
 vencimientos["06"] = 03;
 vencimientos["07"] = 03;
 vencimientos["08"] = 04;
 vencimientos["09"] = 04;
 vencimientos["10"] = 04;

y la función calcular que simplemente agarra el valor de la fecha de vencimiento y calcula los números de días que va faltan para llegar a ese día luego conociendo el numero de días que falta, realiza un calculo simple con otro valor que es agregado en el campo "pago".

luego el script hace lo siguiente:

("PAGO"/30)*(Días que Faltan)

la única instrucción que me dejo el que me ayudo a hacer el script fue que el valor numero debía estar siempre entre comillas... cosa que no entiendo mucho.

Código javascript:

Ver originalfunction calcular( numero, pago ){ 
    var cifras = numero.substr( numero.length - 2 ); 
    var fecha = vencimiento(cifras); 
    var hoy = new Date(); 
    var dia = hoy.getDate(); 
    var esteMes = hoy.getMonth(); 
    var sgteMes = 0; 
    var esteAno = hoy.getFullYear(); 
    var sgteAno = 0; 
    if(dia > fecha){ 
        if(esteMes == 11){ 
            sgteMes = 0; 
            sgteAno = esteAno + 1; 
        }else{ 
            sgteMes = esteMes + 1; 
            sgteAno = esteAno; 
        } 
        }else{ 
        sgteMes = esteMes; 
        sgteAno = esteAno;         
    } 
    var fechaVenc = new Date(); 
    fechaVenc.setFullYear(sgteAno); 
    fechaVenc.setMonth(sgteMes); 
    fechaVenc.setDate(fecha); 
    var diasFaltan = fechaVenc.valueOf() - hoy.valueOf(); 
    diasFaltan = diasFaltan / (1000 * 60 * 60 * 24); 
    var faltaPagar = pago / 30 * parseInt(diasFaltan); 
        alert(parseInt(faltaPagar)); 
    } 
function vencimiento(cifras){ 
 return vencimientos[cifras]; 
}

ahora mi problema es hacerlo funcionar desde un HTML

a lo que he llegado segun los consejos de ustedes es a esto:
(sin de !DOCTYPE, sin HEAD

Código html:

Ver original<body>
    
    <form>   
   <p><input type="text" value="" name="num">
    <input type="text" value="" name="pag">
    <input type="button" onClick="calcular(this.form.num.value, this.form.pag.value);" value="Calcular">
    </p>
    </form>
    
</body>

Realmente no hay ningún error en el script y menos en el HTML solo que no logro hacerlo funcionar.

Alguien podria probar?

zerokilled · #16 (**permalink**) 16/11/2009, 15:31

bien, a ver si le damos fin a este tema.

Cita:

la única instrucción que me dejo el que me ayudo a hacer el script fue que el valor numero debía estar siempre entre comillas... cosa que no entiendo mucho.

lo que realmente te quiso decir la persona fue que cuando pases los valores a la funcion, el primer parametro debe ser un string, de ahi que te mencionara entre comillas. puede ser comillas simples o dobles ya que ambas indican un string. la razon es porque asi es como esta escrito en el array de vencimientos. fijate la porcion en rojo...

Código:

 vencimientos["00"] = 02;
 vencimientos["01"] = 02;
 vencimientos["02"] = 02;
 ...

las instrucciones son cierta siempre y cuando invocaras la funcion directamente desde javascript pasandole tu mismo los valores. es decir, digamos que en alguna parte del codigo javascript tengo lo siguiente. de nuevo, fijate en la porcion color rojo.

Código:

calcular('03', 387);

o sea, lo importante es que el tipo de valor sea un string. ahora bien, en tu caso no tienes que estrictamente incluir las comillas para delimitar string porque los valores de los controles de formularios, por ejemplo los campos textbox, siempre son del tipo string. de modo que con solo pasar la propiedad value de los campos es suficiente, tal como lo tienes en tu codigo.

Código:

<input ... onClick="calcular(this.form.num.value, this.form.pag.value);" />
// propiedad value son de tipo string;

de momento no tienes que hacerle nada mas a tu codigo, pero debes tener cuidado lo que escribes en el primer textbox. pues tiene que ser una cifra igual a como se define los elementos del array vencimiento. es decir, si volvemos al codigo anterior de vencimientos, donde los numeros estan marcados en rojo, cada elemento se compone de dos digitos: 01, 02, 03, 04, ..., 09, 10. asi es como se tiene que escribir en el primer textbox.

Cita:

Iniciado por David

Diría yo que sigue habiendo error porque debería this.form en lugar de sólo form (ya que el formulario no tiene name)

hola David, no es del todo cierto lo que citas. la explicacion esta en el mecanismo de resolucion de conflictos en identificadores. de momento no lo voy a discutir aqui para no confundir al autor de este tema.

David · #17 (**permalink**) 16/11/2009, 17:56

Cita:

Iniciado por zerokilled

hola David, no es del todo cierto lo que citas. la explicacion esta en el mecanismo de resolucion de conflictos en identificadores. de momento no lo voy a discutir aqui para no confundir al autor de este tema.

Tienes toda la razón, no me había percatado en ese detalle. Gracias por la corrección.

Saludos.

mijailrv · #18 (**permalink**) 17/11/2009, 11:43

Gracias por toda esa explicación, ya entiendo mas de javascript y ya se como funciona el código, pero sigue sin funcionar!!!

Lo habeis probado?

zerokilled · #19 (**permalink**) 17/11/2009, 19:55

si, lo he comprobado y me funciona. de lo contrario no hubiera dado las indicaciones ni las explicaciones.

mijailrv · #20 (**permalink**) 17/11/2009, 21:25

entonces por q a mi no me funciona... podrias pasarme tu HTML aun el mio tiene algo mal y no logro que funcione!!

zerokilled · #21 (**permalink**) 17/11/2009, 21:36

estoy usando exactamente el ultimo codigo que mostraste, no le hice ningun cambio. capaz que estas introduciendo mal los numeros en los campos. en ambos campos solo tienes que introducir numeros, pero en el primero tienes que introducir dos digitos en el rango de 01 a 10.

mijailrv · #22 (**permalink**) 19/11/2009, 11:28

ami mi me aparece error en la pagina, usando internet explorer 8 con Mozilla Firefox 3 al igual que con Google Chrome al darle clic al botón donde llamo a la función, no hace absolutamente nada... tal como un botón vacío.

Por que sera esto?

alpe2000 · #23 (**permalink**) 19/11/2009, 12:07

Corroboro que en IE8 funciona correctamente.
Te paso el fichero, comprueba que lo tengas igual.

Código htm:

Ver original<html>
<head>
<script>
var fechaVenc = vencimientos = new Array(); 
 vencimientos["00"] = 02;
 vencimientos["01"] = 02;
 vencimientos["02"] = 02;
 vencimientos["03"] = 02;
 vencimientos["04"] = 03;
 vencimientos["05"] = 03;
 vencimientos["06"] = 03;
 vencimientos["07"] = 03;
 vencimientos["08"] = 04;
 vencimientos["09"] = 04;
 vencimientos["10"] = 04;
 
function calcular( numero, pago ){ 
    var cifras = numero.substr( numero.length - 2 ); 
    var fecha = vencimiento(cifras); 
    var hoy = new Date(); 
    var dia = hoy.getDate(); 
    var esteMes = hoy.getMonth(); 
    var sgteMes = 0; 
    var esteAno = hoy.getFullYear(); 
    var sgteAno = 0; 
    if(dia > fecha){ 
        if(esteMes == 11){ 
            sgteMes = 0; 
            sgteAno = esteAno + 1; 
        }else{ 
            sgteMes = esteMes + 1; 
            sgteAno = esteAno; 
        } 
        }else{ 
        sgteMes = esteMes; 
        sgteAno = esteAno;         
    } 
    var fechaVenc = new Date(); 
    fechaVenc.setFullYear(sgteAno); 
    fechaVenc.setMonth(sgteMes); 
    fechaVenc.setDate(fecha); 
    var diasFaltan = fechaVenc.valueOf() - hoy.valueOf(); 
    diasFaltan = diasFaltan / (1000 * 60 * 60 * 24); 
    var faltaPagar = pago / 30 * parseInt(diasFaltan); 
        alert(parseInt(faltaPagar)); 
    } 
function vencimiento(cifras){ 
 return vencimientos[cifras]; 
}
</script>
</head>
<body>
    <form>   
   <p><input type="text" value="" name="num">
    <input type="text" value="" name="pag">
    <input type="button" onClick="calcular(this.form.num.value, this.form.pag.value);" value="Calcular">
    </p>
    </form>
 
</body>
</html>

mijailrv · #24 (**permalink**) 20/11/2009, 15:16

Gracias asi me ha funcionado

mijailrv · #25 (**permalink**) 20/01/2010, 06:47

Ahora tengo el siguiente problema, resulta que si son números bajos no me muestra los decimales, no se como hacer el javascript para que me muestre los decimales...

Ademas me interesaría mas que en vez de un mensaje emergente, me apareciera en un Input el monto

Y el script tiene errores, para el calculo, no se que esta mal.

Se supone que debería hacer esto:

[Calcular la fecha de actual] + [Luego según el numero se verifica el vencimiento] + [Ahora se cuentan los días que faltan desde la fecha actual hasta el vencimiento según el numero (Contando desde el dia de hoy)] Luego con el valor pago se debería realizar el siguiente calculo:

[FaltaPagar]= ([Pago]/30)x[DiasQueFaltan]

No se por que pero no me da el mismo resultado haciendo el calculo manual.
Ojo la fecha final no debería contarse el ultimo día

es decir: por ejemplo el vencimiento es el día 16 de cada mes y faltan 14 días para el 16 contando desde hoy es decir que es 2 en ese caso el valor real es 1 ya que no se cuenta el ultimo día

Ahora bien me imagino que este seria otro error creo que no supe colocar que el calculo se haga cn aquellos meses que tienen mas de 30 dias tambien, es decir entre en 8 de febrero y el 8 de marzo hay 20 dias y no 30

Entonces no se que hacer ayudenme!!!