no nonsense, on the code! Big God Don't spray ...
<!--JSP code-->
<tr>
<td> address:</td>
<!--First level: Province-->
<td><select Id= "province" Name= "province" onchange= "F1 ()" >
<option>---Please select---</option>
<!--level Two: City- >
</select> <select id= "City" Name= "City" onclick= "F2 ()" >
<option>---Please select---</ Option>
<!--level III: County-->
</select> <select name= "Country" id= "Country" >
<option >---Please select---</option>
</select></td>
</tr>
JS Code/* PID is his parent ID of the province's PID is 1, so the background pass the time is directly 1; returns a JSON; everyone knows.
This gets the first level of */$ (function () {$.post ("Getsjld.action", {pid:1}, function (data) {
for (var i in data) {var op = $ ("<option value= '" +data[i].id+ "' >" + data[i].cityname
+ "</option>");
$ ("#province"). Append (OP);
}, "JSON"})/* Below I will explain why there are city and country (for: ECHO) and you can see I have a judgment after the append;
That is used when modifying the echo; The mere appearance is that three-level linkage is not used F2 () The same reason gets the second level of $ ("#province") through the first level. Val () is the first level ID; NOTE NOT PID!!! */function F1 (city,country) {$.post ("Getsjld.action", {pid: $ ("#province"). Val ()}, Fu
Nction (data) {$ ("#city"). empty (); for (var i in data) {var op = $ ("<option id= ' City" +data[i].id+ "' value= '" +data[i].id+ "' >" + data[i
].cityname + "</option>");
$ ("#city"). Append (OP); if (city!=null) {$ ("#city option"). each (function () {
if ($ (this). Text () ==city) {$ (this). attr ("selected", true)
} f2 (country)}) The "JSON"}}//is obtained through the second level to the third level function F2 (country) {$.post ("getsjld.action").
{pid: $ ("#city"). Val ()}, function (data) {$ ("#country"). empty ();
for (var i in data) {var op = $ ("<option>" + data[i].cityname + "</option>");
$ ("#country"). Append (OP); if (country!=null) {$ ("#country option"). each (function () {if ($) (
This). Text () ==country) {$ (this). attr ("selected", true) }}}}}, "JSON"}
JS to obtain the value of three-level linkage: The use of splicing method
var ADR = "";
ADR + = $ ("#provinceoption: Selected"). Text () + ""
+ $ ("#city option:selected"). Text () + ""
+ $ ("#country option: Selected "). Text ();
You can see that I added a + "" to the back of each value.
This is for the purpose of modifying the time to take a convenient value. Split directly with Split ("") on the OK;
The above is added
Effect as shown
Add success after the effect as shown
Because I added a "" at the top when I took the value. All additions to the database will be an interval
The next step is to modify the echo.
First we're going to get the value from the database
Because I did it with Esayui, so my value is this.
The value is not to mention. Everyone will!
So now city is the value of the address we've taken.
/* mentioned above, when it is worthwhile, because the added time is "", separated Add,
so we take the value after the split ("") cut
citys[0] It is the value of the province
Citys[1] is the value of the city C6/>CITYS[2] is the value of the county
* /var citys=city.split ("");
$ ("#province option"). each (function () {/
* traversal save pull box; Determines whether the Drop-down box value is the same as the value of the province being fetched;
The same is selected, followed by the second level; Above all you should see the
F1 () represents the second level; So after the selection of the F1 ()
and the city and county values passed;
(The value of the county is not in the F1 (), is to give F2 () pass over)
*/
if ($ (this). Text () ==citys[0]) {
$ (this). attr ("selected", true);
var Sheng = $ (this). Val ();
F1 (citys[1],citys[2])
}}
)
Everybody this time back to look at the second and third level linkage that piece of the Judgment code
As shown in figure:
When you write this, you should know why you sent the city and the Country over.
The third level is the same, and it can be echo!
All right! Modify the echo is done!
Effect as shown:
The background code is a single table query
SELECT * from city WHERE pid = #{pid}
#{pid} is the value of your passing!
Below is the table structure!
This Baidu a big push! It's the same way! Just watch the table structure and know how to take the value.
CREATE TABLE City (
ID Int (one) not NULL DEFAULT ' 0 ',
PID Int (one) DEFAULT NULL,
CityName varchar (255) CHARACTER SET UTF8 DEFAULT NULL,
type int (one) DEFAULT NULL,
PRIMARY KEY (ID)
) Engine=innodb DEFAULT Charset=utf8 collate=utf8_unicode_ci;
All data click link Download
Specific link: http://pan.baidu.com/s/1qXSHmc0 Password: VCAA
There are SQL files inside!