16-07-2008, 11:21 AM
Code PHP :
<?php
<html>
<head>
<title>Test de Scripts Javascript</title>
<script>
//----------------------------------------------------TEST 1----------------------------------------------------
var nombre1 = 0;
var nombre2 = 0;
var calcul = 0;
function calcul2()
{
nombre1 = document.getElementById('champ4').value;
var valueNb2 = document.getElementById('champ7').value;
nombre2 = document.getElementById(''+valueNb2+'').title;
if(isNaN(nombre1))
{
alert('Veuillez ne mettre que des chiffres!');
nombre1 = document.getElementById('champ4').value = "0";
}
if(nombre1 == "")
{
nombre1 = document.getElementById('champ4').value = "0";
}
calcul = nombre1 * nombre2;
var resultat = Math.round(calcul);
document.getElementById('champ8').innerHTML = resultat;
}
function nomberReset()
{
if(document.getElementById('champ4').value == "0")
{
document.getElementById('champ4').value = "";
}
}
function types()
{
var choixType = document.getElementById('champ5').value;
if(choixType == "1")
{
document.getElementById('champ6').innerHTML = '<option value="1">Armes</option><option value="2">Armures</option><option value="3">Bouclier</option><option value="4">Gants</option><option value="5">Bottes</option><option value="6">Casques</option>';
categories();
}
if(choixType == "2")
{
document.getElementById('champ6').innerHTML = '<option value="7">Forgeron</option><option value="8">Archer</option><option value="9">Assassin</option><option value="10">Sorcier</option><option value="11">Epétiste</option><option value="12">Musicien</option>';
categories();
}
if(choixType == "3")
{
document.getElementById('champ6').innerHTML = '<option value="13">Ressources</option>';
categories();
}
if(choixType == "4")
{
document.getElementById('champ6').innerHTML = '<option value="14">Consommable</option><option value="15">Non Consommable</option>';
categories();
}
}
function categories()
{
var choixCategorie = document.getElementById('champ6').value;
switch(choixCategorie)
{
case "1":
document.getElementById('champ7').innerHTML = '<option value="1" id="1" title="10">Knif</option><option value="2" id="2" title="85">Glaive</option><option value="3" id="3" title="165">Long Sword</option>';
calcul2();
break;
case "2":
document.getElementById('champ7').innerHTML = '<option value="1" id="1" title="200">Aventure Suite</option><option value="2" id="2" title="750">Armor</option><option value="3" id="3" title="3500">Gold Armor</option>';
calcul2();
break;
case "3":
document.getElementById('champ7').innerHTML = '<option value="1" id="1" title="150">Novice Guard</option><option value="2" id="2" title="480">Guard</option><option value="3" id="3" title="2600">Gold Guard</option>';
calcul2();
break;
case "4":
document.getElementById('champ7').innerHTML = '<option value="1" id="1" title="264">Novice Glove</option><option value="2" id="2" title="562">Glove</option><option value="3" id="3" title="2841">Gold Glove</option>';
calcul2();
break;
case "5":
document.getElementById('champ7').innerHTML = '<option value="1" id="1" title="246">Novice Boots</option><option value="2" id="2" title="554">Boots</option><option value="3" id="3" title="2952">Gold Boots</option>';
calcul2();
break;
case "6":
document.getElementById('champ7').innerHTML = '<option value="1" id="1" title="798">Angel Helmet</option><option value="2" id="2" title="3698">Gold Helmet</option>';
calcul2();
break;
case "7":
document.getElementById('champ7').innerHTML = '<option value="1" id="1" title="1500">Sword Craft</option>';
calcul2();
break;
case "8":
document.getElementById('champ7').innerHTML = '<option value="1" id="1" title="973">Double Straff</option>';
calcul2();
break;
case "9":
document.getElementById('champ7').innerHTML = '<option value="1" id="1" title="1250">Sonic Blow</option>';
calcul2();
break;
case "10":
document.getElementById('champ7').innerHTML = '<option value="1" id="1" title="1420">Fire Bolt</option>';
calcul2();
break;
case "11":
document.getElementById('champ7').innerHTML = '<option value="1" id="1" title="1600">Magnum Break</option>';
calcul2();
break;
case "12":
document.getElementById('champ7').innerHTML = '<option value="1" id="1" title="1035">Music of Blind</option>';
calcul2();
break;
case "13":
document.getElementById('champ7').innerHTML = '<option value="1" id="1" title="0.5">Nourriture</option><option value="2" id="2" title="0.8">Fer</option><option value="3" id="3" title="0.9">Pierre</option><option value="4" id="4" title="0.7">Bois</option><option value="5" id="5" title="">Mana</option>';
calcul2();
break;
case "14":
document.getElementById('champ7').innerHTML = '<option value="1" id="1" title="7">Potion1</option><option value="2" id="2" title="10">Potion2</option><option value="3" id="3" title="17">Potion3</option>';
calcul2();
break;
case "15":
document.getElementById('champ7').innerHTML = '<option value="1" id="1" title="50">Jellopy</option>';
calcul2();
break;
}
}
function resRequest() { // On crée la fonction resRequest
var xhr_object = null; // On crée déjà la variable xhr_object
if(window.XMLHttpRequest) // Firefox
xhr_object = new XMLHttpRequest();
else if(window.ActiveXObject) // Internet Explorer
xhr_object = new ActiveXObject("Microsoft.XMLHTTP");
else { // XMLHttpRequest non supporté par le navigateur
alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
return;
}
var choix = document.getElementById('champ7').value;
var nomObjet = document.getElementById(''+choix+'').innerHTML;
var idObjet = document.getElementById(''+choix+'').id;
var quantiter = document.getElementById('champ4').value;
var resultat2 = document.getElementById('champ8').innerHTML;
xhr_object.open("GET", "test1.php?idobjet="+idObjet+"&nomobjet="+nomObjet+"&quantiter="+quantiter+"&prixtotal="+resultat2+"", true); // On ouvre le script php en designant si on utilisera GET ou POST comme méthode, dans notre cas on va utiliser GET, ensuite on mets le chemin du script php, puis on dit si on veut utiliser l'asynchrone(true) ou le synchrone(false, qui signifie figer le temps de la requete qui risque de bloquer le visiteur) donc on vas prendre l'asynchrone donc on met true.
xhr_object.onreadystatechange = function() { // Si le readyState change alors on execute ce qui est en bas
if(xhr_object.readyState == 4 && xhr_object.status == 200) // Si le readyState vaut 4 ce qui veut dire que les données ont été transmise et si le Status vaut 200 ce qui signifie que le navigateur n'a aucun problème
{
document.getElementById("resId").innerHTML = xhr_object.responseText; // Alors on affiche la reponse du script php dans le div ayant comme id : resId
}
}
xhr_object.send(null); // On envoie rien car on utilise pas la méthode POST
//window.setTimeout('resRequest()',1000); // On appelle cette fonction tout es les 1000millisecondes qui vaut 1secondes.
}
//--------------------------------------------------FIN TEST 1-------------------------------------------------
</script>
</head>
<body>
//----------------------------------------------------TEST 1----------------------------------------------------<br/>
Ce script permet de changer dynamiquement les informations que saisi le joueur et vas permettre d' envoyer les informations au fichier "test2.php" sans rechargement.<br/><br/>
<table border="1" style="border-collapse:collapse;border-style:1px solid brown;">
<tr>
<td width="70" align="center">Nombre</td><td align="center">Type</td><td align="center">Catégorie</td><td align="center">Choix</td><td align="center">Prix Total</td><td align="center">Achat</td>
</tr>
<tr>
<td><input type="text" size="8" value="0" style="text-align:center;" id="champ4" maxlength="3" onkeydown="javascript:nomberReset();" onkeyup="javascript:calcul2();"/></td>
<td>
<select onchange="javascript:types();" id="champ5">
<option value="1">Equipements</option>
<option value="2">Sorts</option>
<option value="3">Ressources</option>
<option value="4">Objets</option>
</select>
</td>
<td>
<select onchange="javascript:categories();" id="champ6">
<script>types();</script>
</select>
</td>
<td>
<select id="champ7" onchange="javascript:calcul2();">
<script>categories();</script>
</select>
</td>
<td align="center"><span id="champ8"/>0</span></td>
<td><input type="button" value="Acheter" onclick="javascript:resRequest();"/></td>
</tr>
</table>
<div id="resId"></div><br/>
//--------------------------------------------------FIN TEST 1-------------------------------------------------<br/>
</body>
</html>
