ajax



AJAX涉及7个技术：
Javascript,HMLHttpRequest,Dom,css,HTML,XML以及相关服务器API.

做局部刷新，用js代替form表单向服务器发出请求

同步提交：
表单提交，超链接提交，浏览器访问servlet都属于同步提交。这时，响应信息会直接显示在客户端
浏览器中，并且将客户端页面的内容原来的内容全部清空。

异步提交：
当客户端发出ajax请求为异步提交。这时，响应信息会由客户端的js对象进行接收，完成js处理后，再将处理
再将处理结果显示在页面。不会清空客户端页面原来的内容。实现页面的局部刷新。由于异步提交只更新页面一块内容
，所以客户端和服务器之间交互的数据较少，速度较快。
<input type="submit" οnclick="">不能给服务器同时提交两种提交，写法错误。

失血模型：实体类中只有属性和get/set方法，没有逻辑处理方法。
贫血模型：实体类中除了有属性外，另外提供处理本类中属性的方法，但不涉及业务和持久化。
充血模型：实体类中除了有属性外，另外提供处理和保存属性的方法，但不涉及业务方法。
涨血模型：实体类中除了有属性外，另外提供处理，保存和该类相关的业务方法。

泛型：在一个类中使用<T>可以给该类定义泛型。如果产生该类的对象时，可以指定T的类型。那么在该类的方法中，凡是引用T的地方，要求必须和定义该类对象时指定的类型一致。

jaxa异步提交不需要跳页面。

------------------------------------------------------------------------------------------------------------------------------------------------

<script type="text/javascript">
 var ajaxObj;
 /*创建AJAX对象，利用该对象替代form表单，向服务器发送请求，接受响应*/
 function createAjax() {
  if (window.ActiveXobject) {
   ajaxObj = new ActiveXObjet("Micsoft.XMLHTTP")
  } else if (window.XMLHttpRequest) {
   ajaxObj = new XMLHttpRequest();
  }
 }
 function check() {
  createAjax();
  //得到用户名
  var nameTxt = document.getElementById("userName").value;
  /*
  //GET方式
  //向服务器发送一个异步请求，第一个参数为请求方式，第二个参数为URL，GET方式需要在URL后面附加表单数据
  //第三个参数固定为true，表示发出的异步请求
  ajaxObj.open("GET", "/ajax/form?userName=" + nameTxt, true);
  //当准备状态变化时，就调用press函数。利用该函数处理响应信息。
  ajaxObj.onreadystatechange = press;
  //设置请求的消息体，并将请求发送给服务器。对应GET方式而言，消息体为空
  ajaxObj.send(null);*/
  
  //提交表单中有中文就用POST
  ajaxObj.open("POST","/ajax/form",true);
  //设置请求头，指明请求消息体的内容格式为键值对方式的表单数据
  ajaxObj.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
  ajaxObj.onreadystatechange = press;
  ajaxObj.send("userName="+nameTxt);
  
 }
 //回调函数，处理响应信息
 function press() {
  //readystate为4，表示服务器有数据发送给客户端
  //status表示得到响应的状态码，为200表示服务器数据成功到达客户端
  if (ajaxObj.readyState == 4 && ajaxObj.status == 200) {
   //得到响应信息消息体的内容
   var str = ajaxObj.responseText;

   var spanObj = document.getElementById("nameSpan");
   if(str == "ok"){
    spanObj.innerHTML = "该用户已存在";
    spanObj.style.color = "red";
   }else{
    spanObj.innerHTML = "可以使用";
    spanObj.style.color = "green";    
   }
  }
 }
</script>

--------------------------------------------------------------------------------------

function show(pn){
      $.post("/ForestManagement/expert/all","pageNum="+pn,function(cutBean){
       var str="";
       for(var i=0 ;i<cutBean.list.length;i++){
        str +="<tr class='list-users'>"
                     +"<td>"+cutBean.list[i].name+"</td>"
                     +"<td>"+cutBean.list[i].unit+"</td>"
                     +"<td>"+cutBean.list[i].speciality+"</td>"
                     +"<td>"+cutBean.list[i].job+"</td>"
                     +"<td>"+cutBean.list[i].tel+"</td>"
                     +"<td><a href='/ForestManagement/expert/show?id="+cutBean.list[i].id+"' class='label  label-info'>查看</a></td>"
                     +"<td><a href='/ForestManagement/expert/show?id="+cutBean.list[i].id+"&update="+cutBean.list[i].id+"' class='label label-success'>修改</a></td>"
                     +"<td><a href='/ForestManagement/expert/del?id="+cutBean.list[i].id+"' class='label label-important'>删除</a></td>"
                     +"</tr>";
       } 
       $("#data").html(str);
       
       if(pn == 1){
        options.totalPages = cutBean.totalPage;
        $("#pageUl").bootstrapPaginator(options);
       }
      
      },"json");
      }