PhP : bouton image et bouton submit

[gregg]

voila pour un site que je crée j'ai besoin d'un calendrier pop up en javascript. ca fonctionne

mon problème viensdu fait que ca marche très bien lorsque c'est un bouton (input type=button), mais j'aurais aimé mettre l'image d'un calendrier a la place d'un bouton donc j'ai essayé (input type=image).

 

avec le bouton normal : ca marche sans probleme

avec l'image, il m'envoie deja tous les éléments, si je met mon formulaire en GET, je vois que tout est passée, mais pas avec le bouton.

 

est que qqun a une idée?

 

avec le bouton :

		<tr><td align="left">date de debut</td>
		<td align="left"><input type="text" name="date_debut"></td>
		<td align="left"><input type="button"  onClick=window.open("mycalendar.php?form=formu&elem=date_debut","Calendrier","width=200","height=220")>
</td></tr>

avec l'image.

		<tr><td align="left" border="2">date de fin</td>
		<td align="left"><input type="text" name="date_fin"></td>
		<td align="left"><input type="image" src="images/interface/calendrier.jpg" width="20" height="20" onClick=window.open("mycalendar.php?form=formu&elem=date_fin","Calendrier","width=200","height=220")></input>

merci d'avance.

Greg

[Dylav]

Quelques remarques en vrac,

• je suppose que ton code est très partiel, et que ta balise <INPUT> est encapsulée entre des balises <FORM> et </FORM>,
  
• la balise </INPUT> n'existe pas ( la balise <INPUT> n'est pas une balise “à contenu”), mais je ne pense pas que ce soit sa présence qui gêne,
  
• tu ne devrais pas utiliser le subterfuge des tableaux (balises <TABLE>, <TR> et <TD>) pour mettre tes pages WEB en forme, c'est un détournement qui pénalise l'accès aux handicapés visuels (auxquels des dispositifs audio décrivent le contenu de la page en fonction de sa structure : un tableau est destiné à décrire une énumération, alors tu vois la confusion)...
  

[gregg]

oui c'est dans un form.

mais pour l'instant c'est vraiment le bete formulaire, quasi identique a mes autres classes qui fonctionnent elles très bien.

c'est pour ca que je poste que mes input car il me semble vraiment que le probleme se situe la.

 

-pour le dernier probleme que tu soulignes : c'est un projet que je doit rendre, et a l'ecole on ne m'a jamais parler de ca.

as tu un site qui explique ce système pour les malvoyant ? (si oui je suis interressé pour ma culture personnelle. merci)

 

 

et pour le probleme du bouton? pas d'idée?

 

j'ai essayé aussi de faire je le shynthetise.

<input type=button><img src=...></img></input>

 

mais ca ne marche pas.

 

je teste.

 

merci

greg

[KewlCat]

Les input de type image soumettent le formulaire (comme les input de type submit) !

Ce qu'il te faut, c'est une bête image (si c'est ça qui te chagrine, sache qu'on peut mettre un onclick sur autre chose qu'un input, et ça marche tout aussi bien) et pas un input.

[Dylav]

À propos d'accessibilité, voir la « Loi sur le Handicap » du 11 février 2005 et, plus précisément, son article 47 : depuis déjà plus de quatre ans, tout site officiel se doit de respecter les standards permettant de faciliter l'accès des handicapés à la Toile. Voir aussi, par exemple, le site « L'accessibilité en marche » qui, en rappelant les obligations légales, donne des conseils dans ce domaine.

[gregg]

deja merci a vous.

 

donc j'ai essayé avec un <img src

mais j'ai un petit soucis, il ne m'affiche pas l'image mais le lien fonctionne.

et je ne vois pas l'erreur dans mon code.

 

 

<tr><td align="left" border="2">date de debut img</td><td align="left"><input type="text" name="date_debut"></td>

<td align="left><img src="images/interface/calendrier.jpg" onClick=window.open("mycalendar.php?form=formu&elem=date_debut","Calendrier","width=200","height=220")></td></tr>

 

avec ca le lien fonctionne j'ai bien mon calendrier qui s'ouvre mais helas j'ai pas l'image...

je clique juste a coté de l'edit ou l'image est censé se trouver mais je ne la vois pas.

 

pour l'accessibilité j'aurais pas le temps de tout changer, donc je vais l'expliquer dans mon dossier.

 

merci à vous.

Modifié le 24 mai 2009 par gregg

[Dylav]

Si tu dis que tu ne vois pas l'image et que tu cliques au jugé, j'en déduis que le navigateur avec lequel tu testes ta page n'est pas Internet Explorer, car tu verrais le fameux petit carré

 

Dans la norme HTML, l'attribut alt est obligatoire pour la balise <img>. Il s'agit d'un texte alternatif qui s'affiche à la place de l'image lorsqu'elle ne peut être affichée. Il est également destiné aux navigateurs alternatifs (textes ou vocaux, on retrouve les notions d'accessibilité).

<img src="images/interface/calendrier.jpg" alt="calendrier">

Si tu ne vois apparaître que le texte alternatif c'est probablement que l'URL de ton image est inexacte.

[gregg]

je test sur IE et mozilla.

mais je n'ai meme pas le texte alternatif ni l'icone avec la croix ou sous mozilla une feuille dechiré en deux.

et si je sors la balise img du <td> alors ca marche.

hors j'ai deja fait un tableau avec des images dedans.

 

 

donc je ne vois pas du tout mon erreur.

ca peut vraiment etre casse tete de temps en temps....

 

merci d'avance

[KewlCat]

Fais attention à tes ouvertures / fermetures de guillemets !

Au passage, aux endroits où tu veux mettre du Javascript mais que tu es déjà dans des guillemets, entoure les chaînes de caractères avec des apostrophes et non avec des guillemets :

<td align="left>
 <img src="images/interface/calendrier.jpg" onClick=window.open("mycalendar.php?form=formu&elem=date_debut","Calendrier","width=200","height=220")>
</td>

...devient...

<td align="left">
 <img src="images/interface/calendrier.jpg" alt="calendrier"
   onclick="window.open('mycalendar.php?form=formu&elem=date_debut','Calendrier','width=200,height=220')" />
</td>

[Dylav]

Les guillemets, bien sûr… Où avais-je la tête ?

 

Pour repérer rapidement une erreur de ce type, tu peux prendre l'habitude de soumettre ton code à un validateur, par exemple celui du W3C (la référence) : l'erreur te sautera aux yeux…

(clique sur l'image pour l'agrandir)