电力项目pub.js实现替换form表单的innerHTML

Posted 2022-11-30 xuzhuaaron1

目的：角色类型切换的时候下面的权限分配不同的checkbox被勾中以及显示用户分配

切换前

切换后

第一步

/**
传递的参数：
  domId：传递表单中Form2的名称
  action：请求的路径    'system/elecRoleAction_edit.do'  这个请求最终返回的是一个roleEdit.jsp的页面 去除<%@ page language="java" pageEncoding="UTF-8"%>
  sForm：传递表单中Form1的名称
*/
Pub.submitActionWithForm=function(domId,action,sForm)
  var req = Pub.newXMLHttpRequest();
  var handlerFunction = Pub.getReadyStateHandler(req, domId,Pub.handleResponse);
  req.onreadystatechange = handlerFunction;
  req.open("POST", action, false);
  req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); 
  var str = Pub.getParams2Str(sForm); 
  //传递的是以Form1的属性值做为参数
  //alert(str);
  req.send(str);

/**创建Ajax引擎*/
Pub.newXMLHttpRequest=function newXMLHttpRequest()
  var xmlreq = false;
  if (window.XMLHttpRequest)
    xmlreq = new XMLHttpRequest();
  else if (window.ActiveXObject)
    try
      xmlreq = new ActiveXObject("Msxml2.XMLHTTP");
    catch (e1)
      try
        xmlreq = new ActiveXObject("Microsoft.XMLHTTP");
      catch (e2)
        alert(e2);
     
   
 
  return xmlreq;

/**
req:ajax引擎
eleid：表单中form2的名称
responseXmlHandler：表示Pub.handleResponse函数
*/
Pub.getReadyStateHandler =function getReadyStateHandler(req, eleid,responseXmlHandler)
  return function ()
    if (req.readyState == 4)
      if (req.status == 200)

       //req.responseText 就是请求的路径    'system/elecRoleAction_edit.do' 返回的结果
        responseXmlHandler(req.responseText,eleid);
      else
        alert("HTTP error: "+req.status);
        return false;
     
   
 

最终执行这个function

/**
data:服务器端返回的结果 
eleid：表单值Form2的名称
*/
Pub.handleResponse= function handleResponse(data,eleid)
      //alert(data);
      //获取Form2的对象
      var ele =document.getElementById(eleid);
      //alert(data);

     //返回的是roleEdit.jsp  最终传给Form2，也就是Form2的内部html布局
      ele.innerHTML = data;
    

/**
sForm:表单中Form1的名称
*/
Pub.getParams2Str=function getParams2Str(sForm)
 var strDiv="";
 try
    var objForm=document.forms[sForm];
  if (!objForm)
    return strDiv;
  var elt,sName,sValue;
  for (var fld = 0; fld < objForm.elements.length; fld++)
      elt = objForm.elements[fld];    
      sName=elt.name;
      sValue=""+elt.value;
      if(fld==objForm.elements.length-1)
          strDiv=strDiv + sName+"="+sValue+"";
       else   
          strDiv=strDiv + sName+"="+sValue+"&";
   
 
  catch (ex)
    return strDiv;

   //alert(strDiv);
   return strDiv;