Two-level pull-down Association + Ajax Implementation Algorithm

Two-level drop-down menu linkage:

That is to say, the information is specified in the Level 1 menu, and the information in the Level 2 drop-down box is the sub-object of the level 1 drop-down box.

1. Javascript

Is directly implemented using JavaScript, add a changecategory () method, return a string from the server. This string is dynamically generated by the Server query database. The difference with Ajax is that xhr objects are not needed. Directly use onchange to pass the value.

 

2. Ajax + custom string

ID + name, which is a complete string. Use "-" to separate each record, and then use "," to separate the ID and name of each record.

For (INT I = 0;, I <Childs. Size (); I ++ ){

Category C = Childs. Get (I );

Buf. append (C. GETID () + "," + C. getname () + "-");

}

// Delete the last unnecessary "-"

Buf. deletecharat (BUF. Length ()-1 );

Parse (req. responsetext)

Then it is used on the client for split resolution. Note: It is parsed twice and completed with an array of two characters. For the first time, use "-" split to get each record, and then use "," to get the ID and name.

 

 

 

3. Ajax + XML is the most troublesome and inefficient.

 

Loop is also required,

For (INT I = 0;, I <Childs. Size (); I ++ ){

Category C = Childs. Get (I );

Buf. append ("<Category> <ID>" + C. GETID () + </ID> <Name> "+ C. getname () + "</Name> </Category> ,");

}

 

Buff. insert (0, "<categories> ");

Buff. append (</Categories>)

 

Then go to the client and use JavaScript for parsing. Use tagbyname.

Note that parsexml (req. responsexml) is used instead of parse (req. responsexml) on the client );

VaR categories = xml. getelementsbytagname ("MSG") [0];

 

For (VAR I = 0; I <categories. childnodes. length, I ++ ){

VaR Category = categories [I];

 

In callback:

VaR MSG = Req. responsexml. getelementsbytagname ("MSG") [0];

Setmsg (msg. childnodes [0]. nodevalue );

 

XML needs to be built on the server and parsed on the client.

Javascrpt processes XML, that is, tagname

 

 

4. Ajax + JavascriptCode

That is to say, this transfer is not XML, but code. Is to directly write the JavaScript code from the drop-down menu into a string. In fact, it is the same as not using Ajax. The code is written directly on the server side, and then sent to the client through Ajax for direct execution. The difference from the first method is that AJAX is used. To put it bluntly, xhr objects are used for transmission. In fact, there is no big difference.

Note that the eval (req. resonsetext) method is required during execution ).

Note that encoding must be added before transmission to ensure correct transmission of Chinese characters.