3

Estoy empezando en desarrollo web, pero tengo un pequeño incoveniente, tengo un pequeño scrip que me devuelve la fecha del sistema dando click a un botón pero al borrar los datos del cuadro de texto donde recae y dar click por segunda vez para volver a traer la fecha este ya no funciona.

Me podrían ayudar o me darían un consejo

Gracias.

function obtenerFecha()
 {
var fecha = "";
var calendario = new Date();
var dia = calendario.getDate();
var mes = calendario.getMonth()+1;
var ano = calendario.getFullYear();
fecha = dia+"/"+mes+"/"+ano;
document.mifor.algo.defaultValue = fecha;	
fecha = "";
}
body {
text-align: center;
height: 100%;
background: #FFFFFF
}
.selector
{
	font-size: 20px;
	border-radius: 15px;
}
.fecha
{
	border-radius: 15px;
	font-size: 20px;
	align-content: center;
	text-align: center;
}

.cont
{
	background:#fff125;
	height: 15vh;
}
.label
{
	font-size: 20px;
}
<!DOCTYPE html>
<html>
	<head>
		 <link rel="stylesheet" type="text/css" href="estilo.css"> 
	<script type="text/javascript" src="scrips.js"></script>
		<title>
			Prueba formulario
		</title>
	</head>
	
	<body >
	
		<form name="mifor" action="mailto:[email protected]" enctype="text/plain">

			<label for="algo" class="label">Fecha</label>
			<input type="text" name="algo" id="algo" value="" class="fecha">
			 <button type="button" onclick="obtenerFecha()">Obtener Fecha</button>
			 
			 <br>
			 <br>
			 <label for = "agente" class="label">Atendio</label>
			 <select id="agente" name = "agente" class="selector">
			 	<label for = "agente" class="label">Atendio</label>
			 	<option value="Alberto Loera">Alberto Loera</option>
			 	<option value="Rafael Nario">Rafael Nario</option>
			 	<option value="Victor Boon">Victor Boon</option>
			 </select>
		</form>
		
	</body>
</html>

1

2 respuestas 2

1

En vez de utilizar defaultValue utiliza el atributo value del input.

//Añadimos el evento.
document.getElementById('getFecha').addEventListener('click', () => {
    var fecha = "";
  var calendario = new Date();
  var dia = calendario.getDate();
  var mes = calendario.getMonth()+1;
  var ano = calendario.getFullYear();
  fecha = dia+"/"+mes+"/"+ano;
//Asigar al input el valor de la fecha
document.getElementById('algo').value = fecha

})

Ejemplo:

document.getElementById('getFecha').addEventListener('click', () => {
 	var fecha = "";
  var calendario = new Date();
  var dia = calendario.getDate();
  var mes = calendario.getMonth()+1;
  var ano = calendario.getFullYear();
  fecha = dia+"/"+mes+"/"+ano;
document.getElementById('algo').value = fecha

})
body {
text-align: center;
height: 100%;
background: #FFFFFF
}
.selector
{
	font-size: 20px;
	border-radius: 15px;
}
.fecha
{
	border-radius: 15px;
	font-size: 20px;
	align-content: center;
	text-align: center;
}

.cont
{
	background:#fff125;
	height: 15vh;
}
.label
{
	font-size: 20px;
}
<!DOCTYPE html>
<html>
	<head>
		 <link rel="stylesheet" type="text/css" href="estilo.css"> 
		<title>
			Prueba formulario
		</title>
	</head>
	
	<body >
	

		<form name="mifor" action="mailto:[email protected]" enctype="text/plain">

			<label for="algo" class="label">Fecha</label>
			<input type="text" name="algo" id="algo" value="" class="fecha">
			 <button type="button" id="getFecha" >Obtener Fecha</button>
			 
			 <br>
			 <br>
			 <label for = "agente" class="label">Atendio</label>
			 <select id="agente" name = "agente" class="selector">
			 	<label for = "agente" class="label">Atendio</label>
			 	<option value="Alberto Loera">Alberto Loera</option>
			 	<option value="Rafael Nario">Rafael Nario</option>
			 	<option value="Victor Boon">Victor Boon</option>
			 </select>
		</form>
		  <script>

</script>
	</body>
</html>

2
  • 1
    Como es que la eliminaste?
    – lois6b
    Commented el 29 jun. 2018 a las 10:47
  • Gracias, me funciono a la perfeccion :D Commented el 29 jun. 2018 a las 17:47
1

Cuando un input no tiene ningún valor y se acaba de generar, toma el valor por defecto,que suele ser "" (cadena vacía).

Por tanto, al ejecutar tu función se cambia el valor por defecto, y mientras no toques el input ese será el valor mostrado.

Puedes hacer la prueba de poner un valor manualmente al cargar la página y luego pulsar el botón, verás que tampoco hace nada porque el valor por defecto no es el que se está mostrando, ya se le ha dado otro valor.

La solución es modificar el campo value en lugar de defaultValue:

function obtenerFecha() {

  const calendario = new Date();
  const dia = calendario.getDate();
  const mes = calendario.getMonth()+1;
  const ano = calendario.getFullYear();
  const fecha = dia+"/"+mes+"/"+ano;

  document.getElementById('algo').value = fecha;    

}
1
  • Muchas gracias, me funciono a la perfeccion :D Commented el 29 jun. 2018 a las 17:47

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.