Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1303 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  Est il possible de creer ce type de page avec html/javascript/php

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

Est il possible de creer ce type de page avec html/javascript/php

n°1237921
nlc
Le mieux est l'ennemi du bien
Posté le 03-11-2005 à 17:52:47  profilanswer
 

Bonjour a tous  :hello:  
 
Bon ma question est un peu compliquée, je vais essayer de faire le plus simple possible.
 
Admettons sur un serveur web l'arborescence de fichiers suivants :
./groupe1/boitiers.txt
./groupe2/boitiers.txt
./groupe3/boitiers.txt
./groupe4/boitiers.txt
 
etc..
 
Chaque fichier boitiers.txt contient une liste de noms de boitiers, par exemple :
boitier_1
boitier_2
boitier3_3, etc...
 
Je voudrais creer a partir de là une page qui va me permettre de manager mes boitiers, c'est a dire :
- Creer un nouveau groupe de boitier ( Revient a creer un nouveau dossier sur le serveur contenant un fichier boitiers.txt vide )
- Renommer un groupe ( Revient a renommer un repertoire )
- Effacer un groupe de boitier ( Revient a effacer un repertoire )
- Creer un nouveau boitier dans un groupe ( Revient a rajouter dans le bon fichier boitiers.txt une ligne avec le nom du boitier )
- Renomer un groupe ( Revient a changer une ligne dans le bon fichier boitiers.txt )
- Effacer un boitier ( Revient a effacer la bonne ligne du fichier boitiers.txt du bon repertoire )
 
Toute cette partie là, j'arrive a me demerder en php, j'ai deja ecrit un fichier qui execute toutes ces fonctions et qui s'appelle groupes.php
Par exemple :
groupes.php?erase=groupe1   --> Efface le groupe "groupe1"
groupes.php?new=groupe2   --> Crée un nouveau groupe "groupe2"
etc...
 
Ce que je ne sais pas faire, c'est la mise en page.
Je voudrais realiser un truc de ce type :
http://chaenel.free.fr/capture2.jpg
http://chaenel.free.fr/capture2.jpg
 
Donc en fait on represente graphiquement l'arborescence, que l'on peut developper ou envelopper, et selon l'element de l'arbre que l'on clique, on active ou on desative les boutons d'actions.
Par exemple, si je selectionne "Architecture du site", on ne peut qu'utiliser le bouton "Groupes/nouveau"
Si je clique sur un boitier, on ne peut que le modifier ou l'effacer.
etc...
 
Pour que la page html connaisse l'arborescence du site, je pense faire un script php qui sorte ce genre de chose :
<script language="JavaScript">
var arbo = new Array();
arbo.push( new Array( "Groupe1", "Boitier1", "Boitier2", "Boitier3", "Boitier4" ) );
arbo.push( new Array( "Groupe2", "Boitier11", "Boitier12", "Boitier13", "Boitier14" ) );
etc..
</script>
 
En fait on aurait donc un tableau qui repertorie les groupes sous forme de tableau, avec dans la 1ere case le nom du groupe, et dans les suivantes chaque boitiers faisant parti du groupe.
 
J'ai fais une petite page qui imite relativement bien ce que j'ai decris ci dessus : http://chaenel.free.fr/groupes.php
 
Mais comme vous pouvez le constater, c'est trop moche !! De plus, on peut pas envelopper/developper les arborescences
 
Comment je pourrais-je faire un truc plus joli ?


---------------
char table[] = {112,114,105,110,116,102,40,34,37,99,37,99,37,99,34,44,49,49,48,44,49,48,56,44,57,57,41,59,0}; char* tablePtr = table; while(*tablePtr) printf( "%c",*tablePtr++ );
mood
Publicité
Posté le 03-11-2005 à 17:52:47  profilanswer
 

n°1238439
anapajari
s/travail/glanding on hfr/gs;
Posté le 04-11-2005 à 10:20:12  profilanswer
 

un truc dans ce genre là:

Code :
  1. ...
  2. <style type="text/css" media="all">
  3.   div{
  4.      float: left;
  5.      border: 1px solid black;
  6.      padding: 5px;
  7.      margin: 5px;
  8.   }
  9.   div fieldset{
  10.     width: 200px;
  11.     display: block;
  12.   }
  13.   div fieldset legend{
  14.     font-weight: bolder;
  15.   }
  16.   div fieldset input{
  17.     display: block;
  18.     margin: 1px;
  19.     width: 150px;
  20.   }
  21.   </style>
  22.  
  23. </head>
  24. <body>
  25. <form action="groupes.php" method="get" name="form">
  26. <div>
  27.   <select size=10 name="choix">
  28.     <option onclick='JavaScript:buttonModeChange(0)' selected>Architecture du site</option>
  29.     <script type="text/javaScript">
  30.        optionPrint();
  31.     </script>
  32.   </select>
  33. </div>
  34. <div>
  35.   <fieldset>
  36.    <legend>Groupes</legend>
  37.    <input type="button" value="Nouveau groupe" name="ng">
  38.    <input type="button" value="Effacer groupe" name="eg" disabled="disabled">
  39.   </fieldset>
  40.   <fieldset>
  41.    <legend>Boitiers</legend>
  42.      <input type=button value="Nouveau boitier" name="nb" disabled="disabled">
  43.      <input type=button value="Effacer boitier" name="eb" disabled=disabled">
  44.   </fieldset>
  45. </form>
  46. </body>
  47. </html>

n°1238449
gatsusat
Posté le 04-11-2005 à 10:29:01  profilanswer
 

heuuuuuuuuuuu
 
et de ce genre là pour l'arborescence en gardant un code HTML propre et ensuite en JS tu ajoute ou supprime des éléments
http://gatsu.ftp.free.fr/html/Exem [...] cence.html


---------------
Les CSS c'est bon mangez-en
n°1238623
nlc
Le mieux est l'ennemi du bien
Posté le 04-11-2005 à 13:41:35  profilanswer
 

Merci pour vos reponses.
 
En essayant de me demerder, j'ai reussi a pondre ca : http://chaenel.free.fr/
Finalement ca sortait pas si mal que ca  :)  
 
Par contre, je vais essayer d'implanter les <fieldset>, je ne connaissais pas et ca a l'air plus plus pratique que mes tableaux !
 
L'etape suivante c'est de faire une arborescence comme sur ton lien gatsusat, c'est vraiment tres propre  :love:  :love:  :love:  
Il me suffirait de modifier juste un peu le code pour qu'un clic sur les elements de l'arbre appelle ma fonction qui remet a jour l'etat enable/disable des boutons.


Message édité par nlc le 04-11-2005 à 13:42:53

---------------
char table[] = {112,114,105,110,116,102,40,34,37,99,37,99,37,99,34,44,49,49,48,44,49,48,56,44,57,57,41,59,0}; char* tablePtr = table; while(*tablePtr) printf( "%c",*tablePtr++ );
n°1238692
gatsusat
Posté le 04-11-2005 à 14:40:51  profilanswer
 

les tableaux c'est moche
 
si tu veux faire un truc aussi propre que moi sache qu'il te suffirait juste de faire appel à des fonctions comme appendChild, document.createElement. et autres trucs du genre.
 
Faudrait aussi créer en parallèle la chose que tu as déjà fait afin de faire un effet formulaire.Bien evidement cette chose serait alors cachée dans le code. ou simplement un input type="hidden"


---------------
Les CSS c'est bon mangez-en
n°1238697
gatsusat
Posté le 04-11-2005 à 14:45:55  profilanswer
 

sans vouloir être mechant, tu aurais pu creer tes éléments en HTML proprement. et ensuite faire les modifs via du JS les doigts dans le PIf
 
car là du document.write c'est obsolète et dépassé depuis des années


---------------
Les CSS c'est bon mangez-en
n°1238702
nlc
Le mieux est l'ennemi du bien
Posté le 04-11-2005 à 14:51:46  profilanswer
 

gatsusat a écrit :

les tableaux c'est moche
 
si tu veux faire un truc aussi propre que moi sache qu'il te suffirait juste de faire appel à des fonctions comme appendChild, document.createElement. et autres trucs du genre.
 
Faudrait aussi créer en parallèle la chose que tu as déjà fait afin de faire un effet formulaire.Bien evidement cette chose serait alors cachée dans le code. ou simplement un input type="hidden"


 
Ouais je sais bien que les tableaux c'est moche  :sweat:  
Mais le truc que c'est que fais 2 pages html par an, et que j'ai pas du tout suivi l'evolution !!
 
Mais bon en meme temps cette page est prevue pour un administreur, qui utilisera la page quelques dizaines de fois par an.
Donc pour l'instant je vais faire un truc qui marche, ensuite j'essaierai de rendre le code plus propre, et d'avoir une page plus esthetique.
 
En tout cas j'ai bien vu qu'il y a moyen de faire des arborescences super design !  :love:  


---------------
char table[] = {112,114,105,110,116,102,40,34,37,99,37,99,37,99,34,44,49,49,48,44,49,48,56,44,57,57,41,59,0}; char* tablePtr = table; while(*tablePtr) printf( "%c",*tablePtr++ );
n°1238710
nlc
Le mieux est l'ennemi du bien
Posté le 04-11-2005 à 14:55:47  profilanswer
 

gatsusat a écrit :

sans vouloir être mechant, tu aurais pu creer tes éléments en HTML proprement. et ensuite faire les modifs via du JS les doigts dans le PIf
 
car là du document.write c'est obsolète et dépassé depuis des années


 
C'est ce j'avais fais au debut, mais je trouve que le code html est illisible.
Là au moins je peux separer en blocs, mettre des commentaires plus facilement, etc...
 
 


---------------
char table[] = {112,114,105,110,116,102,40,34,37,99,37,99,37,99,34,44,49,49,48,44,49,48,56,44,57,57,41,59,0}; char* tablePtr = table; while(*tablePtr) printf( "%c",*tablePtr++ );
n°1238726
gatsusat
Posté le 04-11-2005 à 15:02:44  profilanswer
 

au contraire si tu fais un code HTML propre, là il devient super lisible justement.
 
regarde mon menu en arborescence que je t'ai donné.  
 
c'est jsute du UL LI A .... imbriqués.  
et avec du Javascript je le parcours comme un malade


---------------
Les CSS c'est bon mangez-en
n°1238751
nlc
Le mieux est l'ennemi du bien
Posté le 04-11-2005 à 15:14:21  profilanswer
 

Peut etre mais comme je l'ai dis plus haut, je ne suis pas concepteur de site, je n'y connais rien et je fais 2 pages par an, donc je n'ai pas evolué avec les nouveaux tags et les nouvelles possibilités.
 
De plus, si je fais comme ça c'est sans doute par ce que je suis dans l'informatique industrielle et que je developpe du C a longueur de journée.
Et plutot que de faire une enorme fonction qui fait 200 lignes avec des boucles imbriquées ou des trucs comme ca, je prefere la scinder en plusieurs fonctions avec plusieurs niveaux de "couches".


Message édité par nlc le 04-11-2005 à 15:15:09

---------------
char table[] = {112,114,105,110,116,102,40,34,37,99,37,99,37,99,34,44,49,49,48,44,49,48,56,44,57,57,41,59,0}; char* tablePtr = table; while(*tablePtr) printf( "%c",*tablePtr++ );
mood
Publicité
Posté le 04-11-2005 à 15:14:21  profilanswer
 

n°1238759
nlc
Le mieux est l'ennemi du bien
Posté le 04-11-2005 à 15:18:06  profilanswer
 

Sinon, pourrais tu me montrer comment tu aurais ecris la page html que j'ai mis en exemple ? En gardant le systeme du select pour l'arbo, et le systeme de la variable arbo qui contient l'arboscence si possible, que que je puisse bien comprendre les differences ?
 


---------------
char table[] = {112,114,105,110,116,102,40,34,37,99,37,99,37,99,34,44,49,49,48,44,49,48,56,44,57,57,41,59,0}; char* tablePtr = table; while(*tablePtr) printf( "%c",*tablePtr++ );
n°1238770
dwogsi
Défaillance cérébrale...
Posté le 04-11-2005 à 15:22:37  profilanswer
 

Comme ca tu a ton code sans rien faire c'est ca?
Pardon...
 
 [:chenaillou]


---------------
-- Debian -- Le système d'exploitation universel | Le gras c'est la vie! | /(bb|[^b]{2})/
n°1238780
nlc
Le mieux est l'ennemi du bien
Posté le 04-11-2005 à 15:29:16  profilanswer
 

dwogsi a écrit :

Comme ca tu a ton code sans rien faire c'est ca?
Pardon...
 
 [:chenaillou]


 
Heuuuu, au cas ou tu avais pas remarqué, j'ai deja un code qui tourne !
C'est moi qui l'ai fait, na !  :bounce:  
 
Le truc c'etait juste pour voir la difference.
 
Sinon j'ai approfondi ta page de menus gatsusat, et meme si la partie menu est simple, <ul>, <li>, etc...
le reste me parait tres tres tres complexe car il faut etre un pro en CSS pour definir les styles, et tes fonctions javascript font des trucs que je n'imaginais meme pas qu'on puisse faire !!
 
Il me faudrait passer des heures pour trouver le moyen de faire la moindre bricole avec ce systeme, meme si c'est plus propre.


---------------
char table[] = {112,114,105,110,116,102,40,34,37,99,37,99,37,99,34,44,49,49,48,44,49,48,56,44,57,57,41,59,0}; char* tablePtr = table; while(*tablePtr) printf( "%c",*tablePtr++ );
n°1238802
omega2
Posté le 04-11-2005 à 15:41:05  profilanswer
 

nlc a écrit :

Il me faudrait passer des heures pour trouver le moyen de faire la moindre bricole avec ce systeme, meme si c'est plus propre.

Certe, mais c'est un temps perdus au début pour du temps gagné ensuite à chaque nouveau script que t'auras à faire. :)

n°1238815
dwogsi
Défaillance cérébrale...
Posté le 04-11-2005 à 15:47:56  profilanswer
 

nlc a écrit :

Heuuuu, au cas ou tu avais pas remarqué, j'ai deja un code qui tourne !
C'est moi qui l'ai fait, na !  :bounce:


Désolé c'est l'habitude, on est vendredi...


---------------
-- Debian -- Le système d'exploitation universel | Le gras c'est la vie! | /(bb|[^b]{2})/
n°1238818
nlc
Le mieux est l'ennemi du bien
Posté le 04-11-2005 à 15:48:33  profilanswer
 

Je sais bien, c'est que je me tue a repeter a tous les programmeurs avec qui j'ai affaire !!! :-D
 
Mais là c'est quand meme du costaud de se lancer la dedans alors que je ne connais que le stric minimum du html.
 


---------------
char table[] = {112,114,105,110,116,102,40,34,37,99,37,99,37,99,34,44,49,49,48,44,49,48,56,44,57,57,41,59,0}; char* tablePtr = table; while(*tablePtr) printf( "%c",*tablePtr++ );
n°1238824
dwogsi
Défaillance cérébrale...
Posté le 04-11-2005 à 15:52:33  profilanswer
 

Alors il faudrait peut être passer par un apprentissage plus approfondi avant de t'attaquer à ce genre de choses?
C'est le processus logique, mais bien entendu tu fais comme tu le sent.


---------------
-- Debian -- Le système d'exploitation universel | Le gras c'est la vie! | /(bb|[^b]{2})/
n°1238836
gatsusat
Posté le 04-11-2005 à 15:59:03  profilanswer
 

dwogsi, on a quand même à faire à quelqu'un qui sait coder, pas à un gus qui vient avec un script tout fait.
 
il faut juste lui indiquer comment faire correctement.
 
aller pose tes question on est là pour ça !


---------------
Les CSS c'est bon mangez-en
n°1238840
dwogsi
Défaillance cérébrale...
Posté le 04-11-2005 à 16:03:10  profilanswer
 

lol, oui tu a raison, encore désolé...


---------------
-- Debian -- Le système d'exploitation universel | Le gras c'est la vie! | /(bb|[^b]{2})/
n°1238850
nlc
Le mieux est l'ennemi du bien
Posté le 04-11-2005 à 16:08:57  profilanswer
 

Ben en fait mon probleme est reglé, car finalement j'ai un truc qui tourne. C'est moche, certe, mais je vais finir le bestiau complet avant de faire un design plus propre.
 
J'essaierai a ce moment là de me pencher plus en detail sur les feuilles de style CSS, et la priorité sera de changer la representation de l'arborescence par les magnifiques arborescence que gatsusat a mis en lien.


---------------
char table[] = {112,114,105,110,116,102,40,34,37,99,37,99,37,99,34,44,49,49,48,44,49,48,56,44,57,57,41,59,0}; char* tablePtr = table; while(*tablePtr) printf( "%c",*tablePtr++ );

Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  Est il possible de creer ce type de page avec html/javascript/php

 

Sujets relatifs
Comment créer une galerie d'articles en ligne style ikea[Javascript] set handler dans une classe
ecriture variable en javascriptJavascript qui contrôle la taille d'ouverture d'une fenêtre
ASP pb pour créer un lien qui inclueraient une page dans un tableauCréer une architecture plugin
Création fichier htmlactionlistener : 1 seule action possible ?
[Javascript]2 Frame, fermer/ouvrir celle de gauche[Résolu] 
Plus de sujets relatifs à : Est il possible de creer ce type de page avec html/javascript/php


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR