..


Liens sponsorisés

Envoyer un formulaire en plusieurs étapes

Article écrit par Luca Ruggiero

Souvent, lors de l'envoi de données via un formulaire, il est préférable de ne pas présenter à l'utilisateur sous une forme très long afin de ne pas le décourager de compiler une apparence longue et complexe pour ce but, par conséquent, il est conseillé de diviser votre formulaire en plusieurs étapes qui sera présentée en séquence.

Généralement, vous utilisez pour associer - dans chaque bloc - la cohérence des données, comme un formulaire d'inscription sera pottrebbe répartis comme suit: identifiant, mot de passe et e-mail dans le premier bloc du bloc, les données personnelles dans un autre bloc et ainsi de suite.

. Merci à des fonctions intégrées dans le NET Framework, ASP.NET est très simple à réaliser un tel système dans lequel, dans la même page, ce qui se passera:

  1. nous montrons un bloc de données;
  2. nous consulter;
  3. si elle est correcte, nous nous cachons le bloc pour passer à la suivante.
Et ainsi de suite.

Nous arrivons à un exemple pratique, à partir du HTML, bien construit à travers les contrôles serveur. NET:






 <form runat="server">



  



 <p> <asp:literal id="numero" runat="server"/> </ p>



  



 <p> <asp:TextBox id="uno" runat="server"/> </ p>



  



 <p> <asp:Button runat="server" id="c1" text="Continua" onclick="Step1"/> </ p>



  



 <p> <asp:TextBox id="due" runat="server"/> </ p>



  



 <p> <asp:Button runat="server" id="c2" text="Continua" onclick="Step2"/> </ p>



  



 <p> <asp:TextBox id="tre" runat="server"/> </ p>



  



 <p> <asp:Button runat="server" id="c3" text="Conferma" onclick="Step3"/> </ p>



  



 <p> <asp:literal id="messaggio" runat="server"/> </ p>







 </ Form>



Dans notre exemple, chaque étape se compose d'un seul champ et un bouton submit: tous les boutons à l'étape suivante, mais le dernier matériau qui va conduire à une gestion des données.

Nous notons que le début et la fin, nous utilisons deux éléments du texte: le premier est utilisé pour indiquer le numéro de l'étape en cours, tandis que celui du bas affichera les messages d'erreur et de confirmation pour les transactions.

Laissez VB.NET code:






 <script runat="server" Language="VB">







 Private Sub Page_Load (Sender As Object, e As System.EventArgs)



  



 Si Page.IsPostBack = False Then



    



 numero.Text = "Étape 1"



    



 due.Visible = False



    



 tre.Visible = False



    



 c2.Visible = False



    



 c3.Visible = False



  



 End If







 End Sub







 Private Sub Etape 1 (sender As Object, e As System.EventArgs)



  



 Si uno.Text = "" Then



    



 messaggio.Text = "obligatoires!"



    



 Exit Sub



  



 End If



  



 numero.Text = "Etape 2"



  



 uno.Visible = False



  



 due.Visible = True



  



 c1.Visible = False



  



 c2.Visible = True



  



 messaggio.Text = ""







 End Sub







 Private Sub Etape 2 (sender As Object, e As System.EventArgs)



  



 Si due.Text = "" Then



    



 messaggio.Text = "obligatoires!"



    



 Exit Sub



  



 End If



  



 numero.Text = "Etape 3"



  



 due.Visible = False



  



 tre.Visible = True



  



 c2.Visible = False



  



 c3.Visible = True



  



 messaggio.Text = ""







 End Sub







 Private Sub Etape 3 (sender As Object, e As System.EventArgs)



  



 Si tre.Text = "" Then



    



 messaggio.Text = "obligatoires!"



    



 Exit Sub



  



 End If



  



 numero.Text = "Résultat"



  



 tre.Visible = False



  



 c3.Visible = False



  



 End Sub







 </ Script>



Tout d'abord, l'événement de chargement de page s'est produite PostBack pour vérifier que le contenu de cette page n'est pas "faussé". A l'intérieur, afficher le message d'apparaître comme le titre de la première étape et de cacher tous les éléments des prochaines étapes.

Puis nous avons les routines qui permettent de vérifier l'achèvement du champ courant, en cachant l'étape précédente et la prochaine exposition.

Seule la dernière étape ne montrera pas, bien sûr, une prochaine étape, mais effectuer la gestion des données: dans notre exemple, il suffit d'afficher les données vidéo.

Je laisse au lecteur à faire ce qui suit: créer pour chaque étape du côté serveur Label et l'utiliser pour cacher tous les champs en une seule étape (par exemple nom, prénom, identifiant, mot de passe, email, site web).

Dans la même catégorie ...
E-Learning
ASP (Advanced) ASP (Advanced)
Cours complet pour la création de sites Web dynamiques. A partir de 39 €.
ASP.NET (Cours) ASP.NET (Cours)
Cours complet pour construire des applications Web à partir de 49 €.
SQL et bases de données (cours) SQL et bases de données (cours)
Créer et gérer des bases de données relationnelles. A partir de 39 €.
Liens sponsorisés