Use Ajax + J2EE to develop the organizational unit management system 3

3) How to drag a tree and select a node

// Mydraghandler re-specifies the parent-child relationship when dragging the tree node.
Function mydraghandler (idfrom, idto ){
VaR XMLHTTP = new activexobject ("Microsoft. XMLHTTP ");
XMLHTTP. Open ("Post", "org. jsp? Mode = moveorg & orgid = "+ idfrom +" & newparentorgid = "+ idto, false );
XMLHTTP. setRequestHeader ("Content-Type", "application/X-WWW-form-urlencoded ");
XMLHTTP. Send ();
Retxml = XMLHTTP. orgponsetext;

Return true;
}
// Myselecthandler controls the system by selecting the tree node and displays the organization information and personnel in the Organization.
Function myselecthandler (ID ){
Tborg. style. Display = "Block ";
Divorgmemo. style. Display = "NONE ";
Divorginfo. style. Display = "NONE ";

If (ID = 1)
{
Divorgmemo. style. Display = "Block ";
Div1.style. Display = "NONE ";
Div2.style. Display = "NONE ";
Div3.style. Display = "NONE ";
Divcontent. style. Display = "NONE ";
Div5.style. Display = "NONE ";
}
Else
{
Divorginfo. style. Display = "Block ";
Div1.style. Display = "Block ";
Div2.style. Display = "Block ";
Div3.style. Display = "Block ";
Divcontent. style. Display = "Block ";
Div5.style. Display = "Block ";
}
Currnodeid = ID;
// Load the organization information and display it on the text control of the encoding and name.
Loadorg (ID );
// Load the personnel information of an organization
VaR XMLHTTP = new activexobject ("Microsoft. XMLHTTP ");
XMLHTTP. Open ("Post", "org. jsp? Mode = getperson & orgid = "+ id, false );
XMLHTTP. setRequestHeader ("Content-Type", "application/X-WWW-form-urlencoded ");
XMLHTTP. Send ();

Retxml = XMLHTTP. responsetext;
Persondom. loadxml (retxml );
// Add the serial number to each row of personnel information
For (VAR I = 0; I <persondom.doc umentelement. childnodes. length; I ++ ){
Persondom.doc umentelement. childnodes [I]. setattribute ("seqno", nextseq );
Nextseq ++;
}
// The personnel information is displayed on divcontent
Divcontent. innerhtml = persondom. transformnode (stylesheet );
};
// Load the organization information and display it on the text control of the encoding and name.
Function loadorg (orgid ){
If (orgid = NULL ){
Orgid = orgtree. getselecteditemid ();
}
If (orgid = ""){
Tborg. style. Display = "NONE ";
Return;
}
VaR XMLHTTP = new activexobject ("Microsoft. XMLHTTP ");
XMLHTTP. Open ("Post", "org. jsp? Mode = loadorg & orgid = "+ orgid, false );
XMLHTTP. setRequestHeader ("Content-Type", "application/X-WWW-form-urlencoded ");
XMLHTTP. Send ();
Retxml = XMLHTTP. responsetext;
VaR orgdoc = new activexobject ('Microsoft. xmldom ');
Orgdoc. async = false;
Orgdoc. loadxml (retxml );
If (orgid! = 1 ){
Txtcode. value = orgdoc. selectsinglenode ("// orgcode"). text;
Txtname. value = orgdoc. selectsinglenode ("// orgname"). text;
}
Tborg. style. Display = "Block ";
}

4) establish an organization

Organization creation is mainly implemented by calling XMLHTTP objects. We mainly learn how to call XMLHTTP. Organizational Unit establishment should be implemented in the background to insert organizational unit information into the database. This is implemented through JSP. There is a createorg method in our org. jsp file. This method passes a parent ID.

Function createorg (parentorgid ){
VaR XMLHTTP = new activexobject ("Microsoft. XMLHTTP ");
XMLHTTP. Open ("Post", "org. jsp? Mode = createorg & parentorgid = "+ parentorgid, false );
XMLHTTP. setRequestHeader ("Content-Type", "application/X-WWW-form-urlencoded ");
XMLHTTP. Send ();
Retxml = XMLHTTP. responsetext;
VaR orgid = (new number (retxml). tostring ();
Return orgid;
}

5) delete an organizational unit

Organization deletion is also implemented by calling the deleteorg method in the org. jsp file. This method passes the deleted node ID.

Function deleteorg (){
VaR orgid = orgtree. getselecteditemid ();
VaR XMLHTTP = new activexobject ("Microsoft. XMLHTTP ");
XMLHTTP. Open ("Post", "org. jsp? Mode = deleteorg & orgid = "+ orgid, false );
XMLHTTP. setRequestHeader ("Content-Type", "application/X-WWW-form-urlencoded ");
XMLHTTP. Send ();
}

6) edit an organizational unit

Organization modification is implemented by calling the modifyorg method in the org. jsp file. This method passes the modified node ID. At the same time, the modified data is transmitted through a custom string in XML format, and then implemented through the send string. Verify the validity of the data before modification and prompt an error message.

Function modifyorg (){
If (orgtree. getselecteditemid () = ""){
Return "N ";
}
If (txtcode. value = ""){
Alert ("Enter the encoding! ");
Return "N ";
}
If (txtname. value = ""){
Alert ("enter a name! ");
Return "N ";
}
VaR orgid = orgtree. getselecteditemid ();
VaR orgkind;
// Alert (txttype. Options [txttype. selectedindex]. value)
VaR strmodify = "<? XML version = '1. 0' encoding = 'gb2312 '?> "+
"<DATA>" +
"<Orgcode> <! [CDATA ["+ txtcode. Value +"]> </orgcode> "+
"<Orgname> <! [CDATA ["+ txtname. Value +"]> </orgname> "+
"<Orgkind> <! [CDATA ["+ txttype. Options [txttype. selectedindex]. Value +"]> </orgkind> "+
"</Data> ";
VaR XMLHTTP = new activexobject ("Microsoft. XMLHTTP ");
XMLHTTP. Open ("Post", "org. jsp? Mode = modifyorg & orgid = "+ orgid, false );
XMLHTTP. setRequestHeader ("Content-Type", "application/X-WWW-form-urlencoded ");
XMLHTTP. Send (strmodify );
Orgtree. setitemtext (orgtree. getselecteditemid (), txtname. value );
}

3. Personnel Management Implementation

You can add, delete, and edit resources. At the same time, when selecting Tree nodes, the staff should be displayed for editing and viewing ......

1) add personnel

The principle of staff addition is to add the node peorsone to the persondom, which is equivalent to a row in the table and sets attributes. At the same time, other nodes are added to peorsone, which indicates the database field and must have the same name as the xlt file label. These nodes are equivalent to columns in this row. Insert a row in the table, insert a column in the row, and display it.

Function addperson (){
VaR seqno = nextseq;
Nextseq ++;
VaR peorsonnode = persondom. createnode ("1", "peorsone ","");
Peorsonnode. setattribute ("isnew", "Y ");
Peorsonnode. setattribute ("isdelete", "n ");
Peorsonnode. setattribute ("seqno", seqno );
Persondom.doc umentelement. appendchild (peorsonnode );
VaR personid = persondom. createnode ("1", "personid ","");
Peorsonnode. appendchild (personid );
VaR personcode = persondom. createnode ("1", "personcode ","");
Peorsonnode. appendchild (personcode );
VaR personname = persondom. createnode ("1", "personname ","");
Peorsonnode. appendchild (personname );
VaR sex = persondom. createnode ("1", "sex ","");
Peorsonnode. appendchild (sex );
VaR TR = tblist. insertrow (tblist. Rows. Length );
Tr. setattribute ("seqno", seqno );
VaR TD = tr. insertcell (0 );
TD. innerhtml = peorsonnode. transformnode (stylesheet );
} 5) delete an organizational unit

Organization deletion is also implemented by calling the deleteorg method in the org. jsp file. This method passes the deleted node ID.

Function deleteorg (){
VaR orgid = orgtree. getselecteditemid ();
VaR XMLHTTP = new activexobject ("Microsoft. XMLHTTP ");
XMLHTTP. Open ("Post", "org. jsp? Mode = deleteorg & orgid = "+ orgid, false );
XMLHTTP. setRequestHeader ("Content-Type", "application/X-WWW-form-urlencoded ");
XMLHTTP. Send ();
}

6) edit an organizational unit

Organization modification is implemented by calling the modifyorg method in the org. jsp file. This method passes the modified node ID. At the same time, the modified data is transmitted through a custom string in XML format, and then implemented through the send string. Verify the validity of the data before modification and prompt an error message.

Function modifyorg (){
If (orgtree. getselecteditemid () = ""){
Return "N ";
}
If (txtcode. value = ""){
Alert ("Enter the encoding! ");
Return "N ";
}
If (txtname. value = ""){
Alert ("enter a name! ");
Return "N ";
}
VaR orgid = orgtree. getselecteditemid ();
VaR orgkind;
// Alert (txttype. Options [txttype. selectedindex]. value)
VaR strmodify = "<? XML version = '1. 0' encoding = 'gb2312 '?> "+
"<DATA>" +
"<Orgcode> <! [CDATA ["+ txtcode. Value +"]> </orgcode> "+
"<Orgname> <! [CDATA ["+ txtname. Value +"]> </orgname> "+
"<Orgkind> <! [CDATA ["+ txttype. Options [txttype. selectedindex]. Value +"]> </orgkind> "+
"</Data> ";
VaR XMLHTTP = new activexobject ("Microsoft. XMLHTTP ");
XMLHTTP. Open ("Post", "org. jsp? Mode = modifyorg & orgid = "+ orgid, false );
XMLHTTP. setRequestHeader ("Content-Type", "application/X-WWW-form-urlencoded ");
XMLHTTP. Send (strmodify );
Orgtree. setitemtext (orgtree. getselecteditemid (), txtname. value );
}

3. Personnel Management Implementation

You can add, delete, and edit resources. At the same time, when selecting Tree nodes, the staff should be displayed for editing and viewing ......

1) add personnel

The principle of staff addition is to add the node peorsone to the persondom, which is equivalent to a row in the table and sets attributes. At the same time, other nodes are added to peorsone, which indicates the database field and must have the same name as the xlt file label. These nodes are equivalent to columns in this row. Insert a row in the table, insert a column in the row, and display it.

function addperson () {
var seqno = nextseq;
nextseq ++;
var peorsonnode = persondom. createnode ("1", "peorsone", "");
peorsonnode. setattribute ("isnew", "Y");
peorsonnode. setattribute ("isdelete", "n");
peorsonnode. setattribute ("seqno", seqno);
persondom.doc umentelement. appendchild (peorsonnode);
var personid = persondom. createnode ("1", "personid", "");
peorsonnode. appendchild (personid);
var personcode = persondom. createnode ("1", "personcode", "");
peorsonnode. appendchild (personcode);
var personname = persondom. createnode ("1", "personname", "");
peorsonnode. appendchild (personname);
var sex = persondom. createnode ("1", "sex", "");
peorsonnode. appendchild (sex);
var TR = tblist. insertrow (tblist. rows. length);
tr. setattribute ("seqno", seqno);
var TD = tr. insertcell (0);
TD. innerhtml = peorsonnode. transformnode (stylesheet);
}