2010-10-08 2 views
7

J'ai un formulaire d'inscription dans ASP.NET 2.0. Je veux enregistrer mes champs de formulaire d'inscription soit en cliquant sur le bouton Soumettre ou ils devraient être sauvegardés toutes les cinq secondes.Comment implémenter une fonctionnalité "Enregistrer automatiquement" ou "Enregistrer le brouillon" dans ASP.NET?

Par exemple, j'ai trois champs dans ma page d'inscription:

UID PWD Name

L'utilisateur a saisi UID et PWD et alors qu'il entre dans Name les valeurs précédentes devraient être sauvé sans interruption des entrées utilisateur

Comment ferais-je cela dans ASP.NET?

Répondre

9

Vous pouvez le faire avec un extrait de Javascript & jQuery. Avoir une fonction qui est déclenchée par une minuterie qui lit périodiquement les données de formulaire que vous souhaitez enregistrer et les reporte sur une page SaveDraft.aspx. Dans cette page persiste les données quelque part (comme une base de données).

Si l'utilisateur se déconnecte ou si sa session est perdue, vous pouvez interroger ces données et pré-remplir le formulaire si les données existent.

Sur votre page ASPX saisie de données:

// Usual ASP.NET page directives go here 

<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head runat="server"> 
    <script type="text/javascript" src="Scripts/jquery-1.4.1.min.js" ></script> 
    </head> 
    <body> 
    <form id="form1" runat="server"> 
     <div> 
     <asp:textbox id="username" runat="server" /><br /> 
     <asp:textbox id="password" runat="server" /><br /> 
     <asp:textbox id="realName" runat="server" /><br /> 
     <asp:button id="Submit" onclick="Submit_Click" 
       usesubmitbehavior="true" runat="server" /> 
     </div> 
    </form> 

    <script type="text/javascript"> 
     $(document).ready(function() { 
     // Configure to save every 5 seconds 
     window.setInterval(saveDraft, 5000); 
     }); 

     // The magic happens here... 
     function saveDraft() { 
     $.ajax({ 
      type: "POST", 
      url: "SaveDraft.aspx", 
      data: ({ 
      username: $("#<%=username.ClientID %>").val(), 
      password: $("#<%=password.ClientID %>").val(), 
      realName: $("#<%=realName.ClientID %>").val() 
      }), 
      success: function (response) { 
      alert('saved draft'); 
      } 
     }); 
     } 
    </script> 
    </body> 
</html> 

Dans votre page SaveDraft.aspx:

public partial class SaveDraft : System.Web.UI.Page 
{ 
    protected void Page_Load(object sender, EventArgs e) 
    { 
    string username = Request.Form["username"]; 
    string password = Request.Form["password"]; 
    string realName = Request.Form["realName"]; 

    // Save data somewhere at this point  
    } 
} 

Cela devrait vous commencer.

+0

pouvez-vous afficher la fonction et l'appel de la minuterie aussi? – Sandy

+0

J'ai compris votre point. Mais je ne sais pas comment faire ça? donc si vous publiez le code source qui sera facile pour moi. – Sandy

+0

@Sandy - J'ai mis à jour ma réponse avec un prototype – Kev

Questions connexes