Quick learning of Ajax 5 Ajax registration (requires a database)

In this course, we will discuss how to register Ajax. Of course, this is all about practice. Later, we will talk about Ajax without refreshing upload files in the next course.

First, open our database. I use 08r2. Of course, you can use your own database version or access.

First, usertable

The above is a simple structure. Below we build a simple HTML page

Note that you should not use the <form> method to pass the value. We do Ajax. the structure we need is this situation.

Register.htm ----> Register. ashx -----> Database

Okay, we have done a good job of storage. Next we will start with ourProgram, Here, I need to first remind you of a few places,
First, we will not deal with [gender ];
Second, we will not deal with [upload images]-that is, the Avatar. In the next lesson, we will mainly discuss uploading the Avatar and generating the thumbnail.
Okay, let's improve our program a little bit.

First, we need to get all the input tag elements on the page, but we do not need all of them. For example, the submit button and cancel button are unnecessary.
So I wrote the following:Code

FunctionRegister () {createxmlhttprequest ();VaRInputs = Document. getelementsbytagname ('Input');VaRParameters ='';For(VaRI = 0; I <inputs. length; I ++ ){If(Inputs [I]. getattribute ('Name')! =Null) {Parameters + = inputs [I]. getattribute ('Name') +"="+ Inputs [I]. Value +"&";}} Alert (parameters );}
 

Createxmlhttprequest (); needless to say, it represents creating an XMLHTTP object.

Then we use some specific filtering conditions to obtain the data we need, and then splice a string that is not very accurate. Of course, we still need to process this string.

Now, let's continue with our operations.

This string, I think it will be inconvenient for us to use later, so let's improve it. Here is the gender. Modify the sex parameter.

Ah, I really want to write jquery. Oh, this kind of original-ecological Ajax is really troublesome, but let's implement it slowly. (* ^__ ^ *) Xi ......

Now, let's continue to modify the DOM node of this gender.

<InputType= "Radio"Name= "Sex"Value= "1"Onclick= "Getsex (this. Value );"Checked= "Checked"/>Male<InputType= "Radio"Name= "Sex"Value= "0"Onclick= "Getsex (this. Value);"/>Female
 

This. value is the value of the transferred node. Next, modify our script.

    <  Script  Type  = "Text/JavaScript"> VaR Parameters = '' ; Function Register () {parameters = '' ; Createxmlhttprequest (); VaR Inputs = Document. getelementsbytagname ( 'Input' ); For ( VaR I = 0; I <inputs. length; I ++ ){ If (Inputs [I]. getattribute ( 'Name' )! = Null ) {Parameters + = inputs [I]. getattribute ( 'Name' ) + "=" + Inputs [I]. Value + "&" ;}} Parameters = parameters. substring (0, parameters. Length-1); alert (parameters. Replace ( 'Sex = 1 & sex = 0' , 'Sex =' + Sex ));} VaR Sex = "1" ; Function Getsex (value) {sex = value ;} </  Script  > 

OK. Check the effect.

Let's take a look at the string again. Haha, yes, it's OK. This string is good for us.

Well, what we need to reserve below is, of course, database connection, and data insertion. Below, we will write several classes.

First, the user class. I think the simplest first operation is to insert a student.

 

 

I did not expand the createuser method because I think everyone should be able to write it by themselves, that is, a simple data insertion Operation.

Modify the code on the register. ashx page.

Well, let's implement it in this simple way. In the next lesson, I will make it more user-friendly.

In the following example, click Register to bring up the registration form.

The script in the pop-up form [because I mainly talked about the Ajax method, so the script operation is simple.] the following method should be clear.

  function  Register (URL, name, iwidth, iheight) { var  URL;  var  name;  var  iwidth;  var  iheight;  var  iTOP = (window. screen. height-30-iheight)/2;  var  ileft = (window. screen. width-10-iwidth)/2; window. open (URL, name,  'height = ' + iheight +  ', innerheight = ' + iheight + ', width = ' + iwidth +  ', innerwidth ='  + iwidth +  ', top = ' + iTOP + ', Left = ' + ileft +  ', toolbar = No, menubar = No, scrollbars = auto, resizeable = No, location = No, status = No, z-Look = Yes ');} 

Modify the registered Dom tag

 
<InputType= "Button"Value= "Registration"Onclick= "Javascript: register('register.htm', 'registration Windows', 400,400);"/>
 

OK.

Today, we have to take the course here. Let's keep up with the new course. Haha, by the way, don't talk about jquery any more. I also know JQ is good, I just want to write a set of original Ajax.

 

3q.