[SOLUCIONADO] Problemas en Calculo de diferencia de dias

[dgrvedado]

Hola tengo una pagina en la que necesito hacer un calculo de diferencia de días entre dos fechas. Les muestro mi código y explico entre lineas.
detalle.php

Código:

function restaFechas() {
	f1 = document.getElementById("inputField1").value;
	f2 = document.getElementById("vcto").value;
	var aFecha1 = f1.split('/'); 
	var aFecha2 = f2.split('/'); 
	var fFecha1 = Date.UTC(aFecha1[2],aFecha1[1]-1,aFecha1[0]); 
	var fFecha2 = Date.UTC(aFecha2[2],aFecha2[1]-1,aFecha2[0]); 
	var dif = fFecha2 - fFecha1;
	var dias = Math.floor(dif / (1000 * 60 * 60 * 24)); 
	document.getElementById("dias_dif").value = dias;
	//return dias;
}

Esta función en principio deberá coger el valor de esos elementos que están en el formulario más abajo.

Código:

<table>
	<tr>
		<td>Vencimiento: </td>
		<td><input type="text" name="vcto" id="vcto" value="<?=$vcto?>" size="8" disabled="disabled" onload="javascript:restaFechas();" /></td>
	</tr>
	<tr>
		<td>Fecha Pago: </td>
		<td><input type="text" name="fec_pago" id="inputField1" size="8" onblur="javascript:restaFechas();" /></td>
	</tr>
	<tr>
		<td>Días: </td>
		<td><input type="text" name="dias_dif" id="dias_dif" size="4" /></td>
	<tr>
</table>

En el código tengo esto en el primer input trea una fecha desde php en una consulta SQL del tipo dd/mm/aaaa y en el otro caso yo genero la fecha desde otro javascript para escoger fechas, que también se selecciona en el mismo formato. Al quitar el foco de mi input el resultado en dia_dif sale NaN. Sin embargo si vuelvo a seleccionar la fecha de pago escogiendo el mismo día entonces si me calcula.
¿Cómo puedo hacer para el calculo de haga desde la primera opción?

[dAvidcA]

Hola dgrvedado, pueden pasar varias cosas, necesitamos diagnosticar el problema.

Qué sale en la consola si utilizas este método:

Código Javascript:

function restaFechas() {
    var f1 = document.getElementById("inputField1").value;
    var f2 = document.getElementById("vcto").value;
    var aFecha1 = f1.split('/'); 
    var aFecha2 = f2.split('/'); 
    var fFecha1 = Date.UTC(aFecha1[2],aFecha1[1]-1,aFecha1[0]); 
    var fFecha2 = Date.UTC(aFecha2[2],aFecha2[1]-1,aFecha2[0]); 
    
    var dif = fFecha2 - fFecha1;
    if (!isNaN(dif)){
        var dias = Math.floor(dif / (1000 * 60 * 60 * 24));
        document.getElementById("dias_dif").value = dias;
    } else {
        console.log("Fecha1: "+f1+" | Fecha2: "+f2+" | Dif: "+ dif + " | "+typeof(dif));
    }
}
 

Saludos.

[IsaBelM]

NaN representa un valor no numérico. esto viene a decir que el minuendo o el sustraendo o ambos no son valores numéricos. asegúrate que el método Date.UTC() retorna un valor numérico

var a = 4;
var b;
console.log(a - b);
var c = 'a';
console.log(a - c);
var d = 'b';
console.log(c - d);

por otro lado, por qué el primer input text tiene asignado el evento onload??

[dgrvedado]

Al final deje el calculo tal cual estaba y usé otra forma en el formulario.

Código:

<tr>
	<td>Vencimiento: </td>
	<td><input type="text" name="vcto" id="vcto" value="<?=$vcto?>" size="8" disabled="disabled" /></td>
</tr>
<tr>
	<td>Fecha Pago: </td>
	<td><input type="text" name="fec_pago" id="inputField1" size="8" /></td>
</tr>
<tr>
	<td>Días: </td>
	<td><input type="text" name="dias_dif" id="dias_dif" size="4" onclick="javascript:restaFechas();" onchange="multiplicar();" />
	<small><i>De click para calcular días</i></small>
	</td>
<tr>

Listo tema cerrado...
Gracias a todos por responder.