利用AJAX+J2EE開發組織機構管理系統 4

2) 刪除人員

　　人員刪除同樣是調用Org.jsp 檔案中的deletePerson方法來實現，該方法傳遞所刪除的人員ID。如何確定人員ID是通過讀取隱藏的ID，並掃描整個表，看那些被選中。這裡我們要注意是提供多項選擇的。

function deletePerson(){
　for(var i=0; i＜tbList.rows.length; i++){
　　var row=tbList.rows[i].cells[0].children[0].rows[0];
　　if(row.cells[0].children[0].checked)
　　{
　　　var personId=row.cells[1].children[0].value;
　　　if(personId＞0)
　　　{
　　　　var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
　　　　xmlhttp.open("POST","Org.jsp?mode=deletePerson&personId=" + personId, false);
　　　　xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
　　　　xmlhttp.send();
　　　}
　　　tbList.deleteRow(i);
　　　i--;
　　}
　}
}

　　3) 編輯人員

　　人員修改我們要判定哪些行被修改了。剛增加但沒儲存的行應該是新增而不是修改的。

function save(){
　if( modifyOrg()=="N")
　{
　　return;
　}
　for(var i=0; i＜tbList.rows.length; i++)
　{
　　var row=tbList.rows[i].cells[0].children[0].rows[0];
　　var personId=row.cells[1].children[0].value;
　　var seqNo = tbList.rows[i].getAttribute("seqNo");
　　var staffNode = personDom.selectSingleNode("//peorsone[@seqNo='" + seqNo + "']");
　　var personCode=row.cells[2].children[0].value;
　　var personName=row.cells[3].children[0].value;
　　var sex=row.cells[4].children[0].value; //alert(staffN;ode );
　　if(staffNode.getAttribute("isNew") == "Y")
　　{
　　　createPerson(CurrNodeId,personCode,personName,sex);
　　}
　　else
　　{
　　　var strXML = "＜?xml version='1.0' encoding='gb2312'?＞" +
　　　　"＜data＞" +
　　　　"＜personCode＞＜![CDATA[" + personCode+ "]]＞＜/personCode＞" +
　　　　"＜personName＞＜![CDATA[" + personName + "]]＞＜/personName＞" +
　　　　"＜sex＞＜![CDATA[" + sex+ "]]＞＜/sex＞" +
　　　　"＜personId＞＜![CDATA[" + personId+ "]]＞＜/personId＞" +
　　　　"＜/data＞";
　　　//alert(strXML );
　　　var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
　　　xmlhttp.open("POST","Org.jsp?mode=modifyPerson", false);
　　　xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
　　　xmlhttp.send(strXML );
　　}
　}
}

　　四、 XML與XSL檔案設計

　　XML是種可擴充的標記語言，它具有開放的、可擴充的、可自描述的語言結構，它已經成為網上資料和文檔傳輸的標準。XSLT的目的是將資訊內容與 Web 顯示分離，HTML 通過按抽象概念(如段落、重點和編號清單)定義顯示來實現裝置獨立性。XSLT用來具體顯示控制項，設定控制項風格。

　　Ajax主要使用XML和XSLT進行資料交換與處理。

　　1. 樹資訊的XML檔案(見root.xml檔案)

　　XML是標記語言，元素必須成對出現。樹結構中以tree為根結點，以item為結點體，屬性text指出結點所顯示的文本，id指出唯一的所標識號。

＜?xml version='1.0' encoding='gb2312'?＞
＜tree id="0"＞
＜item child="1" text="組織" id="1" ＞
＜/item＞
＜/tree＞

　　這檔案並不是必要的，只是為了系統能獨立運行才加的。事實如果串連了後台資料是不需要的。只要吧OrgTree.loadXML("root.xml?0")改為OrgTree.loadXML("Org.jsp")就可以了。

　　2. 人員資訊XML檔案(見peorson.xml檔案)

　　說明![CDATA[]]可在任何顯示任何格式的文本，文本中可插入其它任何字元。這檔案也不是必要的。

　3. 人員資訊展現的xsl檔案(見addOrgPerson.xsl檔案)

　　xsl檔案同樣是XML格式檔案。所以一律遵守XML標準。下面對主要的行講解:

＜?xml version="1.0" encoding="gb2312"?＞
//這是定義xml檔案的首行。用來指明版本及字元集
＜xsl:stylesheet xmlns:xsl="http://www.w3.org/TR/WD-xsl" language="JavaScript"＞
//這裡定義了stylesheet 元素。並指出其國際命名的組織及語言。
＜xsl:template match="/"＞
＜xsl:apply-templates select="peorsones"/＞
＜/xsl:template＞
//上面是匹配的規則。"/"表示從根結開始去匹配。匹配到下面的peorsones標記。這是Regex有關的學問。我們只要理解就可以。
＜xsl:template match="peorsones"＞
//當匹配上peorsones時所要做的事情。
＜table id="tbList" border="1" width="100%"＞
//定義一個id為"tbList的表格。此表格是顯示在WEB上的
＜xsl:for-each select="peorsone"＞
//迴圈匹配peorsone
＜tr＞
//定義tbList表格的一行，並在行上增加一個叫seqNo的屬性名稱，值為匹配到的seqNo（序號）
＜xsl:attribute name="seqNo"＞＜xsl:value-of select="@seqNo"/＞＜/xsl:attribute＞
＜td＞
//定義行上的一列，列又去匹配
＜xsl:apply-templates select="."/＞
＜/td＞
＜/tr＞
＜/xsl:for-each＞
＜/table＞
＜/xsl:template＞

＜xsl:template match="peorsone"＞
＜table border="1" width="100%"＞
＜tr＞
//定義寬為5%的一列，在該列上插入一個checkbox控制項
＜td width="5%"＞
＜input type="checkbox" value="on" size="10"＞＜/input＞
＜/td＞
//定義一個不顯示的列，在該列上插入一個text控制項，text的值為匹配到的personId（人員Id）
＜td style="display:none"＞
＜input type="text" size="25"＞
＜xsl:attribute name="value"＞＜xsl:value-of select="personId"/＞＜/xsl:attribute＞
＜/input＞
＜/td＞
＜td width="30%"＞
＜input type="text" size="20"＞
＜xsl:attribute name="value"＞＜xsl:value-of select="personCode"/＞＜/xsl:attribute＞
＜/input＞
＜/td＞
＜td width="40%"＞
＜input type="text" size="40"＞
＜xsl:attributename="value"＞＜xsl:value-of select="personName"/＞＜/xsl:attribute＞
＜/input＞
＜/td＞
//定義一個width為28%的列，在該列上插入一個下拉式清單select 控制項，select的值如果匹配到為0時則為"男"，1時則為"女"
＜td width="28%"＞
＜select size="1"＞
＜option value="0"＞
＜xsl:if test=".[sex=0]"＞
＜xsl:attribute name="selected"＞true＜/xsl:attribute＞
＜/xsl:if＞
男
＜/option＞
＜option value="1"＞
＜xsl:if test=".[sex=1]"＞
＜xsl:attribute name="selected"＞true＜/xsl:attribute＞
＜/xsl:if＞
女＜/option＞
＜/select＞
＜/td＞
//定義一列，在該列上插入一個button控制項，onclick 事件為自訂的方法，該方法傳遞當前單擊的按紐
＜td width="*"＞
＜button onclick="openPersonRolePage(this)" style="width: 36; height: 21"＞角色＜/button＞
＜/td＞
＜/tr＞
＜/table＞
＜/xsl:template＞
＜/xsl:stylesheet＞

　　五、 資料介面的實現(見Org.jpg檔案)

　　Org.JSP檔案用來在伺服器上運行Java的類與前台web頁之間架起一座橋。取到中介軟體的介面作用。

　　這裡分析部分代碼:

＜%@ page contentType="text/html; charset=GBK" %＞
＜%@ page import="java.sql.*" %＞
＜%@ page import="javax.naming.*" %＞
＜%@ page import="javax.sql.*" %＞
＜%@ page import="tool.*" %＞
＜%@ page import="orgNew.*" %＞
＜%@ page import="org.w3c.dom.*" %＞
//上面主要是引用一些java類
＜%
try{
　//request.setCharacterEncoding("GBK");
　Document doc = XmlTool.createDocumentFromRequest(request);
　//建立web面文檔請求的文檔對象
　Connection conn = ConnTool.getConnectionFromPool();
　//擷取請求的方法名
　String mode=request.getParameter("mode");
　//out.println("ccc");
　//如果方法中沒有其它參數則讀取組織樹資料
　if(mode == null){
　　/* int OrgId = Integer.parseInt(request.getParameter("id"));
　　String str = orgManager.getChildOrg(OrgId, conn);
　　out.println(str);
　　*/
　String str = orgManager.getTree(conn);
　//out.println(str);
　out.println(str);
}else if(mode.equals("createOrg")){
　//如果是createOrg方法則建立一個組織
　int parentOrgId = Integer.parseInt(request.getParameter("parentOrgId"));
　//取出傳遞來的第一個參數parentOrgId
　int OrgId = orgManager.createOrg(parentOrgId, conn);
　//調用orgManager 類的createOrg方法來建立一個組織
　out.println(OrgId);
　//返回結果
}
conn.close();
}
catch(Exception e){
　e.printStackTrace();
}
%＞