json+ajax

1.1.1 json数据生成

　　l 将采用json-lib 工具生成

　　l 导入jar包：（注意：重复）

　　l api使用：

　　　　JavaBean 或 Map ：JSONObject.fromObject(...).toString();

　　　　List 或 Array：JSONArray.fromObject(...).toString();

1.1.2 发送 ajax 请求

　　l /ee19_crm/WebRoot/WEB-INF/pages/staff/editStaff.jsp

　　l 步骤：

　　　　1.获得当前选中部门

　　　　2.发送ajax查询职务（获得引擎、设置回调、开发连接、发送请求）

　　　　3.获得数据后，将数据添加到职务的select标签中。

<script type="text/javascript">

function showPost(obj){

//1 获得选中部门

var depId = obj.value;

//2 发送ajax，通过部门查询职务

//2.1 获得引擎

var xmlhttp=null;

if (window.XMLHttpRequest){// code for all new browsers

  xmlhttp=new XMLHttpRequest();

} else if (window.ActiveXObject) {// code for IE5 and IE6

  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");

}

//2.2 设置回调函数

xmlhttp.onreadystatechange = function(){

//请求完成，正常响应

if(xmlhttp.readyState == 4 && xmlhttp.status == 200){

//3 获得数据，并展示 ,手动ajax 获得 json数据 字符串

var textData = xmlhttp.responseText;

//3.1 将字符串 手动 转换 json对象

var jsonData = eval("("+textData+")");

// 获得select对象

var postSelectElement = document.getElementById("postSelectId");

postSelectElement.innerHTML = "<option value=‘‘>----请--选--择----</option>";

//3.2 遍历

for(var i = 0 ; i < jsonData.length ; i++){

var postObj = jsonData[i];

// 获得职务id

var postId = postObj.postId;

// 获得职务名称

var postName = postObj.postName;

//3.3 将数显示到select标签

postSelectElement.innerHTML += "<option value=‘"+postId+"‘>"+postName+"</option>";

}

}

};

//2.3 创建连接

var url = "${pageContext.request.contextPath}/postAction_findAllWithDepartment?department.depId=" + depId;

xmlhttp.open("GET", url);

//2.4 发送请求

xmlhttp.send(null);

}

</script>