11496 sujets

JavaScript, DOM et API Web HTML5

Bonjour,
Je viens de désactiver les champs de mon formulaire php aprés une durée de vie: J'ai écris le code suivant mais mon sousis est que quand je refréche la page où se trouve mon formulaire les champs de réactivent. Commet faire ou qu'est ce que je dois changer dans le code si-dessous pour que les champs se désactivent définitivement. Merci d'avance.
le code:
SCRIPT language="Javascript">
function Desactiv() {
var els = document.getElementsByTagName('input');

for(i = 0 ; i < els.length ; i++) {
els.disabled =true;
}
return false;
}
</SCRIPT>
<body onLoad="setTimeout(Desactiv, 10000);">

Ce que j'ai lu , display rendre un texte ou un texte invisible par contre moi je veux les laisser visibles mais désactivés (nom modifiables)
Tu déclares un attribut id à ta balise <form>, par exemple "id_form1" et tu écoutes tous les évènements "submit"
var form1 = document.getElementById('id_form1');
if(form1 != null) {
   form1.addEventListener('submit', function(event) {
       event.preventDefault();
       alert('Toute soumission est proscrite');
   }
} else {
   console.log('id_form1 est porté disparu');
}

Modifié par bazooka07 (26 Dec 2018 - 16:16)
Bonsoir bazooka07,
j'ai mis ce code dans une fonction comme ceci et j'ai l'appelé dans onLoad de ma page: Mais ça marche pas Smiley confus
<SCRIPT language="Javascript">
function Desactiv1() {
var form1 = document.getElementById('form10');
if(form1 != null) {
form1.addEventListener('submit', function(event) {
event.preventDefault();
alert('Toute soumission est proscrite');
}
} else {
console.log('id_form1 est porté disparu');
}
}
</SCRIPT>
<body class="fixed fixed-topbar" onLoad="setTimeout(Desactiv1, 10000);">
Tu crées une fonction mais tu ne l'utilises pas. Restons simples :
<!DOCTYPE html>
<html lang="fr">
<head>
	<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
	<meta charset="utf-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1" />
	<title>Empêcher la soumission d'un formulaire</title>
	<style>
		html { background: #888;}
		form {
			width: 25rem; display:grid; grid-template-columns: 6rem auto;
			margin: 10vh auto 0; padding: 0.5rem;
			grid-row-gap : 0.3rem;
			background: #fff; border: 1px solid #444;
		}
		input[type="submit"] { grid-column: span 2; }
	</style>
</head><body>
	<form id="form1" action="variables.php">
		<label for="id_nom">Nom</label>
		<input id="id_nom" name="nom" />
		<label for="id_prenom">Prénom</label>
		<input id="id_prenom" name="prenom" />
		<input type="submit">
	</form>
	<script>
		(function() {
			'use strict';
			var form1 = document.getElementById('form1');
			if(form1 != null) {
				form1.addEventListener('submit', function(event) {
					event.preventDefault();
					alert('Toute soumission est proscrite');
				});
			} else {
				console.log('#form1 introuvable');
			}
		})();
	</script>
</body></html>

variables.php :
<?php phpinfo(INFO_VARIABLES); ?>

Modifié par bazooka07 (27 Dec 2018 - 09:36)
J'ai écris ce code pour que l'interdiction de la soumission s'exécute aprés une durée de vie de la formulaire=10000ms. Mais le problème reste le meme car je veux aprés cette durée de vie même si je réfréchis la page il reste interdit de faire la soumission il ne me donne pas une autre durée de vie. Pour expliquer mieux mon objectif: Dans mon travail, j'ai un formulaire qui doit etre remplit par un client à partir d'une interface de mon application. Je veux donner au client que 3 jours de faire la modification et aprés ces trois jours il ne peut pas faire la modification sur cette formulaire.
<script>
setTimeout( (function() {
'use strict';
var form1 = document.getElementById('form1');
if(form1 != null) {
form1.addEventListener('submit', function(event) {
event.preventDefault();
alert('Toute soumission est proscrite');
});
} else {
console.log('#form1 introuvable');
}
}),10000)();
</script>