[ASTUCES]

Rendre son site dynamique et interactif

Modérateur : Modérateurs

Verrouillé

Cette zone vous a été utile ?

Oui
0
Aucun vote
Non
0
Aucun vote
 
Nombre total de votes : 0

McPeter
Membre hyperactif
Membre hyperactif
Messages : 756
Enregistré le : 02 juin 2005, 23:00:00

[ASTUCES]

Message par McPeter » 07 févr. 2008, 09:18:54

Merci de ne pas poster dans cette discussion.
Si vous avez des scripts à proposer, merci de me les faire parvenir via mail ou MP

Cette discussion a pour but de mettre en ligne quelques scripts qui peuvent aider les utilisateurs

@++

Menu :

Cliquer sur l'astuces pour s'y rendre directement.

- <a href="#171323">Récupérer les valeurs d'un select multiple.</a>
- <a href="#171324">Cocher des boutons radios en fonction d'une valeur saisie.</a>
- <a href="#171325">Récupérer la valeur d'un bouton radio.</a>
- <a href="#171326">Afficher une image à partir d'une miniature.</a>
- <a>Afficher une image de fond aléatoirement.</a>
- <a>Créer un formulaire d'envoi d'email.</a>
- <a>Librairie de positionnement d'objet (Lib_JS_Pos_1)</a>
Modifié en dernier par McPeter le 07 févr. 2008, 09:21:49, modifié 2 fois.

McPeter
Membre hyperactif
Membre hyperactif
Messages : 756
Enregistré le : 02 juin 2005, 23:00:00

Récupérer les valeurs d'un select multiple

Message par McPeter » 07 févr. 2008, 09:20:15

Astuces : Récupérer toutes les valeurs d'un champ select de formulaire

Utilité : Pouvoir l'envoyer dans une variable PHP par exemple

Problème :
- Récupérer toutes les valeurs inscrites dans un champ select dans une variables php afin de traiter ces données séparément.
- le problème c'est qu'il fallait déjà au départ sélectionner tous les items du select pour les envoyer via un formulaire
- ensuite vient le traitement de la variable envoyé (qui n'est pas reconnu comme un tableau :o( )

Auteur : McPeter
Compatibilité : IE 6.0 et Netscape 6

Code : Tout sélectionner

<?php
// Traitement après post et affichage des valeurs du champ select
if ($HTTP_POST_VARS["Col1"] != "")
{
    $Col1_Array = $HTTP_POST_VARS["Col1"]; 
    for ($num = 0; $num < count($Col1_Array); $num++)
    {
      echo $Col1_Array[$num]."<br>";
    }
}
?>
<html>
<head>
<title>Recuperer valeur select dans variable php</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<script>
function PostSelect(liste)
{
    // On compte le nombre d'item de la liste select
    NbCol1 = document.forms[liste].elements.Col1.length;
    
    // On lance une boucle pour selectionner tous les items
    for (a = 0; a < NbCol1; a++)
    {
      document.forms[liste].elements.Col1.options[a].selected = TRUE;
    }
    
    // On modifie l'ID  du champ select pour que PHP traite cette 
    // dernière comme un array
    document.forms[liste].elements.Col1.name = "Col1[]";

    // On soumet le formulaire
    document.forms[liste].submit();
}
</script>
</head>

<body>
<form name="Liste1" method="post" action="capture_select.php">
    <select name="Col1" size="4" multiple style="width: 150px">
    <option value="Valeur 1">Valeur 1</option>
    <option value="Valeur 2">Valeur 2</option>
    <option value="Valeur 3">Valeur 3</option>
    <option value="Valeur 4">Valeur 4</option>
    <option value="Valeur 5">Valeur 5</option>
    </select><br><br>
    <input name="Envoyer" type="button" value="Envoyer" onClick="javascript:PostSelect('Liste1')">
</form>
</body>
</html>
Modifié en dernier par McPeter le 07 févr. 2008, 09:44:51, modifié 1 fois.

McPeter
Membre hyperactif
Membre hyperactif
Messages : 756
Enregistré le : 02 juin 2005, 23:00:00

Cocher des case CheckBox en fonction d'une autre case

Message par McPeter » 07 févr. 2008, 09:29:10

Astuces : Cocher des cases de type "checkbox" en fonction d'autres cases "checkbox"

Utilité : par exemple, si vous avez une série de case à cocher pour des options, et que vous voulez pouvoir les cocher / décocher toutes.

Auteur : McPeter
Compatibilité : IE 6.0 et Netscape 6

Code : Tout sélectionner

<form>
<input name="check1" type="checkbox" value="valeur 1" >Valeur 1
<br>
<input name="check2" type="checkbox" value="valeur 2" >Valeur 2
<br>
<input name="CheckAll" type="checkbox"  onClick="ChekBox(this.form.CheckAll)">Tous<br>
</form>
<script language="javascript">
function ChekBox(tous)
{
  if (tous.checked)
  {
    document.forms[0].elements.check1.checked = true;
    document.forms[0].elements.check2.checked = true;
  }
  else
  {
    document.forms[0].elements.check1.checked = false;
    document.forms[0].elements.check2.checked = false;
  }
}
</script>
Modifié en dernier par McPeter le 07 févr. 2008, 09:45:38, modifié 1 fois.

McPeter
Membre hyperactif
Membre hyperactif
Messages : 756
Enregistré le : 02 juin 2005, 23:00:00

Récupérer la valeur d'un bouton radio.

Message par McPeter » 07 févr. 2008, 09:36:19

Astuces : Récupérer et voir la valeur d'un bouton de type "radio"

Utilité : Traiter un formulaire en fonction de la valeur d'une option choisi dans un bouton de type "radio"

Auteur : McPeter
Compatibilité : IE 6.0 et Netscape 6

Code : Tout sélectionner

<form>
<input type="text" name="visu"><br>
<input name="option" type="radio" value="Option 1">Option 1
<br>
<input name="option" type="radio" value="Option 2">Option 2
<br>
<input name="" type="button" value="Voir" onclick="ViewValue(this.form.option)">
</form>
<script language="javascript">
function ViewValue(radio)
{
  for (var a=0; a<radio.length;a++)
  {
    if (radio[a].checked)
    {
      document.forms[0].elements.visu.value=radio[a].value;
    }
  }
}
</script>
Modifié en dernier par McPeter le 07 févr. 2008, 09:46:42, modifié 1 fois.

McPeter
Membre hyperactif
Membre hyperactif
Messages : 756
Enregistré le : 02 juin 2005, 23:00:00

Afficher une image à partir d'une miniature.

Message par McPeter » 07 févr. 2008, 09:41:54

Astuces : Afficher une image dans son format d'origine à partir d'une vignette et ce dans une page html avec différents réglages


Utilité : Permet par exemple d'éviter de créer autant de pages que vous avez d'images (les pages sont générées via le script)

Auteur : McPeter
Compatibilité : IE 6.0, Crazy Broswer et Netsacpe 6.0

Code : Tout sélectionner

<SCRIPT LANGUAGE="JavaScript">
 /***************************************************************************
  *  Ouvre une nouvelle fenêtre plein ecran sur click d'une vignette 
  *  et affiche votre image.
  *  Cette dernière est centrée dans la fenêtre.
  *  Possibilité d'insérer différents paramêtres :
  *  - Nom affiché par l'url
  *  - Nom de la nouvelle fenêtre
  *  - Couleur et taille de la bordure autour de l'image
  *  - espacement entre la bordure et l'image
  *  - Couleur de fond ( derrière l'image ) 
  ***************************************************************************/

function AfficheImage(CommentImage,UrlImage)
{
// Variable de la nouvelle fenêtre
// Nom affiché dans la barre de titre du Pop Up
var TitleViewver = "Mon visualisateur d'image";
// Url affiché dans la barre d'url du PopUp (pour les navigateurs type Crazy Broswer)
var UrlViewver = "No_Url";
// Autorisation diverse pour la fenêtre Pop Up ( Aucune modif neccessaire pour les navigateurs de type CrazyBroswer => tout est affiché :p )
var LocationBar ="no"; // Afficher la barre d'url ( yes / no )
var ToolBar = "no"; // Afficher la barre d'outils ( yes / no )
var MenuBar = "no"; // Afficher la barre de menu ( yes / no )
var StatusBar = "no"; // Afficher la barre de statuts ( yes / no )
var ScrollBar = "no"; // Afficher l'acenseur ( yes / no )

// Couleur de fond
var ColorGround = "#CCCCCC";
// Couleur de la bordure
var ColorBorder = "#0033CC";
// Taille de la bordure (par deffaut : 2 pixels )
var WeightBorder = "2";
// Espace entre la bordure et l'image (par deffaut : 4 pixels )
var Cellpadding = "4";

// NE RIEN MODIFIER ICI //
MonVisuel=open(UrlViewver,"","locationbar="+LocationBar+", toolbar="+ToolBar+", menubar="+MenuBar+", statusbar = "+StatusBar+", scrollbar= "+ScrollBar+"");
MonVisuel.document.open();
MonVisuel.document.write("<html><head><title>"+TitleViewver+"</title></head><body>");
MonVisuel.document.write("<table width=100% height=100% border=0 cellpadding=0 cellspacing=0>");
MonVisuel.document.write("<tr><td valign=middle>");
MonVisuel.document.write("<table border="+WeightBorder+" align=center cellpadding="+Cellpadding+" cellspacing=0 style=\"border-color: "+ColorBorder+"; background-color:"+ColorGround+"\">");
MonVisuel.document.write("<tr><td align=center valign=middle>"+CommentImage+"<br><br>");
MonVisuel.document.write("<img src=\""+UrlImage+"\" border=0>");
MonVisuel.document.write("<br><br><a href='javascript:window.close()'>Fermer cette fenêtre</a>");
MonVisuel.document.write("</td></tr></table></td></tr></table>");
MonVisuel.document.write("</body></html>");
MonVisuel.document.close();
}
</SCRIPT>
Comment utiliser ce script ?

Il suffit d'insérer le lien sous cette forme :

Code : Tout sélectionner

<a href="javascript:AfficheImage('C\'est ma plus belle image','../photos/mon_image.gif')"> 
<img src="../photos/ma_miniature.gif" width="195" height="146" border="1" alt=""></a></td>
ne pas oublier que pour les infos fournis dans le lien : "javascript:AfficheImage('C\'est ma plus belle image','../photos/mon_image.gif')" si tu dois utiliser des apostrophes ou des guillements, de les faire précéder par l'antislash => \

Verrouillé

Retourner vers « JavaScript »

Qui est en ligne

Utilisateurs parcourant ce forum : Aucun utilisateur enregistré et 6 invités