IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

Trier variables numériques entrées par utilisateur


Sujet :

JavaScript

  1. #1
    Nouveau membre du Club
    Profil pro
    Étudiant
    Inscrit en
    Avril 2010
    Messages
    127
    Détails du profil
    Informations personnelles :
    Localisation : Belgique

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Avril 2010
    Messages : 127
    Points : 36
    Points
    36
    Par défaut Trier variables numériques entrées par utilisateur
    Bonsoir,

    Dans le cadre de l'élaboration d'un solveur de combat pour un JDR en ligne, je suis amené à m'occuper d'un onglet gérant l'initiative des joueurs, en gros qui agit avant qui.

    Ainsi, le maitre de jeu est amené à introduire dans un input la valeur numérique de l'initiative du joueur ainsi que dans un autre input celle de son adversaire.

    Je désirerai faire en sorte que dans un <span> s'affiche les deux valeurs triées par ordre croissant.

    Voici le code:

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    <!DOCTYPE html>
    <html>
    <head>
    		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    		<title>jQuery UI Example Page</title>
    		<link type="text/css" href="css/ui-lightness/jquery-ui-1.8.11.custom.css" rel="stylesheet" />	
    		<link type="text/css" href="css/design.css" rel="stylesheet" />	
    		<script type="text/javascript" src="js/jquery-1.5.1.min.js"></script>
    		<script type="text/javascript" src="js/jquery-ui-1.8.11.custom.min.js"></script>
    		<script type="text/javascript">
     
    $(document).ready(function() {
    // ---------------------------------------------------------------					
    			//gestion du formulaire pour l'initiative
    				$("#ini-but").click(function() {
     
    					// vide les champs générés par le JavaScript pour permettre de relancer le formulaire
    					$(" #ini-pj, #ini-adv, #ini-result-pj, #ini-result-adv, #triINI").empty();
     
    					// mise en Array des valeurs du formulaire
    					var Valeurs = new Array();
    						Valeurs ["ini-pj"] = parseInt($("#ini-pj").attr("value"));
    						Valeurs ["ini-adv"] = parseInt($("#ini-adv").attr("value"));
     
    					var resultatpj= "";
    					var resultatadv= "";
    					var triINI= "";
     
    					// vérifie si les champs sont corrects, et renvoit un message d'erreur en fonction
    					// /!\ faire le passage du nom de champs brut à un intitulé plus propre !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
    					var verif_champs = "";
    					for(val in Valeurs) {
    						if(isNaN(Valeurs[val]))
    							verif_champs += "le champs " + val + " n'est pas rempli ou n'est pas un nombre \n";
    						if( Valeurs[val]>20 || Valeurs[val]<0)
    							verif_champs += "le champs " + val + " doit être compris entre 0 et 20 \n";
    					}
     
    					//si souci avec le formulaire, on n'execute pas le script
    					if (verif_champs!="") {
    						alert (verif_champs);
    						return false;
    					}
     
    					//génère les jets de dés à utiliser
    					var inipjDice=Math.floor(Math.random()*20)+1;
    					var iniadvDice=Math.floor(Math.random()*20)+1;
     
    					// Traitement des données pour le PJ
     
    					if (inipjDice <= Valeurs ["ini-pj"]) {
    						resultatpj += "Le PJ a réussi son test d'INI(" + inipjDice + ") et bénéficie de 2 actions au premier tour. ";
     
    						}else {
    						resultatpj += "Le PJ a raté son test d'INI (" + inipjDice + ") et ne bénéficie que d'une action au premier tour.";
    					}
     
    					// Traitement des données pour l'adversaire
     
    					if (iniadvDice <= Valeurs ["ini-adv"]) {
    						resultatadv += "L'adversaire a réussi son test d'INI(" + iniadvDice + ") et bénéficie de 2 actions au premier tour. ";
     
    						}else {
    						resultatadv += "L'adversaire a raté son test d'INI (" + iniadvDice + ") et ne bénéficie que d'une action au premier tour.";
    					}
     
    					$("#ini-result-pj").append(resultatpj);
    					$("#ini-result-adv").append(resultatadv);
     
    					// Classement des INI selon données entrées dans #ini-pj et #ini-adv
     
    					function compare(x, y) {
        				return x - y;
    				}
     
    					var triINI = new Array(Valeurs ["ini-pj"], Valeurs ["ini-adv"]);
    					triINI.sort(compare);
    					$("#triINI").append(triINI);
     
    				});
     
     
    // ---------------------------------------------------------------	
    });
    		</script>

    Et coté HTML, le formulaire:

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    <div id="tabs-1">
                <table width="1019">
    						<tr>
    						  <td width="140" align="center">Initiative PJ</td>
    						  <td width="250"><input type="text" id="ini-pj"/></td>
    						  <td width="158" align="center">Initiative de l'adversaire</td>
    						  <td width="451"><input type="text" id="ini-adv"/></td>
                              <td><span id="ini-but"><img src="img/de2-gris.png" height="30px" onclick="roll(champDe2);champDe2.style.backgroundColor = '#DDDDFF';" onmouseout="champDe2.style.backgroundColor = '';" style="cursor:pointer;" /></span></td>
    						</tr>
    						<tr>
    							<td align="center"><em><strong>	Résultat du premier tour: </strong></em></td>
                              <td colspan="4"> <span id ="ini-result-pj"></span><span id ="ini-result-adv"></span></td>
    						</tr>
    						<tr>
    							<td align="center"><em><strong>	Classement des tours suivants: </strong></em></td>
                                <td><span id="#triINI"></span></td>
    						</tr>
    					</table>
     
            </div>
    J'ai essayé via function compare(x, y) mais à mon avis, je code mal la création de l'array ou alors ca coince au niveau du <span id="#triINI"></span>

    Merci d'avance !

    NB: le solveur: http://warforum-jdr.com/solveur/
    je ne suis pas le codeur original de l'entièreté du solveur, la base (l'onglet Corps à corps) n'est pas de moi mais d'un autre membrede mon forum, et je me suis basé sur son travail pour reprendre le flambeau. Il était parti sur une base de jquery par choix personnel. Ne connaissant pas ce langage (ni le javascript plus que ça en fait), j'ai préféré continuer en js sur la base jquery en me servant au maximum de son code original pour les ajouts d'autres modules.

    NB: le code n'est peut être (voir sûrement) pas ultra propre ni optimisé, je suis preneur de toute modification en ce sens

  2. #2
    Nouveau membre du Club
    Profil pro
    Étudiant
    Inscrit en
    Avril 2010
    Messages
    127
    Détails du profil
    Informations personnelles :
    Localisation : Belgique

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Avril 2010
    Messages : 127
    Points : 36
    Points
    36
    Par défaut
    Bonsoir,

    On m'a aidé sur la question:

    mettre
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    <td><span id="triINI"></span></td>
    et dans le code javascript:
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    $("#triINI").text(''+triINI);
    Le ''+ force la conversion du tableau en chaîne de caractères. Sinon jQuery n'apprécie pas.
    Et c'est nickel car ça fonctionne bien

    J'ai inversé le tri car normalement c'est celui qui possède la plus grande valeur qui agit en premier, j'avais pas fait attention

    J'aimerai néanmoins améliorer l'affichage et qu'au lieu d'afficher par exemple "20,10", il m'affiche "Joueur 1 (20), Joueur 2 (10)"

    Si c'est possible, avez-vous une idée ? Merci

  3. #3
    Nouveau membre du Club
    Profil pro
    Étudiant
    Inscrit en
    Avril 2010
    Messages
    127
    Détails du profil
    Informations personnelles :
    Localisation : Belgique

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Avril 2010
    Messages : 127
    Points : 36
    Points
    36
    Par défaut
    Bonsoir,

    Changement de tactique, via des if/else if/else c'est parfait et plus simple

    Problème réglé !

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Erreur vérification valeur entré par utilisateur
    Par tuytuy dans le forum MATLAB
    Réponses: 0
    Dernier message: 31/07/2013, 17h45
  2. Modifier un text par une variable entrée par l'utilisateur
    Par Plumdecul dans le forum Scripts/Batch
    Réponses: 5
    Dernier message: 04/08/2011, 19h32
  3. récupérer un text entré par l'utilisateur
    Par jayjay.f dans le forum AWT/Swing
    Réponses: 7
    Dernier message: 15/11/2006, 10h24
  4. Garder en mémoire les valeurs entrées par l'utilisateur
    Par dessinateurttuyen dans le forum Langage
    Réponses: 11
    Dernier message: 17/08/2006, 10h15
  5. Réponses: 5
    Dernier message: 27/09/2005, 18h25

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo