Tableau Excel sur Internet

KOBB -  
Alain_42 Messages postés 5361 Date d'inscription   Statut Membre Dernière intervention   -
Bonjour a toutes et tous,

Voila j'ai une question a la quel il doit certainement y avoir une réponse...

J'ai créer un fichier :

http://dl.free.fr/jAIoS0Cnd/Grepoculture.xls


et je voudrais avoir la même chose mais directement sur mon site.

un peu comme ce site

http://jormund.free.fr/mayesim/


voila merci de votre aide
A voir également:

12 réponses

Réponse 1 / 12
Alain_42 Messages postés 5361 Date d'inscription   Statut Membre Dernière intervention   894
 
en javascript (sans rechargement de page):
le calcul se fait a chaque chiffre tapé 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" > 
 <head> 
 <title>GREPO - Culture</title>
<script type="text/javascript">
function calculer(id_lire,id_ecrire,multipl){
	var saisie_input = document.getElementById(id_lire).value; //on lit la valeur
	var reponse= parseInt(saisie_input) * parseInt(multipl); //calcul
	document.getElementById(id_ecrire).value = reponse; //ecriture réponse

}
</script> 
 </head> 

 <body> 
   <table class="bat_sim" cellspacing="1"> 
    <tr> 
     <th>Unitées Navale</a></th> 
     <th>Nombre</th> 
     <th class="colonne">Points de Combat</th> 
    </tr> 
     
       <tr> 
     <td label for="input1">Bâteau de Transport</a></label></nobr></td> 
     <td class="niv_style"><input type="text" name="input1" id="input1" size="1" maxlength="4" value="0" onkeyup="calculer('input1','reponse1','7');" /></td> 
     <td class="niv_style"><input type="text" name="reponse1" id="reponse1" size="1" maxlength="4" value="" readonly /></td> 

    </tr>
	<tr> 
     <td label for="input1">Bâteau ......</a></label></nobr></td> 
     <td class="niv_style"><input type="text" name="input1" id="input2" size="1" maxlength="4" value="0"  onkeyup="calculer('input2','reponse2','7');" /></td> 
     <td class="niv_style"><input type="text" name="reponse" id="reponse2" size="1" maxlength="4" value="" readonly /></td> 

    </tr>
		
  </table> 
 </body> 
</html>
2
KOBB
 
C'est parfaitement cela qu'il me fallait !!!

Mais bon comme je suis un peut perfectionniste, est il possible de faire en sorte que lorsque la case est vite il n'y est pas NAN qui s'affiche mais bien 0 ou alors qu'il soit impossible de laisser la case vide, elle revent automatique a 0 ?
0
Réponse 2 / 12
ghulit03 Messages postés 529 Date d'inscription   Statut Membre Dernière intervention   43
 
jette un oeil ici --> https://openclassrooms.com/fr/courses/1603881-apprenez-a-creer-votre-site-web-avec-html5-et-css3

A++
0
KOBB
 
j'ai deja suivi ce tuto et ce n'est pas cela que je veut faire.

Je veut pouvoir remplir certaines cases et que dans d'autre case j'ai des résultats
0
prosthetiks Messages postés 1189 Date d'inscription   Statut Membre Dernière intervention   431
 
Comme une spreadsheet de chez google docs en somme ?
0
KOBB
 
Je ne sais pas trop ce que cela signifie

mais si tu jette un coup d'oeil ici

http://jormund.free.fr/mayesim/

je veut faire un site dans le même esprit. ou l'ont rempli des cases, et un résultat s'affiche.
Ce sont des multiplications et des additions toutes bête
0
Réponse 3 / 12
graffx Messages postés 6506 Date d'inscription   Statut Contributeur Dernière intervention   1 975
 
Apparement tu as une option pour le faire dans excel aprés une petite recherche (je n' utilise pas excel)


https://www.google.fr/search?q=.xls&ie=utf-8&oe=utf-8&aq=t&rls=org.mozilla:fr:official&client=firefox-a&source=hp&channel=np&gws_rd=ssl#sclient=psy-ab&hl=fr&client=firefox-a&hs=qA5&rls=org.mozilla:fr%3Aofficial&channel=np&source=hp&q=convertir+tableau+excel+page+web&oq=convertir+tableau+excel+page+web&aq=f&aqi=g-v1&aql=&gs_sm=e&gs_upl=2170l6648l0l6889l32l12l0l13l13l0l413l2686l0.5.5.1.1l20l0&pbx=1&bav=on.2,or.r_gc.r_pw.r_cp.,cf.osb&fp=2768f13ff0ab51f2&biw=1680&bih=904


et notemment:

https://forum.alsacreations.com/topic-2-34645-1-Convertir-excel-en-page-web.html
0
Réponse 4 / 12
Alain_42 Messages postés 5361 Date d'inscription   Statut Membre Dernière intervention   894
 
je ne pense pas que le site que tu cites en exemple soit de l'excel.

Les champs remplis font partie d'un formulaire et quand tu cliques sur le bouton ça envoie la page et les valeurs vers le serveur qui fait les calculs et affiche les résultats

donc il faut t'orienter vers le php par exemple et aller sur le site www;siteduzero.com pour apprendre ce langage
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Réponse 5 / 12
KOBB
 
bon je vais le relire, mais je n'est pas vu la partie.

et je sais bien que c'est pas du excel...

mais a partir de mon tableur je veut faire quelque chose de semblable ...
0
Réponse 6 / 12
Alain_42 Messages postés 5361 Date d'inscription   Statut Membre Dernière intervention   894
 
Excel est un log qui tourne sur ton PC

une page web est chargée depuis un serveur, pour faire des calculs 2 solutions:
- envoyer les données au serveurs pour qu'il te renvoie la page avec les résultats (donc utiliser le php ou asp ...)

- faire en javascript (donc localement dans le navigateur) les calculs, le résultat s'affiche de suite dans ta page sans rechargement
0
Réponse 7 / 12
KOBB
 
Bon j'ai réussis a faire ce que je voulais, je seul problème c'est comment faire un calcul ? Alors j'ai regarder sur différent tutos et je vois: PhP, Mysql, bdd mais je comprend pas grand chose !!

Donc je vous met une partie de mon script.
Si vous le visionnez, vous verrez une case en dessous de nombre. si dans cette case je met "x" je voudrais qu'en dessous de points de combat, ce soit égale a "x*7" 



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" > 
 <head> 
 <title>GREPO - Culture</title>  
 </head> 

 <body> 
   <table class="bat_sim" cellspacing="1"> 
    <tr> 
     <th>Unitées Navale</a></th> 
     <th>Nombre</th> 
     <th class="colonne">Points de Combat</th> 
    </tr> 
     
       <tr> 
     <td label for="input1">Bâteau de Transport</a></label></nobr></td> 
     <td class="niv_style"><input type="text" name="input1" id="input1" size="1" maxlength="4" value="0";/></td> 

    </tr> 
  </table> 
 </body> 
</html>


Voila un grand merci a celui qui me dira comment faire...
0
Réponse 8 / 12
Alain_42 Messages postés 5361 Date d'inscription   Statut Membre Dernière intervention   894
 
l'ordre des réponse est un peu chamboulé mais bon voilà la solution: 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" > 
 <head> 
 <title>GREPO - Culture</title>
<script type="text/javascript">
function calculer(id_lire,id_ecrire,multipl){
	var saisie_input = document.getElementById(id_lire).value; //on lit la valeur
	//calcul seulement si valeur différente de vide ou de zero
	if(saisie_input !="" &&  saisie_input !=0){
		var reponse= parseInt(saisie_input) * parseInt(multipl); //calcul
		document.getElementById(id_ecrire).value = reponse; //ecriture réponse
	}else{
		return false;
	}
}
</script> 
 </head> 

 <body> 
   <table class="bat_sim" cellspacing="1"> 
    <tr> 
     <th>Unitées Navale</a></th> 
     <th>Nombre</th> 
     <th class="colonne">Points de Combat</th> 
    </tr> 
     
       <tr> 
     <td label for="input1">Bâteau de Transport</a></label></nobr></td> 
     <td class="niv_style"><input type="text" name="input1" id="input1" size="1" maxlength="4" value="0" onkeyup="calculer('input1','reponse1','7');" /></td> 
     <td class="niv_style"><input type="text" name="reponse1" id="reponse1" size="1" maxlength="4" value="" readonly /></td> 

    </tr>
	<tr> 
     <td label for="input1">Bâteau ......</a></label></nobr></td> 
	 <!-- tu peux mettre le coef multiplicateur que tu veux 
	 pour la balise nobr vas voir ce lien :https://forum.alsacreations.com/topic-2-30166-1-La-balise-nobr.html
	 
	 -->
     <td class="niv_style"><input type="text" name="input1" id="input2" size="1" maxlength="4" value="0"  onkeyup="calculer('input2','reponse2','5');" /></td> 
     <td class="niv_style"><input type="text" name="reponse" id="reponse2" size="1" maxlength="4" value="" readonly /></td> 

    </tr>
		
  </table> 
 </body> 
</html>
0
KOBB
 
c sa mais si je met 1 dans la case puis que je l'efface, le résulta reste a 7, il ne revient pas a 0 ^^

par ailleurs j'ai besoin de faire une addition de toutes les réponses. mais je ne sais pas trop comment m'y prendre ^^ alors je tatonne ...
0
Réponse 9 / 12
Alain_42 Messages postés 5361 Date d'inscription   Statut Membre Dernière intervention   894
 
la function modifiée pour répondre à ta première question: 

function calculer(id_lire,id_ecrire,multipl){
	var saisie_input = document.getElementById(id_lire).value; //on lit la valeur
	
	//calcul seulement si valeur différente de vide ou de zero
	if(saisie_input !="" &&  saisie_input !=0){
		var reponse= parseInt(saisie_input) * parseInt(multipl); //calcul
		document.getElementById(id_ecrire).value = reponse; //ecriture réponse
	}else{
		document.getElementById(id_ecrire).value = 0; //ecriture réponse
		return false;
	}
}


pour la deuxième pas trop le temps pour le moment je dois aller acheter des huitres !
0
KOBB
 
Ha ok ^^

Si non ta Formule est parfaitement parfaite ^^

Il ne manque plus que le total et mettre le bouton reset : 


		
                <p class="Boutons">
		<input type="Reset" value="Reset" />
		</p>


mais il reset rien du tout ^^
0
Réponse 10 / 12
graffx Messages postés 6506 Date d'inscription   Statut Contributeur Dernière intervention   1 975
 
Desolé si mon lien n' etait pas bon, je me suis basé sur le titre (excel-dans-une-page-web)
Je parlais de convertir une page excel en page web, mais alors j' ai mal compris, tu voulais plutot une sorte de tableau qui calcul seul mais sur le web et pas seulement une presentation de page excel?

Bon je laisse la place a plus connaisseur que moi, je ne connais pas excel du tout :)
0
Réponse 11 / 12
Alain_42 Messages postés 5361 Date d'inscription   Statut Membre Dernière intervention   894
 
voilà total + reset: 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" > 
 <head> 
 <title>GREPO - Culture</title>
<script type="text/javascript">
function calculer(id_lire,id_ecrire,multipl){
	var saisie_input = document.getElementById(id_lire).value; //on lit la valeur
	
	//calcul seulement si valeur différente de vide ou de zero
	if(saisie_input !="" &&  saisie_input !=0){
		var reponse= parseInt(saisie_input) * parseInt(multipl); //calcul
		document.getElementById(id_ecrire).value = reponse; //ecriture réponse
	}else{
		document.getElementById(id_ecrire).value = 0; //ecriture réponse		
	}
	//appel fonction total
	var tot = total();
	document.getElementById('total').value = tot;
}
function total(){
	var tot=0;
	var form = document.forms.form1; //formulaire
	for (i=0 ; i<= form.length-1 ; i++)	{
		//parcours de tous les éléments du formulaire		 
		if (form[i].type == 'text' && form[i].name.substr(0,7) == 'reponse'){
			if(form[i].value !=""){
				tot = tot + parseInt(form[i].value);
			}
		}
	}
	return tot;
}
function effacer(){
	var form = document.forms.form1; //formulaire
	for (i=0 ; i<= form.length-1 ; i++)	{
		//parcours de tous les éléments du formulaire		 
		if (form[i].type == 'text' && (form[i].name.substr(0,7) == 'reponse' || form[i].name.substr(0,5) == 'input'  || form[i].name.substr(0,5) == 'total')){
			if(form[i].value !=""){
				form[i].value ="";
			}
		}
	}

}
</script> 
 </head> 

 <body>
<form name="form1"> <!-- attention cette balise doit avoir exactement ce nom -->
   <table class="bat_sim" cellspacing="1"> 
    <tr> 
     <th>Unités Navales</th> 
     <th>Nombre</th> 
     <th class="colonne">Points de Combat</th> 
    </tr> 
     
       <tr> 
     <td label for="input1">Bâteau de Transport</label></nobr></td>
		<!-- attention: tous les input de saisie doivent avoir comme name "input1, input2 etc... -->
     <td class="niv_style"><input type="text" name="input1" id="input1" size="1" maxlength="4" value="0" onkeyup="calculer('input1','reponse1','7');" /></td> 
	 <!-- attention: tous les input de réponse doivent avoir comme name "reponse1, reponse2 etc... -->
     <td class="niv_style"><input type="text" name="reponse1" id="reponse1" size="1" maxlength="4" value="" readonly /></td> 

    </tr>
	<tr> 
     <td label for="input1">Bâteau ......</label></nobr></td> 
	 <!-- tu peux mettre le coef multiplicateur que tu veux 
	 pour la balise nobr vas voir ce lien :https://forum.alsacreations.com/topic-2-30166-1-La-balise-nobr.html
	 
	 -->
     <td class="niv_style"><input type="text" name="input1" id="input2" size="1" maxlength="4" value="0"  onkeyup="calculer('input2','reponse2','5');" /></td> 
     <td class="niv_style"><input type="text" name="reponse2" id="reponse2" size="1" maxlength="4" value="" readonly /></td> 

    </tr>
	
	<tr> 
     <td label for="input1"><b>Total</b></label></nobr></td> 
	
	 
	 
     <td class="niv_style">&nbsp;</td> 
	 <!-- au passage tu vois que l'on peut appliquer du CSS à l'intérieur d'un input -->
     <td class="niv_style"><input style="font-weight:bolder;color:red;" type="text" name="total" id="total" size="1" maxlength="4" value="" readonly /></td> 

    </tr>
		
  </table>
  <input type="button" name="reset" value="Effacer tout" onclick="effacer();" />
</form>  <!-- ne pas enlever cette balise -->
 </body> 
</html>
0
KOBB
 
Je te remerci de ton aide

voici le lien de mon site et du résultat que cela donne ^^

http://grepo-help.olympe-network.com/Grepo_culture/grepoculture.php
0
graffx Messages postés 6506 Date d'inscription   Statut Contributeur Dernière intervention   1 975
 
Pas mal, en fait j' avais bien mal compris! Sympa!
0
Réponse 12 / 12
Alain_42 Messages postés 5361 Date d'inscription   Statut Membre Dernière intervention   894
 
oui pas mal le site, juste un petit détail, chez moi sur Firefox le bouton "Effacer tout" se balade en haut à gauche est ce normal ?
0