+ AJAX JSP validation code
Related Tags:
1, we are doing when the code is often due to anti-cheating, the certification sometimes intentionally added more disturbing factors, then do not show that the code is very clear, user input errors frequently. This will not only have to reload the page, the user does not see the code re-filling rather than amend, and if not kept under the session with the other user input data, (such as names), the contents of users have just entered not existed, and this to the user bad experience.
2, in this case on the basis of the existing authentication methods add a js through xmlhttp to obtain the return value, in order to verify whether effective, then even if the user's browser does not support js, it will not affect his normal use.
3, in order to prevent cheating, when users connect the input errors when a picture override, which would also benefit users because the photo of a code identifying unclear and unable to enter the correct end.
4, in this case particularly suitable for testing the validity of user name, as long as the Background to be a sql enquiries, or to return a value can be xml. (Examples of this too much, in this regard, do not repeat them.)
5, the merits of this case is very user-friendly input, but also reduce the server-side request, it can be said both to improve the user experience and would save bandwidth costs slightly, but a corresponding increase in page section JavaScript code, in the current network speed ever The sooner the people an efficient and comfortable today, it seems that we should provide to the users attention to the use of good feelings.
Code as follows:
1, img.jsp importation of Home
<% @ Page contentType = "text / html; charset = GBK" language = "java"
Import = "java.sql .*" errorPage = "" pageEncoding = "GBK"%>
<%
/ / Set Chinese Char
/ / Cody by JarryLi@gmail.com;
/ / Homepage: jiarry.126.com
Request.setCharacterEncoding ( "GBK");
Response.setCharacterEncoding ( "GBK");
Response.setContentType ( "text / html; charset = GBK");
%>
<html>
<head>
<title> Picture certification </ title>
<meta Http-equiv="Content-Type" content="text/html; charset=gb2312">
<script Src="net.js"> </ script>
</ Head>
<body>
AJAX (no refresh timely tips) code examples! Cody by jarry
<hr>
<%
String num = request.getParameter ( "num");
String random = (String) session.getAttribute ( "random");
String name = request.getParameter ( "name");
If (num! = Null & random! = Null & & name! = Null)
(
If (num.equals (random))
(
Out.println ( "<font style=\"color:green;font-weight:bold\">
Congratulations to you, enter the code successfully, here is the results pages can be included in the database! </ Font>
<a Href=\"img.jsp\"> return to test </ a> <br> ");
Out.println ( "Your name is:" + name);
Out.println ( "<br>");
Out.println ( "Your input is:" + num);
Out.println ( "Code:" + random);
Out.println ( "</ body>");
Return; / / javascript: history.go (-1)
)
)
%>
<script Type="text/javascript">
Var times = 0;
Function subform () (
Var gtext = this.req.responseText;
Var info = document.getElementById ( "info");
If (gtext.indexOf ( "validate_successful ")!=- 1) (
/ / Info.innerHTML = "<font color=green> code through </ font>";
Document.forms [ "myform"]. Submit ();
/ / values that are legitimate, then the code passed.
Else ()
Times + +;
If (times> = 3) (/ / If it is three times input errors, the heavy-duty picture, and users can prevent cheating unclear picture;
Info.innerHTML = "three successive input errors. Updated code, please re-enter";
Document.forms [ "myform"]. Num.value = "";
Show (document.getElementById ( 'random'));
Times = 0;
Else ()
Info.innerHTML = "" + + times ", the code error, please pay attention to distinguish between upper and lower case";
)
Document.forms [ "myform"]. Num.select ();
)
)
Function validata (obj) (
Var enter = true;
Var info = document.getElementById ( "info");
Var msg = "";
If (obj.name.value.match (/ ^ \ s * $ / g )){// If you do not enter name, suggesting that
Msg + = "Please enter your name <br>"; enter = false
)
If (obj.num.value.match (/ ^ \ s * $ / g )){// If you do not enter a verification code, tips
Msg + = "Please enter a verification code <br>"; enter = false
)
If (enter == false) (
Info.innerHTML = msg;
Return false;
)
Var url = "num.jsp? Num =" + obj.num.value;
Var newxmlhttp = new net.ContentLoader (url, subform ,""," get ", null, null);
Return false;
)
Function show (o) (
/ / Override code
Var timenow = new Date (). GetTime ();
O.src = "random.jsp? D =" + timenow;
/ *
/ / Overtime implementation;
SetTimeout (function () (
O.src = "random.jsp? D =" + timenow;
)
20);
* /
)
</ Script>
<Form action = "img.jsp" name = "myform" method = "post"
Onsubmit = "return validata (this);">
Your name: <input type = "text" name = "name" size = 10> (In order to better illustrate the cases, the name of an Atomizing) <br>
Code: <input type = "text" name = "num" size = 10 maxlength = "4">
<img Src="random.jsp" id="random" align="" valign="absmiddle" hspace="5">
<a Href="javascript:show(document.getElementById('random'))"> code unclear </ a> <br>
<br> <input Type="submit" value="Submit"> <br>
<div Id=info style="color:red;padding:10px;font-size:12px;"> </ div>
</ Form>
</ Body>
</ Html>
2, num.jsp, feedback pages xmlhttp request
<% @ Page contentType = "text / html; charset = GBK" language = "java"
Import = "java.sql .*" errorPage = "" pageEncoding = "GBK"%>
<%
/ / Set Chinese Char
/ / Cody by JarryLi@gmail.com;
/ / Homepage: jiarry.126.com
Request.setCharacterEncoding ( "GBK");
Response.setCharacterEncoding ( "GBK");
Response.setContentType ( "text / html; charset = GBK");
%>
<%
String num = request.getParameter ( "num");
String random = (String) session.getAttribute ( "random");
If (num! = Null & random! = Null)
(
If (! Num.equals (random))
(
/ *
Out.println ( "<script> alert ( 'code mistake! Please try 。')</ script>");
Out.println ( "<script> history.go (-1) </ script>");
/ / Response.sendRedirect ( "img.jsp");
* /
Out.print ( "validate_failed:" + random);
)
Else
(
/ / Out.println ( "<center> proved to be successful! </ Center>");
Out.print ( "validate_successful:" + random);
)
)
%>
3, random.jsp, the code generated picture pages
<% @ Page autoFlush = "false" import = "java.util .*, java.awt .*,
Java.awt.image .*, com.sun.image.codec.jpeg .*, java.util .* "%>
<%
/ / Set Chinese Char
/ / Cody by JarryLi@gmail.com;
/ / Homepage: jiarry.126.com
Request.setCharacterEncoding ( "GBK");
Response.setCharacterEncoding ( "GBK");
Response.setContentType ( "text / html; charset = GBK");
%>
<%
String chose = "0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ";
Char Display []={' 0 ',' ','0', '','0 ',' ','0'), ran []={' 0 ','0','0 ',' 0 '), temp;
Random rand = new Random ();
For (int i = 0; i <4; i + +)
(
Temp = chose.charAt (rand.nextInt (chose.length ()));
Display [i * 2] = temp;
Ran [i] = temp;
)
String random = String.valueOf (display);
Session.setAttribute ( "random" String.valueOf (ran));
%>
<%
Out.clear ();
Response.setContentType ( "image / jpeg");
Response.addHeader ( "pragma", "NO-cache");
Response.addHeader ( "Cache-Control", "no-cache");
Response.addDateHeader ( "Expries", 0);
Int Width = 80 Height = 30;
BufferedImage image = new BufferedImage (width, height,
BufferedImage.TYPE_INT_RGB);
Graphics g = image.getGraphics ();
/ / Fill the following background color
G.setColor (Color.GREEN);
G.fillRect (0, 0, width, height);
/ / Set the Font color
G.setColor (Color.RED);
Font font = new Font ( "Arial" Font.PLAIN, 20);
G.setFont (font);
/ / G.drawString (random, 5, 14);
G.drawString (random, 5,20);
G.dispose ();
ServletOutputStream outStream = response.getOutputStream ();
JPEGImageEncoder encoder = JPEGCodec.createJPEGEncoder (outStream);
Encoder.encode (image);
OutStream.close ();
%>
4, net.js, Packaging good xmlhttp object, can be very convenient to call
/ * Namespacing object * /
Var net = new Object ();
Net.READY_STATE_UNINITIALIZED = 0;
Net.READY_STATE_LOADING = 1;
Net.READY_STATE_LOADED = 2;
Net.READY_STATE_INTERACTIVE = 3;
Net.READY_STATE_COMPLETE = 4;
/*--- Content loader object for cross-browser requests ---*/
Net.ContentLoader = function (url, on_load, on_error, method, params, contentType) (
This.req = null;
This.on_load = on_load;
This.on_error = (on_error)? On_error: this.defaultError;
This.loadXMLDoc (url, method, params, contentType);
)
Net.ContentLoader.prototype.loadXMLDoc = function (url, method, params, contentType) (
If (! Method)
(
Method = "GET";
)
If (! ContentType & method == "POST")
(
ContentType = 'application / x-www-form-urlencoded';
)
If (window.XMLHttpRequest)
(
This.req = new XMLHttpRequest ();
)
Else if (window.ActiveXObject)
(
/ / Add try catch;
Try (
This.req = new ActiveXObject ( "Msxml2.XMLHTTP");
) Catch (e1) (
Try (
This.req = new ActiveXObject ( "Microsoft.XMLHTTP");
) Catch (e2) (
)
)
/ /
/ / This.req = new ActiveXObject ( "Microsoft.XMLHTTP");
)
If (this.req)
(
Try
(
Var loader = this;
This.req.onreadystatechange = function ()
(
Net.ContentLoader.onReadyState.call (loader);
)
This.req.open (method, url, true);
If (contentType)
(
This.req.setRequestHeader ( 'Content-Type', contentType);
)
This.req.send (params);
)
Catch (err)
(
This.on_error.call (this);
)
)
)
Net.ContentLoader.onReadyState = function () (
Var req = this.req;
Var ready = req.readyState;
If (ready == net.READY_STATE_COMPLETE) (
Var httpStatus = req.status;
If (httpStatus == 2 | | httpStatus == 0) (
This.on_load.call (this);
Else ()
This.on_error.call (this);
)
)
)
Net.ContentLoader.prototype.defaultError = function () (
Alert ( "error fetching data."
+ "\ N \ nreadyState:" + this.req.readyState
+ "\ Nstatus:" + this.req.status
+ "\ Nheaders:" + this.req.getAllResponseHeaders ());
)
- CSS code-writing techniques commonly used
- Css common code
- Summary: A CSS code reference map
- CSS code structure of: the div and span!
- Some commonly used CSS code
- Common CSS code
- Optimizing your CSS code
- How to Optimize your CSS code?
- HTML and CSS pages prepared by the beautiful formal code
- CSS code attributes Encyclopaedia (HTML)
- CSS style definition of the rolling code
- Css code explain
- The magic code - CSS filter trip
- Js code and code folding effect css
- Clever css debug code
- CSS control ul code base
- CSS code abbreviation skills
- CSS code abbreviation skills zz
- CSS code-switching function tab
- CSS simple picture-Daolian code
