2009-10-30 4 views
1

Dans mon code HTML, j'ai une étiquette de formulaire qui contient deux zones de saisie, un nom d'utilisateur et un mot de passe. Le formulaire soumet les valeurs à un fichier PHP qui valide les valeurs avec la base de données et redirige vers une autre page si la connexion est réussie.L'étiquette de formulaire est-elle nécessaire?

Le problème avec cette approche est que, si AJAX n'est pas impliqué, il actualise la page même si la connexion est infructueuse.

Je voudrais supprimer complètement le tag de forme, fusionner le code PHP dans le même fichier que le HTML. Pour cela, j'ai tenté d'ajouter un événement onclick() dans les zones de saisie. Mais puisque l'étiquette de forme a été enlevée, quelque chose d'étrange s'est produit. J'ai choisi les valeurs en utilisant: document.getElementByID

Je veux savoir s'il est nécessaire d'inclure une étiquette d'entrée dans l'étiquette de formulaire? Si je veux juste la zone de saisie et que je souhaite effectuer une opération en utilisant l'événement onclick, cela fonctionnerait-il?

Répondre

2

Si vous voulez les mettre dans un formulaire, vous pouvez toujours; il suffit de ne pas mettre un bouton de soumission sur le formulaire. Si vous utilisez un élément <button type="button">, le bouton ne doit pas déclencher la soumission du formulaire.

+0

@John: C'est right? – RKh

+0

Non, HTML 4 a un tag '

2

Il n'est pas nécessaire de soumettre le formulaire si vous écrivez vos propres gestionnaires à l'aide de onClick(). Mais vous devez conserver une majoration HTML sémantique.

11

Ma méthode préférée consiste à laisser la balise <form> mais à capturer l'événement onsubmit du formulaire et juste return false.

<form name="foo" id="foo" action="" method="post"> 
    <input type="text" name="bar" id="bar" /> 
</form> 

Voici un code approximatif de PrototypeJS qui illustre l'approche.

<script type="text/javascript"> 
    //Handle the window onload event 
    Event.observe(window, 'load', function() { 

    //Handle the form submit event 
    Event.observe($('foo'), 'submit', function(event) { 
     //Stop the event so the form doesn't actually submit 
     Event.stop(event); 
    }); 

    }); 
</script> 
+0

Je pense que c'est la meilleure solution à votre problème. vous pouvez supprimer la balise de formulaire, modifier le type d'entrée sur soumettre au bouton et utiliser onClick(), mais pourquoi voudriez-vous? De cette façon, le balisage est plus sensé. – GSto

+3

L'avantage de cette méthode est que si vous connectez également le côté serveur du formulaire, cela fonctionne même si JavaScript est désactivé. –

+0

@John, excellent point. –

0

Il n'est pas nécessaire, cependant, vous devez vous assurer que la forme est toujours utilisable. La balise de formulaire fournit une meilleure navigation par touches à onglets, ainsi que la possibilité de soumettre en appuyant sur la touche Entrée. Vous pouvez les émuler en javascript, mais méfiez-vous de cela. Si vous le souhaitez, vous pouvez essayer de définir l'URL d'action de la balise de formulaire sur <form action="javascript:submitLogin();">, ce qui permet de valider le formulaire. Si javascript était désactivé, rien ne se passerait.

0

Bien qu'il soit généralement recommandé, il n'est pas nécessaire. En fait il valide comme html 4.01 strict sans is.

2

Il n'est pas nécessaire qu'une balise d'entrée soit incluse dans une balise de formulaire pour que le site fonctionne comme vous le souhaitez. Toutefois, vous devez créer votre site de manière à ce que la majorité des utilisateurs puissent l'utiliser. Donc, pour les utilisateurs qui n'ont pas activé JavaScript ou qui consultent votre site avec un navigateur qui n'a pas de fonctionnalités JavaScript, vous devriez développer votre site pour qu'ils aient une bonne expérience.

Le comportement AJAX doit être ajouté après que le site fonctionne correctement sans JavaScript activé, suivant les principes Progressive Enhancement. Le meilleur moyen d'empêcher le formulaire d'exécuter le comportement par défaut est comme indiqué par Mark - return false sur le gestionnaire d'événement onsubmit du formulaire.

Vous aurez également besoin de la balise de formulaire si vous essayez de créer du code HTML sémantique qui réussit la validation.