Jquery achieves two-level interaction of the drop-down menu using json objects to display the association from DB values _ javascript skills

This article mainly introduces jquery's implementation of the second-level interaction of the drop-down menu using json objects to display the association from the DB value. If you need it, you can refer to the use of struts2 and Ajax to implement the transmission of json objects, then implement level-2 Association of menus

The following is the source code of my js file:

The Code is as follows:

Var mail = {
// Initialization
Init :{
// Initialize data
Initdata :{
Did :'',
Ttitle :'',
Sendpassword :'',
Description :''
},
// Initialization event
Initevent :{
DataEvent: function (){
$ ("# Did"). unbind ("change"); // obtain the level-1 menu and bind events
$ ("# Did"). bind ("change", function (){
// Alert ($ (this). val ());
Mail. init. initdata. did = $ (this). val ();
// Alert (mail. init. initdata. did );
Mail. init. initevent. getuser ();
});
},
Getuser: function (){
$. Post ("mailAction_showUsers? Did = "+ mail. init. initdata. did, null, function (data ){
Var uidoption = $ ("# uid"); // obtain the level-2 menu
Uidoption. empty (); // clear the list
For (var I = 0; I // Fill the option with the loop
Uidoption. append (" "+ Data. users [I]. username +"");
}
});
},
SubmitCheck: function (){
$ ("# Send"). unbind ("click ");
$ ("# Send"). bind ("click", function (){
Mail. init. initdata. description = $ ("input [type = 'texta']"). text ();
Mail. init. initdata. sendpassword = $ ("input [name = 'sendpassword']"). val ();
Mail. init. initdata. ttitle = $ ("input [name = 'ttitle']"). val ();

If (mail. init. initdata. sendpassword = ""){
Alert ("enter the password! ");
Return false;
}
Else if (mail. init. initdata. ttitle = ""){
Alert ("enter a topic! ");
Return false;
}
Else if (mail. init. initdata. description = ""){
Alert ("Enter the content! ");
Return false;
}
Else
Return true;
});
}
}
}
}

$ (). Ready (function (){
Mail. init. initevent. DataEvent ();
Mail. init. initevent. submitCheck ();

});

This is the background action:

The Code is as follows:

Private int did;
Public String getDid (){
...
}
Public void setDid (Strign did ){
...
}
Public String showUsers (){

Users = (ArrayList ) This. userService. getUsersByDid (did );
System. out. println (users. size () + "...");
Return SUCCESS;
}

Struts. xml configuration:

The Code is as follows:

Front-end jsp page:

The Code is as follows:

Recipient

This is implemented and run:

Write to persons in need... Reference