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 :

Optimisation de code


Sujet :

JavaScript

  1. #1
    Membre averti
    Homme Profil pro
    Directeur H�telier
    Inscrit en
    Janvier 2011
    Messages
    48
    D�tails du profil
    Informations personnelles :
    Sexe : Homme
    �ge : 38
    Localisation : France, Var (Provence Alpes C�te d'Azur)

    Informations professionnelles :
    Activit� : Directeur H�telier
    Secteur : Tourisme - Loisirs

    Informations forums :
    Inscription : Janvier 2011
    Messages : 48
    Par d�faut Optimisation de code
    Bonjour � tous.

    Je vais vous exposer ma demande le plus clairement possible. J'essais actuellement de faire une feuille de calcul de caisse (pour parfaire mes connaissances personnelles). Je suis parti un peu dans tous les sens pour mes d�battre avec ce que j'ai pu voir sur des forums ou des sites de tutoriels. Je me suis tellement d�battu que je me retrouver avec un code fonctionnel mais que j'aimerais optimiser afin de ne plus avoir tant de fichiers differents.

    J'ai donc :
    • calcul.php (formulaire de calcul)
    • Result.php (page imprimable du tout calcul�)
    • calculs.js (qui effectue les calculs)
    • Verif.js (qui v�rifie que la caisse est bonne)
    • nan.js (qui v�rifie les inputs afin qu'il n'y ai que des chiffres compatible)


    Globalement � chaque perte de focus sur un des champs j'ai la fonction cal() qui calcul... Apr�s je clique sur un bouton "v�rifier" (#verification) pour lancer la v�rification, qui charge �galement, avec les r�sultats un autre formulaire (cach�) que j'envoie sur la page Result.php avec un bouton submit "imprimer"...

    Tout est tr�s long et compl�tement brouillon. C'est pourquoi je viens vers vous aujourd'hui pour apprendre un peu plus et essay� de ranger, d'am�liorer et d'optimiser. Par exemple est ce que tout les DOCS.JS peuvent �tre transform�s un un seul qui travaillera pour chaque fonction ? puis-je me s�parer d'un des deux boutons en ne faisant partir les fonctions que via le bouton imprimer ?

    Je vous laisse les fichiers list�s si vous souhaitez visualiser le "bordel" j'ai pas contre �vit� le css donc pas de panic c'est juste moche

    Merci d'avance � tous ceux qui prendrons un peu de temps pour m'expliquer et me montrer deux ou trois astuces.

    caisse.rar <-- Pi�ce jointe modifi�e

    Cordialement, Nicolas

  2. #2
    R�dacteur

    Avatar de autran
    Homme Profil pro
    D�veloppeur Java
    Inscrit en
    F�vrier 2015
    Messages
    1 241
    D�tails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Var (Provence Alpes C�te d'Azur)

    Informations professionnelles :
    Activit� : D�veloppeur Java
    Secteur : High Tech - Multim�dia et Internet

    Informations forums :
    Inscription : F�vrier 2015
    Messages : 1 241
    Billets dans le blog
    55
    Par d�faut
    ta pi�ce jointe ne fonctionne pas
    D�veloppeur Java
    Site Web

  3. #3
    Expert confirm�
    Avatar de Watilin
    Homme Profil pro
    En recherche d'emploi
    Inscrit en
    Juin 2010
    Messages
    3 100
    D�tails du profil
    Informations personnelles :
    Sexe : Homme
    �ge : 36
    Localisation : France, Ille et Vilaine (Bretagne)

    Informations professionnelles :
    Activit� : En recherche d'emploi

    Informations forums :
    Inscription : Juin 2010
    Messages : 3 100
    Par d�faut
    Bonjour Nicolas,

    je vais jeter un coup d'�il. Tu auras mon commentaire dans un an ou deux
    La FAQ JavaScript � Les cours JavaScript
    Touche F12 = la console → l�outil indispensable pour d�velopper en JavaScript !

  4. #4
    Membre averti
    Homme Profil pro
    Directeur H�telier
    Inscrit en
    Janvier 2011
    Messages
    48
    D�tails du profil
    Informations personnelles :
    Sexe : Homme
    �ge : 38
    Localisation : France, Var (Provence Alpes C�te d'Azur)

    Informations professionnelles :
    Activit� : Directeur H�telier
    Secteur : Tourisme - Loisirs

    Informations forums :
    Inscription : Janvier 2011
    Messages : 48
    Par d�faut
    Bonjour et merci de t'y pencher d�j� ! 👍
    un an ou deux !? C'est si mauvais que �a !? 😧
    J'esp�re quand m�me que j'ai fais deux ou trois trucs bien dedans ... en m�me temps j'essaie d'apprendre donc deux ou trois tuto pourraient bien m'aider. Je vais essayer de lire en m�me temps.

    Bon dimanche, Nicolas

  5. #5
    Expert confirm�
    Avatar de Watilin
    Homme Profil pro
    En recherche d'emploi
    Inscrit en
    Juin 2010
    Messages
    3 100
    D�tails du profil
    Informations personnelles :
    Sexe : Homme
    �ge : 36
    Localisation : France, Ille et Vilaine (Bretagne)

    Informations professionnelles :
    Activit� : En recherche d'emploi

    Informations forums :
    Inscription : Juin 2010
    Messages : 3 100
    Par d�faut
    Apr�s une premi�re lecture rapide, j'ai quelques remarques.

    D'abord, il manquait la classe JFactory, mais j'ai pu me d�brouiller sans. J'ai quand m�me fait une recherche et j'ai vu que c'�tait li� � Joomla. Si tu veux mon avis (tr�s) personnel : si tu as vraiment l'intention d'apprendre � coder proprement, que ce soit en PHP ou en JS, fuis les CMS comme la peste. Ils ne t'apporteront que des ennuis.

    Ensuite, les styles. Comme tu l'as fait remarquer, il n'y en a pas. Le probl�me, c'est qu'il y en a quand m�me :

    � Les <br> qui se suivent traduisent une volont� de cr�er une marge, un espacement, bref : c'est de la mise en page. De mani�re g�n�rale, jamais plus d'un <br> � la fois dans le code HTML. La mise en page c'est le domaine de CSS, donc fais les espacements dont tu as besoin avec du code CSS.

    � M�me remarque pour les &nbsp;. Tiens au passage, culture g� : &nbsp; c'est le no-break space, en fran�ais l'espace ins�cable (et quand on parle d'espace en typographie, le mot est f�minin : on dit une espace ins�cable). C'est une espace qu'on met aux endroits o� on ne veut pas qu'il y ait un saut de ligne. Son emploi en HTML est largement abusif en g�n�ral

    � Tu peux �viter les probl�mes de guillemets les plus simples si tu utilises la vraie apostrophe. Tu peux la copier depuis un traitement de texte (ils font la substitution automatiquement) ou bien aller sur le site que je viens de lier et apprendre � la taper sur ton clavier pour aller plus vite. Ou alors tu peux aussi utiliser l'entit� &rsquo;.
    Plus besoin de blackslash dans 'L\'Abbé de L\'Isle' si tu peux �crire 'L’Abbé de L’Isle' ou 'L&rsquo;Abbé de L&rsquo;Isle'.

    � Les infobulles : il y a moyen d'en faire sans JS� En mettant simplement un attribut title ! On a le droit de le mettre quasiment partout. Les utilisateurs ont l'habitude de voir appara�tre une infobulle sur les �l�ments qui sont soulign�s en pointill�s et sur lesquels le curseur prend la forme d'un curseur d'aide, deux choses qui sont facilement r�alisables en CSS. Du coup je te conseille de cr�er une r�gle CSS :
    Code CSS : S�lectionner tout - Visualiser dans une fen�tre � part
    1
    2
    3
    4
    *[title] {
      border-bottom: dotted thin black;
      cursor: help;
    }
    Un peu comme la balise <abbr>.
    Ainsi tu pourras remplacer par exemple :
    Code html : S�lectionner tout - Visualiser dans une fen�tre � part
    <span class="type" onMouseOver="infobulle(this, 'Total des encaissements en chèques vacances');">Total ANCV :</span>
    Par :
    Code html : S�lectionner tout - Visualiser dans une fen�tre � part
    <span class="type" title="Total des encaissements en chèques vacances">Total ANCV :</span>

    � La balise <q> ! Il n'y aura jamais assez de <q> sur Internet. d�sol�
    Pour indiquer une citation courte ou une expression. Je pense que tu peux l'utiliser � cet endroit :
    Code html : S�lectionner tout - Visualiser dans une fen�tre � part
    1
    2
    3
    4
    &ndash;&nbsp;Entrez les informations du journal de caisse demandée et
      remplissez votre feuille de caisse. Lorsque vous avez terminé vous
      pouvez la <q><strong>vérifier</strong></q> et
      l&rsquo;<q><strong>imprimer</strong></q>.
    Tu l'auras compris, elle remplace les guillemets. L'int�r�t est que tu peux changer le style des guillemets � volont� en les sp�cifiant dans le CSS :
    Code CSS : S�lectionner tout - Visualiser dans une fen�tre � part
    1
    2
    3
    4
     
    q {
      quotes: '\00AB\00A0' '\00A0\00BB';
    }
    On a une d�claration en deux parties, la partie � guillemet gauche � et la parte � guillemet droit �. 00AB est l'unicode pour «, 00BB est l'unicode pour ». Quant � 00A0, il s'agit de notre amie l'espace ins�cable

    Tu peux ne pas aimer la balise <q> car avec elle, les guillemets ne sont pas s�l�ctionnables. �a peut �tre vu comme un avantage ou un d�faut, selon le point de vue. En tout cas ils apparaissent bien � l'impression (du moins dans l'aper�u).

    � Derni�re remarque : tes doctypes sont invalides, il y a des &nbsp; dedans. En parlant de �a, tu peux passer ton code HTML � la moulinette du validateur, il te dira plein de trucs, souvent utiles, dont tu as le droit de tenir compte ou pas.

    � Allez, deuxi�me derni�re remarque (apr�s j'arr�te, promis) : les attributs align et les attributs style. Tout �a c'est de la mise en page donc il faut essayer d'en avoir le moins possible dans le code HTML. Cela dit, il y a certains aspects des tableaux qui sont difficiles � reproduire avec CSS, du coup je reconnais que certains usages de align (et surtout valign en fait) se justifient.

    Voil� pour les styles, et un petit peu de typographie aussi. Je passe au code PHP et je te dis ce que j'en pense
    La FAQ JavaScript � Les cours JavaScript
    Touche F12 = la console → l�outil indispensable pour d�velopper en JavaScript !

  6. #6
    Expert confirm�
    Avatar de Watilin
    Homme Profil pro
    En recherche d'emploi
    Inscrit en
    Juin 2010
    Messages
    3 100
    D�tails du profil
    Informations personnelles :
    Sexe : Homme
    �ge : 36
    Localisation : France, Ille et Vilaine (Bretagne)

    Informations professionnelles :
    Activit� : En recherche d'emploi

    Informations forums :
    Inscription : Juin 2010
    Messages : 3 100
    Par d�faut
    Dans ton code PHP, tu as beaucoup de redondance, en particuler avec les noms de variable qui se terminent par un chiffre comme $nb1, $nb2, etc. C'est un cas o� il faudrait utiliser un tableau.

    Code PHP : S�lectionner tout - Visualiser dans une fen�tre � part
    1
    2
    3
    4
    5
    // depuis PHP 5.4, on déclare les tableaux comme en JS
    $nb = [];
     
    // si tu n'as pas accès à une version récente de PHP
    $nb = array();
    Ensuite, tu peux factoriser ton code (c'est-�-dire �liminer les r�p�titions) dans un boucle for.
    Code PHP : S�lectionner tout - Visualiser dans une fen�tre � part
    1
    2
    3
    for ($i = 1; $i <= 15; $i++) {
      $nb[$i] = empty($_POST["nombre{$i}t"]) ? 0 : $_POST["nombre{$i}t"];
    }
    Attention, j'ai fait commencer la boucle � 1 et non pas � 0 comme on fait d'habitude, pour que les index correspondent aux noms de tes variables.
    Par la suite, tu acc�des � tes variables par la notation index : <?php echo $nb[9]; ?> au lieu de <?php echo $nb9; ?>
    La m�me chose avec $tt.

    Autres trucs en vrac :

    � La fonction date accepte des caract�res �chapp�s, tu peux donc faire par exemple : echo date('H \h i'); pour afficher l'heure sous la forme 21 h 54 (le h du milieu n'est pas interpr�t�). D'ailleurs, au d�but de ton code, tu as une d�claration superflue de la variable $heure.

    � Tu ne v�rifies pas l'existence de tous les param�tres POST, �a g�n�re des tas d'alertes. Si tu as d�sactiv� les alertes, c'est mal ! Un bon code PHP ne produit aucun message ni d'alerte ni d'erreur. Cela ne veut pas dire qu'il ne fait jamais d'erreur ; mais les erreurs qui s'y produisent sont trait�es au bon moment et ne remontent pas jusqu'� l'utilisateur. Et interdit de tricher avec l'op�rateur @ !
    En l'occurence, tu testes d�j� une partie de tes param�tres avec empty. C'est un bon d�but, et je te conseille de faire subir le m�me traitement aux autres param�tres.

    � Attention toutefois avec empty : un 0 sera consid�r� de la m�me mani�re qu'un param�tre absent. Si tu veux prendre en compte les 0, il vaut mieux utiliser isset.

    � Pour revenir aux histoires d'alertes, tu peux t'assurer de les voir toutes, quelle que soit la config du serveur, en pla�ant ceci ligne au tout d�but de ton script :
    Code PHP : S�lectionner tout - Visualiser dans une fen�tre � part
    1
    2
    <?php
    error_reporting(-1);

    � Un point sur la s�curit� : tu le sais sans doute, les donn�es provenant du client sont susceptibles de contenir du code malveillant. Comme les valeurs que tu attends sont toutes des nombres (si je me trompe pas), tu peux te prot�ger facilement en convertissant explicitement toutes tes valeurs en type num�rique, avec intval.

    Voici un d�but de code qui valide les param�tres, ne g�n�re pas d'alerte et g�re correctement les 0 :
    Code PHP : S�lectionner tout - Visualiser dans une fen�tre � part
    1
    2
    3
    4
    5
    6
    7
    8
    $nb = [];
    $tt = [];
    for ($i = 1; $i <= 15; $i++) {
      $nb[$i] = isset($_POST["nombre{$i}t"]) ?
                              intval($_POST["nombre{$i}t"]) : 0;
      $tt[$i] = isset($_POST["tot{$i}t"]) ?
                              intval($_POST["tot{$i}t"]) : 0;
    }

    � Je reviens un petit coup sur le HTML : le validateur signale des attributs id qui ne contiennent que des chiffres. C'est d�conseill�, mais la plupart du temps �a marche quand m�me. � toi de voir. Moi je pense que �a ne bouleversera pas ton application si tu les enl�ves purement et simplement.
    La FAQ JavaScript � Les cours JavaScript
    Touche F12 = la console → l�outil indispensable pour d�velopper en JavaScript !

  7. #7
    Expert confirm�
    Avatar de Watilin
    Homme Profil pro
    En recherche d'emploi
    Inscrit en
    Juin 2010
    Messages
    3 100
    D�tails du profil
    Informations personnelles :
    Sexe : Homme
    �ge : 36
    Localisation : France, Ille et Vilaine (Bretagne)

    Informations professionnelles :
    Activit� : En recherche d'emploi

    Informations forums :
    Inscription : Juin 2010
    Messages : 3 100
    Par d�faut
    Un mot � propos de cette lib DD_roundies que tu utilises. Elle a �t� d�clar�e morte par son auteur, et si on en croit la date de la derni�re version (2009), �a fait d�j� un paquet de temps. La techno sous-jacente, VML, a �t� supplant�e par SVG.
    Et aujourd'hui pour faire des coins arrondis, il y la propri�t� CSS border-radius dont le support est largement r�pandu !


    J'en profite pour faire une remarque rapide � propos des changements de style dynamiques. Par exemple quand tu changes en rouge la bordure des inputs dont le format est invalide.
    Code JS : S�lectionner tout - Visualiser dans une fen�tre � part
    … .css("border", "2px solid #FF0000")
    Il me semble que les couches sont mieux s�par�es quand tu changes une classe au lieu de changer un style. �a te permet d'avoir toujours la m�me signification (� ce champ est invalide �) tout en ayant la possibilit� de changer l'apparence sans toucher au code JS.
    Par exemple :
    Code JS : S�lectionner tout - Visualiser dans une fen�tre � part
    … .addClass("invalid");

    Code CSS : S�lectionner tout - Visualiser dans une fen�tre � part
    input.invalid { border: solid 2px red; }
    Le r�sultat est le m�me, sauf que le contr�le de l'apparence est rendu au CSS, et en m�me temps ton code JS a gagn� un petit peu en signification.

    Pour ton inqui�tude � propos du grand nombre de fichiers, je peux d�j� te r�pondre : c'est un probl�me ou un avantage, selon le point de vue que tu adoptes. Avoir des fichiers s�par�s par th�me te permet de mieux t'organiser, � condition que la s�paration soit faite de mani�re coh�rente. Tu peux t'aider de dossiers pour mieux hi�rarchiser les scripts. On retrouve couramment un dossier nomm� js dans lequel sont regroup�s les scripts, avec �ventuellement un sous-dossiers lib pour les scripts de tierce-partie.

    Voici un exemple de hi�rarchie :
    Code txt : S�lectionner tout - Visualiser dans une fen�tre � part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    / (racine)
        theme/
            style.css
            help.gif
            ...
        js/
            lib/
                jquery-1.8.2.js
                jquery-alerts.js
                ...
            calcul.js
            verif.js
            ...
        calculs.php
        result.php

    En production, si ton serveur supporte peu la charge ou si tu as une forte fr�quentation, il est recommand� de concat�ner les scripts pour diminuer le nombre de requ�tes HTTP. On utilise une ligne de commande ou un petit batch pour coller bout-�-bout le contenu des diff�rents scripts et les envoyer en un seul fichier. Je te d�conseille de faire �a pendant la phase de d�veloppement car �a te ferait perdre beaucoup de temps pour rien. Ce travail peut-�tre automatis� par des outils tels que Grunt.


    J'ai d'autres remarques mais je vais terminer de regarder tous tes fichiers avant, pour te compiler tout �a en quelque chose de pas trop confus
    La FAQ JavaScript � Les cours JavaScript
    Touche F12 = la console → l�outil indispensable pour d�velopper en JavaScript !

  8. #8
    Expert confirm�
    Avatar de Watilin
    Homme Profil pro
    En recherche d'emploi
    Inscrit en
    Juin 2010
    Messages
    3 100
    D�tails du profil
    Informations personnelles :
    Sexe : Homme
    �ge : 36
    Localisation : France, Ille et Vilaine (Bretagne)

    Informations professionnelles :
    Activit� : En recherche d'emploi

    Informations forums :
    Inscription : Juin 2010
    Messages : 3 100
    Par d�faut
    Nicolas,

    j'attends ta r�ponse pour m'assurer que je ne suis pas en train de b�n�voler dans le vide.
    La FAQ JavaScript � Les cours JavaScript
    Touche F12 = la console → l�outil indispensable pour d�velopper en JavaScript !

  9. #9
    Membre averti
    Homme Profil pro
    Directeur H�telier
    Inscrit en
    Janvier 2011
    Messages
    48
    D�tails du profil
    Informations personnelles :
    Sexe : Homme
    �ge : 38
    Localisation : France, Var (Provence Alpes C�te d'Azur)

    Informations professionnelles :
    Activit� : Directeur H�telier
    Secteur : Tourisme - Loisirs

    Informations forums :
    Inscription : Janvier 2011
    Messages : 48
    Par d�faut
    Bonjour Watilin et d�sol� pour le temps de r�ponse je viens seulement de finir le gros de ma saison (dur dur Juillet / Ao�t en h�tellerie)

    Citation Envoy� par Watilin Voir le message
    Apr�s une premi�re lecture rapide, j'ai quelques remarques.

    D'abord, il manquait la classe JFactory, mais j'ai pu me d�brouiller sans. J'ai quand m�me fait une recherche et j'ai vu que c'�tait li� � Joomla. Si tu veux mon avis (tr�s) personnel : si tu as vraiment l'intention d'apprendre � coder proprement, que ce soit en PHP ou en JS, fuis les CMS comme la peste. Ils ne t'apporteront que des ennuis.
    Pour l'instant je suis sur joomla pour plusieurs raisons (manque de temps pour d'autres applications) qui n'ont rien � voir avec la page de calcul de caisse, un peu moins urgente, puisque, bien que mal cod�e, elle est fonctionnelle. J'essaye de m'en d�barrasser au fur et � mesure.

    Citation Envoy� par Watilin Voir le message
    Ensuite, les styles. Comme tu l'as fait remarquer, il n'y en a pas. Le probl�me, c'est qu'il y en a quand m�me :
    [indent]
    � Les <br> qui se suivent traduisent une volont� de cr�er une marge, un espacement, bref : c'est de la mise en page. De mani�re g�n�rale, jamais plus d'un <br> � la fois dans le code HTML. La mise en page c'est le domaine de CSS, donc fais les espacements dont tu as besoin avec du code CSS.
    Merci du conseil. Peu de sites d'apprentissage html expliquent que les <br/> d�affil� ne sont pas propres . pour certains ils nous expliquent juste que c'est un saut de ligne. et pour �tre honn�te m�me moi j'�tait d�rang� � la re-lecture de mes codes avec tous ces <br/>.

    Citation Envoy� par Watilin Voir le message
    � M�me remarque pour les &nbsp;. Tiens au passage, culture g� : &nbsp; c'est le no-break space, en fran�ais l'espace ins�cable (et quand on parle d'espace en typographie, le mot est f�minin : on dit une espace ins�cable). C'est une espace qu'on met aux endroits o� on ne veut pas qu'il y ait un saut de ligne. Son emploi en HTML est largement abusif en g�n�ral
    Alors l�, tu ne pouvais pas me faire plus plaisir ! Ma nature curieuse, qui m'a d�ailleurs pouss� � apprendre le html et qui m'a pouss� � aller plus loin est friande de culture G� !
    Pour info: mon utilisation (surement abusive) du&nbsp; est due au fait que certain espace ne sont pas prix en compte sur le page. Je n'ai pas trouv� de meilleurs moyen de les faire appara�tre.

    Citation Envoy� par Watilin Voir le message
    � Les infobulles : il y a moyen d'en faire sans JS� En mettant simplement un attribut title ! On a le droit de le mettre quasiment partout. Les utilisateurs ont l'habitude de voir appara�tre une infobulle sur les �l�ments qui sont soulign�s en pointill�s et sur lesquels le curseur prend la forme d'un curseur d'aide, deux choses qui sont facilement r�alisables en CSS. Du coup je te conseille de cr�er une r�gle CSS :
    Code CSS : S�lectionner tout - Visualiser dans une fen�tre � part
    1
    2
    3
    4
    *[title] {
      border-bottom: dotted thin black;
      cursor: help;
    }
    Un peu comme la balise <abbr>.
    Ainsi tu pourras remplacer par exemple :
    Code html : S�lectionner tout - Visualiser dans une fen�tre � part
    <span class="type" onMouseOver="infobulle(this, 'Total des encaissements en chèques vacances');">Total ANCV :</span>
    Par :
    Code html : S�lectionner tout - Visualiser dans une fen�tre � part
    <span class="type" title="Total des encaissements en chèques vacances">Total ANCV :</span>
    J'ai l'air tr�s b�te... En effet pourquoi faire compliqu� quand on peut faire simple ? je ne connaissais absolument pas le title c'est m�me plus propre ! moins de javascript donc plus lisible et plus rapide !

    Citation Envoy� par Watilin Voir le message
    � Derni�re remarque : tes doctypes sont invalides, il y a des &nbsp; dedans. En parlant de �a, tu peux passer ton code HTML � la moulinette du validateur, il te dira plein de trucs, souvent utiles, dont tu as le droit de tenir compte ou pas.
    J'en tiendrais compte. Je le faisais avant et �a peut m'apprendre plein de trucs sympas.

    Citation Envoy� par Watilin Voir le message
    � Allez, deuxi�me derni�re remarque (apr�s j'arr�te, promis) : les attributs align et les attributs style. Tout �a c'est de la mise en page donc il faut essayer d'en avoir le moins possible dans le code HTML. Cela dit, il y a certains aspects des tableaux qui sont difficiles � reproduire avec CSS, du coup je reconnais que certains usages de align (et surtout valign en fait) se justifient.
    Difficiles � reproduire mais pas impossible. Cela dit je ferais �a certainement en dernier lorsque tout le reste sera rectifi�.

    _______________________________________________________

    Citation Envoy� par Watilin Voir le message
    Dans ton code PHP, tu as beaucoup de redondance, en particuler avec les noms de variable qui se terminent par un chiffre comme $nb1, $nb2, etc. C'est un cas o� il faudrait utiliser un tableau.

    Code PHP : S�lectionner tout - Visualiser dans une fen�tre � part
    1
    2
    3
    4
    5
    // depuis PHP 5.4, on déclare les tableaux comme en JS
    $nb = [];
     
    // si tu n'as pas accès à une version récente de PHP
    $nb = array();
    Ensuite, tu peux factoriser ton code (c'est-�-dire �liminer les r�p�titions) dans un boucle for.
    Code PHP : S�lectionner tout - Visualiser dans une fen�tre � part
    1
    2
    3
    for ($i = 1; $i <= 15; $i++) {
      $nb[$i] = empty($_POST["nombre{$i}t"]) ? 0 : $_POST["nombre{$i}t"];
    }
    Attention, j'ai fait commencer la boucle � 1 et non pas � 0 comme on fait d'habitude, pour que les index correspondent aux noms de tes variables.
    Par la suite, tu acc�des � tes variables par la notation index : <?php echo $nb[9]; ?> au lieu de <?php echo $nb9; ?>
    La m�me chose avec $tt.
    Alors, je suis en PHP 5.5.
    J'ai toujours louch� sur les d�clarations tableau... ces [code=PHP]for ($i = 1; $i <= 15; $i++). Tous les sites que j'ai utilis� pour apprendre le reste (plut�t facilement) font comme si tout le monde sortait d'�cole. personnellement si on ne m'explique les choses (comme tu le fais depuis le d�but, clairement avec des mots simples, je fini par m'embrouiller et rien ne fonctionne.
    Moi on me parle de boucle mais il faut bien la stopper un jour cette boucle !? Pourquoi les sites donnent des exemple qui commence � 0 alors que je n'ai pas de variable "0" ? � quoi sert ce "i" que tout le monde utilise ? Bref je suis perdu ....


    Citation Envoy� par Watilin Voir le message
    � Tu ne v�rifies pas l'existence de tous les param�tres POST, �a g�n�re des tas d'alertes. Si tu as d�sactiv� les alertes, c'est mal ! Un bon code PHP ne produit aucun message ni d'alerte ni d'erreur. Cela ne veut pas dire qu'il ne fait jamais d'erreur ; mais les erreurs qui s'y produisent sont trait�es au bon moment et ne remontent pas jusqu'� l'utilisateur. Et interdit de tricher avec l'op�rateur @ !
    En l'occurence, tu testes d�j� une partie de tes param�tres avec empty. C'est un bon d�but, et je te conseille de faire subir le m�me traitement aux autres param�tres.

    � Attention toutefois avec empty : un 0 sera consid�r� de la m�me mani�re qu'un param�tre absent. Si tu veux prendre en compte les 0, il vaut mieux utiliser isset.
    Si un Z�ro est consid�r� comme un caract�re absent et que je le re-transforme en z�ro en php pour la version imprimable ce n'est pas correcte ? Je n'ai pas d�sactiv� les messages d'alertes ... enfin je ne pense pas.
    En fait j'autorise le client (Mon staff de l'h�tel) � ne pas rentrer les quantit�s �gales � z�ros dans le tableau. Je prend donc le empty pour les r�-afficher en z�ro dans la feuille imprimable.

    Citation Envoy� par Watilin Voir le message
    � Un point sur la s�curit� : tu le sais sans doute, les donn�es provenant du client sont susceptibles de contenir du code malveillant. Comme les valeurs que tu attends sont toutes des nombres (si je me trompe pas), tu peux te prot�ger facilement en convertissant explicitement toutes tes valeurs en type num�rique, avec intval.

    Voici un d�but de code qui valide les param�tres, ne g�n�re pas d'alerte et g�re correctement les 0 :
    Code PHP : S�lectionner tout - Visualiser dans une fen�tre � part
    1
    2
    3
    4
    5
    6
    7
    8
    $nb = [];
    $tt = [];
    for ($i = 1; $i <= 15; $i++) {
      $nb[$i] = isset($_POST["nombre{$i}t"]) ?
                              intval($_POST["nombre{$i}t"]) : 0;
      $tt[$i] = isset($_POST["tot{$i}t"]) ?
                              intval($_POST["tot{$i}t"]) : 0;
    }
    Je suis au courant qu'il ne faut pas faire confiance au client on le r�p�te tout le temps sur les sites d'apprentissage. Est ce que ma s�curit� javascript qui g�n�re une alerte et emp�che l'envoi de la page en cas de caract�res qui ne correspondent pas � des nombres est suffisante ? je n'ai pas utilis� de PHP sur la premi�re feuille mais bon dans un futur proche, j'aimerais bien en plus d'imprimer la feuille, l'enregistrer dans une BDD. peut �tre que je devrais tout faire en PHP.

    Citation Envoy� par Watilin Voir le message
    Un mot � propos de cette lib DD_roundies que tu utilises. Elle a �t� d�clar�e morte par son auteur, et si on en croit la date de la derni�re version (2009), �a fait d�j� un paquet de temps. La techno sous-jacente, VML, a �t� supplant�e par SVG.
    Et aujourd'hui pour faire des coins arrondis, il y la propri�t� CSS border-radius dont le support est largement r�pandu !
    Oui je suis au courant, mais vu que j'utilisais l'infobulle en m�me temps je l'utilisais surtout pour �a. Maintenant je vais utiliser title donc je vais g�rer les arrondis en CSS directement.

    Citation Envoy� par Watilin Voir le message
    J'en profite pour faire une remarque rapide � propos des changements de style dynamiques. Par exemple quand tu changes en rouge la bordure des inputs dont le format est invalide.
    Code JS : S�lectionner tout - Visualiser dans une fen�tre � part
    … .css("border", "2px solid #FF0000")
    Il me semble que les couches sont mieux s�par�es quand tu changes une classe au lieu de changer un style. �a te permet d'avoir toujours la m�me signification (� ce champ est invalide �) tout en ayant la possibilit� de changer l'apparence sans toucher au code JS.
    Par exemple :
    Code JS : S�lectionner tout - Visualiser dans une fen�tre � part
    … .addClass("invalid");
    Code CSS : S�lectionner tout - Visualiser dans une fen�tre � part
    input.invalid { border: solid 2px red; }
    Le r�sultat est le m�me, sauf que le contr�le de l'apparence est rendu au CSS, et en m�me temps ton code JS a gagn� un petit peu en signification.
    C'est une tr�s bonne id�e. En fait j'ai h�sit� sur les deux. Je comprend un peu mieux comment tu fonctionnes et je sais que tu as raison. je devrais mettre tous les styles dans le CSS.

    Citation Envoy� par Watilin Voir le message
    J'ai d'autres remarques mais je vais terminer de regarder tous tes fichiers avant, pour te compiler tout �a en quelque chose de pas trop confus
    Tes remarques �tant constructives, JE PRENDS, JE PRENDS !!!!

    Merci beaucoup, Nicolas

  10. #10
    Expert confirm�
    Avatar de Watilin
    Homme Profil pro
    En recherche d'emploi
    Inscrit en
    Juin 2010
    Messages
    3 100
    D�tails du profil
    Informations personnelles :
    Sexe : Homme
    �ge : 36
    Localisation : France, Ille et Vilaine (Bretagne)

    Informations professionnelles :
    Activit� : En recherche d'emploi

    Informations forums :
    Inscription : Juin 2010
    Messages : 3 100
    Par d�faut
    Citation Envoy� par Smoky184 Voir le message
    Bonjour Watilin et d�sol� pour le temps de r�ponse je viens seulement de finir le gros de ma saison (dur dur Juillet / Ao�t en h�tellerie)
    Je comprends. Je peux imaginer que l'h�tellerie te prend tout ton temps, ou te laisse sur les rotules � la fin de la journ�e

    Alors, je suis en PHP 5.5.
    J'ai toujours louch� sur les d�clarations tableau... ces [code=PHP]for ($i = 1; $i <= 15; $i++). Tous les sites que j'ai utilis� pour apprendre le reste (plut�t facilement) font comme si tout le monde sortait d'�cole. personnellement si on ne m'explique les choses (comme tu le fais depuis le d�but, clairement avec des mots simples, je fini par m'embrouiller et rien ne fonctionne.
    Moi on me parle de boucle mais il faut bien la stopper un jour cette boucle !? Pourquoi les sites donnent des exemple qui commence � 0 alors que je n'ai pas de variable "0" ? � quoi sert ce "i" que tout le monde utilise ? Bref je suis perdu ....
    Excuse-moi, j'avais, comme les autres, suppos� que tu connaissais la syntaxe des boucles for. Ce n'est pas tr�s diff�rent d'une boucle while ; on y a simplement rajout� des facilit�s pour travailler avec des tableaux, ou faire tout autre genre de travail avec un index (le fameux i), aussi appel� compteur, qui change de valeur de mani�re r�guli�re.

    Dans une boucle for, il y a trois instructions et un corps. Le corps, c'est ce qui est entre les accolades, et qui sera r�p�t�. Les trois instructions qui se trouvent dans la premi�re ligne ont respectivement le r�le d'initialisation, de test de sortie de boucle, et de mise � jour du compteur.
    Code pseudo-JS : S�lectionner tout - Visualiser dans une fen�tre � part
    1
    2
    3
    4
    5
    for (initialisation; testSortie; majCompteur) {
    
      ... corps
    
    }
    L'initialisation est ex�cut�e seulement une fois, juste avant d'entrer dans la boucle. Elle sert typiquement � initialiser le compteur, mais rien n'interdit de faire autre chose � cet endroit-l�.
    Le test de sortie est une expression bool�enne qui est recalcul�e � la fin de chaque it�ration (une it�ration = un � tour � de boucle). Tant qu'elle donne true, on continue, mais d�s qu'elle donne false, on sort de la boucle. Tr�s souvent le test va porter sur la valeur du compteur, et on le compare � une constante donn�e (la taille du tableau sur lequel on travaille, le nombre d'it�rations qu'on veut que la boucle fasse, etc.). Dans le code que je t'ai donn�, j'ai choisi $i <= 15, ce qui fait qu'� la fin de chaque it�ration, tant que $i est inf�rieur ou �gal � 15, on continue : on retourne dans la boucle et on ex�cute le corps une fois de plus.
    La mise � jour du compteur est une instruction ex�cut�e � la fin de chaque it�ration, mais avant le test de sortie. Tu peux consid�rer qu'elle est rajout�e � la fin du corps de la boucle. Elle peut �tre n'importe quelle instruction, mais en g�n�ral on y met � jour la valeur de $i. Dans notre exemple, on a $i++ qui �quivaut � $i = $i + 1.

    � pr�sent, prenons cette boucle :
    Code JS : S�lectionner tout - Visualiser dans une fen�tre � part
    1
    2
    3
    for (var i = 0; i < 3; i++) {
      (corps de la boucle)
    }

    Et � d�roulons-l� � pour voir ce qui se passe vraiment :

    1. Initialisation : D�claration de i et initialisation � 0

    2. Entr�e dans la boucle : ex�cution du corps avec i = 0

    3. Mise � jour du compteur : i passe � 1

    4. Test de sortie : on regarde si i < 3.
    �a renvoie true car i = 1
    on continue la boucle

    2. ex�cution du corps avec i = 1
    3. i passe � 2
    4. Le test renvoie encore true on continue

    2. ex�cution du corps avec i = 2
    3. i passe � 3
    4. i n'est plus strictement inf�rieur � 3 (car i = 3) ; le test renvoie false on sort de la boucle.

    Comme tu peux le voir, si on part de 0 et qu'on s'ar�te juste avant 3, on aura fait exactement 3 it�rations. Dans beaucoup de langages, on commence � 0 car les tableaux sont index�s � partir de 0. Cela signifie que le premier objet du tableau est situ� � l'index 0 (et non pas 1).

    Dans ton cas, c'est un peu diff�rent car � l'origine il n'y avait pas de tableau, et tu as d�cid� de nommer tes variables en comptant � partir de 1. J'ai donc fait une boucle � partir de 1 pour que tu ne sois pas embrouill� par des noms de variables qui auraient �t� tous d�cal�s. Du coup, pour adapter ma boucle, j'ai initialis� i � 1 et j'ai chang� le test $i < 15 en $i <= 15. Au lieu de s'arr�ter juste avant 15, on accepte cette valeur et on fait un tour de plus. De 1 � 15 inclus, on a bien 15 it�rations au total.

    J'aurais pu �crire $i < 16 ; � vrai dire, comme je rencontre rarement des situations o� on part de 1, je ne sais pas s'il y a une pratique plus recommand�e que l'autre. Mon argument est qu'il vaut mieux faire en sorte que le nombre d'it�rations soit visible au premier coup d'�il � la lecture du code.

    Si un Z�ro est consid�r� comme un caract�re absent et que je le re-transforme en z�ro en php pour la version imprimable ce n'est pas correcte ? Je n'ai pas d�sactiv� les messages d'alertes ... enfin je ne pense pas.
    En fait j'autorise le client (Mon staff de l'h�tel) � ne pas rentrer les quantit�s �gales � z�ros dans le tableau. Je prend donc le empty pour les r�-afficher en z�ro dans la feuille imprimable.
    Ok, si tu autorises les cases vides c'est bien, tu peux laisser comme c'est.

    Je suis au courant qu'il ne faut pas faire confiance au client on le r�p�te tout le temps sur les sites d'apprentissage. Est ce que ma s�curit� javascript qui g�n�re une alerte et emp�che l'envoi de la page en cas de caract�res qui ne correspondent pas � des nombres est suffisante ?
    Non, justement car JavaScript est du c�t� client : on peut le d�sactiver, ou modifier les variables avec un d�bogueur (trouvable dans les menus � outils de d�veloppement � de tout navigateur actuel). Des gens encore plus motiv�s peuvent m�me utiliser un outil pour cr�er des requ�tes HTTP (par exemple cURL, qui est notamment disponible en tant que biblioth�que de PHP) avec des donn�es enti�rement de leur cru. JavaScript n'est pas une s�curit� ; son r�le est d'aider l'utilisateur. Tu lui fais gagner du temps en lui indiquant quels champs sont mal remplis avant qu'il n'envoie la requ�te, mais s'il est suffisamment motiv� (et a un minimum de connaissances), il peut envoyer quand m�me la requ�te avec des donn�es invalides.
    La FAQ JavaScript � Les cours JavaScript
    Touche F12 = la console → l�outil indispensable pour d�velopper en JavaScript !

  11. #11
    Membre averti
    Homme Profil pro
    Directeur H�telier
    Inscrit en
    Janvier 2011
    Messages
    48
    D�tails du profil
    Informations personnelles :
    Sexe : Homme
    �ge : 38
    Localisation : France, Var (Provence Alpes C�te d'Azur)

    Informations professionnelles :
    Activit� : Directeur H�telier
    Secteur : Tourisme - Loisirs

    Informations forums :
    Inscription : Janvier 2011
    Messages : 48
    Par d�faut
    Bonjour Watilin

    tout d'abord merci de prendre du temps pour moi et de ta compr�hension quant � mon manque de temps ces deux derniers mois.

    J'ai refait la page de calculs en plus propre comme mentionn� plus haut en comman�ant par un index 0 pour les id's :

    Code : S�lectionner tout - Visualiser dans une fen�tre � part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    <table id="pieces" class="comptage">
    <caption>Pièces</caption>
    <tr>
    <td class="type">0,01€ X</td>
    <td><input type="text" class="nombre" name="nb0" id="nb0" size="3" onChange="cal();"/></td>
    <td>= <input type="text" class="total" disabled="disabled"  name="tt0" id="tt0" size="3"/></td>
    </tr>
     
    <tr>
    <td class="type">0,02€ X</td>
    <td><input type="text" class="nombre" name="nb1" id="nb1" size="3" onChange="cal();"/></td>
    <td>= <input type="text" class="total" disabled="disabled"  name="tt1" id="tt1" size="3"/></td>
    </tr>
    ...........
    Maintenant je vais refaire ma fonction de calcul en JS avec boucle comme tu me l'as propos�. et voir ce que �a donne si j'y arrive ou pas. Par la suite je commencerais le result.php avec un tableau de r�sultat et une v�rification c�t� serveur.
    D�s que j'ai le temps de terminer je reviens te le montrer.

    Nicolas

  12. #12
    Expert confirm�
    Avatar de Watilin
    Homme Profil pro
    En recherche d'emploi
    Inscrit en
    Juin 2010
    Messages
    3 100
    D�tails du profil
    Informations personnelles :
    Sexe : Homme
    �ge : 36
    Localisation : France, Ille et Vilaine (Bretagne)

    Informations professionnelles :
    Activit� : En recherche d'emploi

    Informations forums :
    Inscription : Juin 2010
    Messages : 3 100
    Par d�faut
    Il faut que je t'avertisse avant que �a t'arrive : tu risques d'avoir des erreurs d'arrondis si tu utilises des nombres � virgule pour manipuler les montants en euros. Ce n'est pas ta faute, ni celle de JavaScript : c'est la repr�sentation des nombres � virgule, appel�s nombre � virgule flottante, qui est incapable de repr�senter exactement certains nombres, notamment souvent ceux qui se terminent par .1 ou .9 (plus d'infos sur Wikip�dia si tu es curieux).
    Par exemple, ouvre ta console et essaye ceci :
    En arithm�tique normale, si on n'est pas une quiche absolue en calcul, on s'attend � obtenir 0.1. Mais en virgule flottante �a ne marche pas comme �a. Je te laisse la surprise�

    Pour �viter ce probl�me, stocke tous tes prix en cents (ex. 15 euros = 1500 cents). Avec les cents, tu manipules des nombres entiers, tu n'auras donc pas de probl�me d'arrondi.
    Pour convertir en euros, il suffit de diviser par 100, mais essaye si possible d'attendre toujours le dernier moment (par exemple le moment d'afficher le montant dans la page).
    La FAQ JavaScript � Les cours JavaScript
    Touche F12 = la console → l�outil indispensable pour d�velopper en JavaScript !

  13. #13
    Membre averti
    Homme Profil pro
    Directeur H�telier
    Inscrit en
    Janvier 2011
    Messages
    48
    D�tails du profil
    Informations personnelles :
    Sexe : Homme
    �ge : 38
    Localisation : France, Var (Provence Alpes C�te d'Azur)

    Informations professionnelles :
    Activit� : Directeur H�telier
    Secteur : Tourisme - Loisirs

    Informations forums :
    Inscription : Janvier 2011
    Messages : 48
    Par d�faut
    Bnjour � tous et merci pour votre patience. Le projet ayant chang� je suis pass� � du Php / MySql et j'ai donc ouvert un nouveau post. Merci pour votre aide tr�s pr�cieuse.
    Cordialement, AZHAR Nicolas

+ R�pondre � la discussion
Cette discussion est r�solue.

Discussions similaires

  1. optimiser le code d'une fonction
    Par yanis97 dans le forum MS SQL Server
    R�ponses: 1
    Dernier message: 15/07/2005, 08h41
  2. Optimiser mon code ASP/HTML
    Par ahage4x4 dans le forum ASP
    R�ponses: 7
    Dernier message: 30/05/2005, 10h29
  3. optimiser le code
    Par bibi2607 dans le forum ASP
    R�ponses: 3
    Dernier message: 03/02/2005, 14h30
  4. syntaxe et optimisation de codes
    Par elitol dans le forum Langage SQL
    R�ponses: 18
    Dernier message: 12/08/2004, 11h54
  5. optimisation du code et var globales
    Par tigrou2405 dans le forum ASP
    R�ponses: 2
    Dernier message: 23/01/2004, 10h59

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