jquery: masquer/afficher quelque chose après le formulaire submit/page recharge

Question

Sur ma page, j'ai des formulaires qui par défaut .hide() lorsque la page est chargée. Ces deux formes sont la création de compte et la connexion. Ils sont montrés à l'utilisateur une fois qu'ils cliquent sur le lien approprié (.show()).

Évidemment, s'il y a un échec avec l'un ou l'autre formulaire, j'aimerais que le formulaire reste ouvert au lieu de se cacher après le chargement de la page.

À l'heure actuelle, les formulaires utilisent l'affichage simple du formulaire HTML pour accéder à la base de données. Y aurait-il une meilleure façon de faire cela avec jquery, ce qui n'est pas trop compliqué? (Je suis encore assez nouveau pour elle, mais l'apprentissage)

Merci

Answer 1

Vous pouvez affecter un gestionnaire à l'action 'submit' d'un formulaire et faire ce que vous voulez avec. Envoyez-le de manière asynchrone, supprimez à nouveau le formulaire, laissez-le là, peu importe. Voici un point de départ:

$('#myloginform').submit(function() { 
    var form = $(this); 
    $.post(
    form.attr('action'), 
    form.serialize(), 
    success: function(response) { 
     // do something when all is well 
     form.hide(); 
    }, 
    failure: function(respones) { 
     // do something when everything explodes 
     form.addClass('error'); 
    } 
); 
    return false; // don't fire the regular handler 
}); 

La documentation de l'API jQuery vous donnera de plus amples détails sur les deux la submit (et similaire) gestionnaire ainsi que $.post et amis.

modifier: Ce code doit aller dans votre gestionnaire $(document).ready, je suppose que vous avez déjà vos show s et hide s là-dedans.

Answer 2

Je voudrais essayer la jQuery Form Plugin. Il vous permet de poster un formulaire en utilisant ajax.

En cas de réussite, vous pouvez rediriger le navigateur vers l'emplacement auquel il aurait normalement dû aller lors de l'envoi.

En cas d'erreur, vous pouvez afficher un message d'erreur et garder l'utilisateur sur le formulaire.

Answer 3

En supposant que vous ne pouvez pas utiliser ajax, ajoutez quelque chose à l'URL ou au corps de la page qui indique qu'une erreur s'est produite. Puis faire quelque chose comme ..

jQuery(document).ready(function() 
{ 
    if(form_error) // check for the error in some way (query_string, a div with an 'error class' 
    { 
    jQuery('.form-selector').show(); 
    } 
});