[Résolu] Interpretation de l'attribut HTML5 required

HTML5, CSS3, Javascript, support des mobiles... Que penser de votre site ? Vous manquez d'informations pour la construction d'un site qui puisse s'afficher correctement partout ? C'est un problème simple, un peu complexe ? Venez ici !
Asaiel
Arias
Messages : 2
Inscription : 30 juil. 2015, 13:20

[Résolu] Interpretation de l'attribut HTML5 required

Message par Asaiel »

Bonjour à tous,

Avant de vous soumettre ma question, j'ai effectué une recherche dans le forum "Spécial Webmestre", et n'y ai (sauf erreur) pas trouvé de réponse.

Je développe actuellement un petit formulaire HTML5/PHP à utiliser en interne pour la gestion de mon activité courante. Pour cela, j'utilise notamment:
- jquery-1.10.2
- jquery-ui.js
- PHP Form Builder Class qui utilise lui-même Bootstrap et jquery

Mon formulaire s'articule en plusieurs rubriques, animées par le système "accordion" de jquery. Pour autant, il n'y a bien qu'un seul formulaire (et non un par rubrique).

J'ai dans mon formulaire plusieurs champs ayant l'attribut "required", afin de forcer la saisie de l'utilisateur. Lorsque le formulaire est posté et qu'au moins un champs required n'est pas renseigné, j'obtiens quelquechose de cet ordre (l'infobulle "Veuillez compléter ce champ", pointant vers le champ à renseigner):
Image

Sauf erreur de ma part, ce comportement est bien défini par Firefox, puisque sous Safari, j'obtiens ceci:
Image

Le problème est donc le suivant: lorsque un champ avec l'attribut required n'a pas été renseigné, et se trouve dans une rubrique "repliée" du système accordion, j'obtiens ca:
Image
L'infobulle se trouve renvoyée dans le coin haut gauche de l'écran (puisque le bloc n'est pas affiché).

Ma question est donc la suivante: comment forcer l'obtention d'un résultat identique a celui de safari sous firefox?

Merci d'avance,
Dernière modification par Asaiel le 30 juil. 2015, 14:58, modifié 1 fois.
Asaiel
Arias
Messages : 2
Inscription : 30 juil. 2015, 13:20

Re: Interpretation de l'attribut HTML5 required

Message par Asaiel »

Bon, je me reply moi-même, car bien évidemment, après avoir passé toute la matinée à chercher, je viens de trouver la solution juste après avoir posté le message...

Donc si quelqu'un d'autre est concerné: l'objet form peut être instancié avec un attribut "novalidate", qui permet de résoudre le problème:

Code : Tout sélectionner

$form = new Form("my_form");
$form->configure(array(
    "prevent" => array("bootstrap", "jQuery"),
    "novalidate" => 1
));
Voila :D
Répondre

Qui est en ligne ?

Utilisateurs parcourant ce forum : Aucun utilisateur inscrit et 7 invités