1. Create a database, right-click the project app_data, add a database, and create a userinfo table. The table contains two fields: username and password.
2. Create a new default. aspx page with a simple table layout,CodeAs follows:
<Body> <Form ID = "form1" runat = "server"> <Table> <tr> <TD> old password: </TD> <asp: textbox id = "txtoldpass" runat = "server"> </ASP: textbox> <asp: requiredfieldvalidator id = "requiredfieldvalidator1" runat = "server" errormessage = "requiredfieldvalidator" controltovalidate = "txtoldpass"> * </ASP: requiredfieldvalidator> <span id = "MSG"> </span> </TD> </tr> <TD> new password: </TD> <asp: textbox id = "txtnewpass" runat = "server"> </ASP: textbox> <asp: requiredfieldvalidator id = "requiredfieldvalidator2" runat = "server" errormessage = "requiredfieldvalidator" controltovalidate = "txtnewpass"> * </ASP: requiredfieldvalidator> </TD> </tr> <TD> confirm the new password: </TD> <asp: textbox id = "txtconfirmpass" runat = "server"> </ASP: textbox> <asp: requiredfieldvalidator id = "required" runat = "server" errormessage = "requiredfieldvalidator" display = "dynamic" controltovalidate = "txtconfirmpass"> * </ASP: requiredfieldvalidator> Asp: comparevalidator id = "comparevalidator1" runat = "server" errormessage = "comparevalidator" controltocompare = "txtnewpass" controltovalidate = "txtconfirmpass"> two passwords are inconsistent </ASP: comparevalidator> </TD> </tr> <TD colspan = "2" align = "center"> <asp: button id = "btnmodify" runat = "server" text = "modify"/> </TD> </tr> </table> </form> </body>
3. Create a New WebService named checkpassword. asmx. Note that the [system. Web. Script. Services. scriptservice] annotation is canceled.
The Code is as follows:
/// <Summary> /// Summary of checkpassword /// </Summary> [WebService (namespace = "http://tempuri.org/")] [webservicebinding (conformsto = wsiprofiles. basicprofile1_1)] [system. componentmodel. toolboxitem (false)] // to allow ASP. net Ajax calls this web service from the script. Please cancel the comments to the downstream. [System. web. script. services. scriptservice] public class checkpassword: system. web. services. webService {[webmethod] Public String iscorrectpass (string username, string password) {string connstr = configurationmanager. connectionstrings ["connectionstring"]. connectionstring; string word = ""; using (sqlconnection conn = new sqlconnection (connstr) {using (sqlcommand cmd = new sqlcommand (string. format ("select password from userinfo where username = '{0}'", username), Conn) {Conn. open (); word = cmd. executescalar (). tostring (); If (WORD = PASSWORD) {return "correct password" ;}else {return "Incorrect password ";}}}}}
4. Add the following JS Code to the default. aspx page:
<SCRIPT type = "text/JavaScript"> $ (function () {$ ("# <% = txtoldpass. clientid %> "). blur (function () {$. ajax ({type: "Post", contenttype: "application/JSON", URL: "checkpassword. asmx/iscorrectpass ", data:" {Username: 'admin', password: '"+ $ (this ). val () + "'}", // here there is only one user name for convenience, datatype: "JSON", // success: function (result) is also a piece of data in the database) {$ ("# MSG "). text (result. d) ;}}) ;}); </SCRIPT>
In fact, it is very simple, that is, to practice jquery Ajax. As I just learned about jquery, I should just practice it.
5. The final running effect is
As an exercise, no encryption is implemented, and the password is displayed directly. When you enter the correct password, and then the cursor leaves the text box, it immediately determines whether the password is entered correctly.
Source code: