11548 sujets

JavaScript, DOM et API Web HTML5

Pages :
Hello,
j'ai un problème récurrent du à Javascript; je charge une page en fonction de sur quoi je clique dans ma listebox.
Seulement ca ne fonctionne que sous firefox; IE ne bouge pas d'un poil lors de la selection d'un composant de la textbox.

echo "  value=\"accueil\" "; if ($type == "accueil"){echo(" selected");} echo ">Accueil</option>
	  <option onClick=\"javascript:document.location.href='defilement.php?type=sport';\"   "; echo "  value=\"sport\" "; if ($type == "sport"){echo(" selected");} echo ">Sport</option>
	<option onClick=\"javascript:document.location.href='defilement.php?type=Coordination-Territoriale';\"   "; echo "  value=\"Coordination Territoriale\" "; if ($type == "Coordination-Territoriale"){echo(" selected");} echo ">Coordination Territoriale</option>
<option onClick=\"javascript:document.location.href='defilement.php?type=Economie';\"   "; echo "  value=\"Economie\" "; if ($type == "Economie"){echo(" selected");} echo ">Economie</option>
<option onClick=\"javascript:document.location.href='defilement.php?type=environnement';\"   "; echo "  value=\"Environnement\" "; if ($type == "environnement"){echo(" selected");} echo ">environnement</option>
	  </select></b></div>";


Cordialement,
merci de votre aide
Modifié par BnJ (05 Nov 2005 - 14:47)
Modérateur
BnJ a écrit :
pardon jeune homme?


Smiley rolleyes

Sur un onclick, inutile de préciser "javascript:" :


<element onclick="document.blahblah" ... />


Ce qui a dans le onclick est automatiquement du javascript.

Si tu es bien en train de faire ce que je crois, normalement, ce n'est pas sur l'événement onclick de chaque option du menu déroulant que tu devrais faire appel à ton script, mais plutôt sur l'événement onchange de l'élément select. Sur onchange, tu récupère l'option sélectionnée, et tu fais ta redirection en conséquence.

Attention par contre. La soumission ou le chargement automatique d'une page sur l'événement onchange d'un menu déroulant rend cette fonction innaccessible pour la navigation au clavier. Voir Pan sur les doigts
Modifié par Merkel (01 Nov 2005 - 21:14)
j'ai viré javascript : et maintenant ya plus rien qui charge sur 1 on click, sur les 2 navigateurs =)
Modérateur
Peux-tu nous montrer le code final, après le traitement php ? Ca rendrait la lecture du code plus facile. On pourrait également le passer au navigateur W3C.

Si ta page est en ligne, ce serait encore mieux d'avoir l'url.
Modifié par Merkel (01 Nov 2005 - 21:15)
c 1 page protégé donc je ne peux pas trop Smiley lol

<?
include ("includes/conf.php");

session_start();

if(!isset ($_SESSION['pseudo'])) // o faire if (isset ($_SESSION['pseudo'))

{
header("location: accueil.php");
exit;

}else {

include ("headeradmin.php");
}
?>


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<?
if ($_POST['action']=="send")
{
$texte=trim($_POST['texte']);
$texte=stripslashes($texte);
$texte=addslashes($texte);
$couleur=$_POST['couleur'];

	if ($couleur=="aucune") {
	$msg="Veuillez choisir une couleur svp";
	}
	if ($couleur=="bleufonce") 
	{
		$hexa="2F0ED9";
	}
	if ($couleur=="bleuclair")
	{
		$hexa="19EFE2";
	}
	if ($couleur=="vert")
	{
		$hexa="19DA0A";
	}
	if ($couleur=="rouge")
	{
		$hexa="F95615";
	}
	
	
if ($couleur!="aucune")
{

$Reqmodif="UPDATE defilement SET texte='$texte',Couleur='$hexa' WHERE type='$type'";

$Req = mysql_query($Reqmodif) or die('Erreur SQL !<br>'.$Reqmodif.'<br>'.mysql_error()); 

echo "<script language=javascript>document.location='accueil.php'; ";
	
echo "alert('La barre de défilement a bien été modifiée');";
echo "</script>"; 
exit();
}else { 
echo "<center><font color=\"#ff0000\"><b>$msg</b></font></center><br>";
}
}



$type=$_GET['type'];
$req="SELECT Couleur,texte FROM defilement WHERE type='$type'";

$effect=mysql_query($req);

$aha=mysql_fetch_array($effect);


$color=$aha["Couleur"];
$texte=$aha["texte"];

echo "<form name=form  action=\"defilement.php\" method=\"post\">";

echo "<input type=\"hidden\" name=\"action\" value=\"send\">";

echo "<div align=center style=\"  margin-left: auto;
  margin-right:auto ;width: 25%; vertical-align:center; font-variant:small-caps; font-size:16pt;  border-width:1px; border-color:1CDC2E; border-style:dotted; margin-top:1cm; \"><b>Gestion de la barre de defilement</b></div>";
echo "<div style=\" margin-top:2cm; left:5px;  \"><b>Barre de défilement concerné : <select name=\"type\" >";
	
	echo "  <option onClick=\"javascript:document.location='defilement.php?type=accueil';\"";

 echo "  value=\"accueil\" "; if ($type == "accueil"){echo(" selected");} echo ">Accueil</option>
	  <option onChange=\"document.location.href='defilement.php?type=sport';\"   "; echo "  value=\"sport\" "; if ($type == "sport"){echo(" selected");} echo ">Sport</option>
	<option onChange=\"document.location.href='defilement.php?type=Coordination-Territoriale';\"   "; echo "  value=\"Coordination Territoriale\" "; if ($type == "Coordination-Territoriale"){echo(" selected");} echo ">Coordination Territoriale</option>
<option onChange=\"document.location.href='defilement.php?type=Economie';\"   "; echo "  value=\"Economie\" "; if ($type == "Economie"){echo(" selected");} echo ">Economie</option>
<option onChange=\"document.location.href='defilement.php?type=environnement';\"   "; echo "  value=\"Environnement\" "; if ($type == "environnement"){echo(" selected");} echo ">environnement</option>
	  </select></b></div>";

echo "<div style=\" margin-top:1cm; left:5px; vertical-align:middle; \"><b>Texte : </b></div>
<div><textarea style=\" -moz-border-radius: 6px; border: 1px solid #0ED922; \" name=\"texte\"
	  maxlength=\"350\" cols=80 rows=4 wrap=hard>".$texte."</textarea> </div>";




echo "<div style=\" margin-top:1cm; left:5px; vertical-align:middle; \"><b>Choix de la couleur : <select name=\"couleur\" >
	  <option value=\"aucune\">Choisissez</option>
	  <option style=\"color:2F0ED9; \" value=\"bleufonce\" "; if ($color == "2F0ED9"){echo(" selected");} echo ">Bleu foncé</option>
	  <option style=\"color:19EFE2; \"value=\"bleuclair\" "; if ($color == "19EFE2"){echo(" selected");} echo ">Bleu clair</option>
	  <option style=\"color:19DA0A; \" value=\"vert\" "; if ($color == "19DA0A"){echo(" selected");} echo ">vert</option>
	  <option style=\"color:F95615; \"value=\"rouge\" "; if ($color == "F95615"){echo(" selected");} echo ">rouge</option>
	  </select></b></div>";
echo "<div style=\"margin-top:1cm; \"><input type=\"image\" style=\" border: 0px solid #0ED922; \"  name=\"submit\" src=\"gfx/valid2.gif\" /> </div></form>";
echo "<div style=\" margin-top:1cm; \"><a href=accueil.php> Retour Accueil </div>";

?>
Modérateur
Ce que je veux dire, c'est que tu pourrais aller sur ta page, faire Affichage - Source, copier le code html généré par PHP, et nous le montrer ici. Là on a le droit à un beau mélange html/javascript/php. C'est pas de tout repos pour t'aider. Smiley smile Il nous faudrait QUE le code html et javascript.

a+
Modifié par Merkel (01 Nov 2005 - 21:39)
Bonsoir,
Merkel a écrit :

Attention par contre. La soumission ou le chargement automatique d'une page sur l'événement onchange d'un menu déroulant rend cette fonction innaccessible pour la navigation au clavier. Voir Pan sur les doigts


+1, en effet c'est très énervant, le submit automatique.

Sinon, IE ne supporte aucun évènement javascript sur un élément option.
Modérateur
BnJ a écrit :
comment faire dans ce cas QUentin ?


Peux-tu nous expliquer exactement ce que tu as envie de réaliser et dans quel but ? Donnes le maximum de détails. Nous pourrons alors te conseiller sur la meilleure méthode.
en fait j'arrive sur 1 page , et j'ai une listebox au cas ou je veux changer de page, tout de suite, quand je clique dans une option de la liste ca doit changer de page, c'est pour de l'administration .
Aha tu fais comme tout le monde alors : un bouton

Exemple :

<select id="masel">
<option value="page1.html">Page 1</option>
<option value="page2.html">Page 2</option>
...
</select>
<input type="button" onclick="var o = document.getElementById('masel'); document.location=o.options[o.selectedIndex].value; " value="Go !" />

Modifié par QuentinC (02 Nov 2005 - 17:59)
Modérateur
QuentinC, c'est quoi le code après le <select id="mase1">


('document.location=masel;', 2000);">


Il sert à quoi ? Je ne sais pas si c'est le forum qui a transformé ton code, ou que tu as fais une erreur de frappe, mais ce code est invalide. Peux-tu confirmer si tout est bon ? Smiley confus
En effet c'est une faute de frappe.
Je vais immédiatement éditer le post pour corriger l'erreur.
Au départ, j'ai pensé à mettre onchange + setTimeout, puis j'ai changé d'avis pour proposer un bouton, et une partie de l'ancien code est resté...
Modérateur
BnJ a écrit :
en fait 1 POST avec document.location marche ?


Qu'est-ce que tu veux dire ? En fait, avec document.location, le formulaire n'est jamais envoyé. Le javascript fait seulement changer de page. Donc POST n'a pas lieu.
Si tu veux dire par là passer des informations en mode POST avec document.location, la réponse est non.
Pages :