5545 sujets

Sémantique web et HTML

[Résolu] Saisie automatique dans un formulaire HTML

Bonjour,
Je souhaite copier et coller des valeurs à partir d'un fichier Excel et distribuer les résultats dans un formulaire.
Exemple copié depuis Excel : 1234, thakur, shankar, pandey.
Une fois que les 4 valeurs sont collés dans la zone de texte, la fonction soumettre doit les répartir dans chaque zone du formulaire.
Mais cela ne fonctionne pas. Smiley decu

Merci de votre aide.

<!doctype html>
<html>
<head>
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<body>
<p>Paste excel Form data here:</p>	
<textarea name="excel_data"	></textarea><br>
<input type="button" onClick="javascript:generateTable ()" value="Genereate Form"/>
<form>
	No: <input	type="text" id="f1" /></br>
	First name: <input	type="text" id="f2" /></br>
	Middle name: <input	type="text" id="f3" /></br>
    Last name: <input	type="text" id="f4" /></br>
	</form>	
<script>
	
function generateTable() {
	var data = $('textarea [name=excel_data]').val();
	var cells = data.split("\t");
	$("#f1").val(cells[0]):
	$("#f2").val(cells[1]):
	$("#f3").val(cells[2]):
	$("#f4").val(cells[3]):
	}
</script>
</body>
</html>
Modérateur
Bonjour,

Ton code contient plusieurs erreurs (qui sont d'ailleurs signalées dans la console de l'inspecteur, accessible sous Chrome et d'autres navigateurs via un clic droit dans ta page puis un clic sur "inspecter" qui apparait en bas du menu en principe).

1) javascript: devant generateTable() est inutile (et je déconseille de mettre un espace entre generateTable et la parenthèse qui le suit),
2) textarea[name=excel_data] ne doit pas contenir d'espace entre textarea et le crochet qui le suit,
3) il faut des points virgules et non pas des deux points à la fin des lignes $("#f1").val(cells[0]); et suivantes,
4) es-tu certain que le séparateur entre tes valeurs que tu mets dans le textarea est une tabulation ?
5) pour jquery, on en est à la version 3.6.1. Utiliser la 1.12.4 qui doit dater genre d'au moins 15 ans, c'est un poil abusé ! Smiley lol .

Amicalement,
Modifié par parsimonhi (18 Sep 2022 - 21:15)
Bonjour,
Merci pour toutes ces informations.
Une fois les corrections effectuées, le transfert des données ne se fait que dans la première zone du formulaire. Le séparateur entre les valeurs est une virgule.

<!doctype html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
</head>
<body>
<p>Paste excel Form data here:</p>
<textarea name="excel_data" ></textarea><br>
<input type="button" onClick="generateTable()" value="Genereate Form"/>
<form>
No: <input type="text" id="f1" /></br>
First name: <input type="text" id="f2" /></br>
Middle name: <input type="text" id="f3" /></br>
Last name: <input type="text" id="f4" /></br>
</form>
<script>

function generateTable() {
var data = $('textarea[name=excel_data]').val();
var cells = data.split("\t");
$("#f1").val(cells[0]);
$("#f2").val(cells[1]);
$("#f3").val(cells[2]);
$("#f4").val(cells[3]);
}
</script>
</body>
</html>


le résultat:

upload/1663531419-81929-capturedaeacran2022-09-18aa22.png
Modérateur
Bonjour,

Sur ton image, c'est une virgule suivie d'un espace. Je vais donc supposer que c'est bien le cas.

Remplace alors var cells = data.split("\t"); par var cells = data.split(", ");

Si c'est une virgule non suivie d'un espace, utilise var cells = data.split(",");

Amicalement,
Modifié par parsimonhi (18 Sep 2022 - 22:26)
Meilleure solution
Prévenir un modérateur
Répondre au sujet
Aller à