书签分享收藏举报版权申诉 / 20

立即下载加入VIP,免费下载

当前位置：首页 > 解决方案 > 在线用户信息表格编辑.docx

在线用户信息表格编辑.docx

文档编号：11805307
上传时间：2023-04-02
格式：DOCX
页数：20
大小：352.03KB

在线用户信息表格编辑.docx

《在线用户信息表格编辑.docx》由会员分享，可在线阅读，更多相关《在线用户信息表格编辑.docx（20页珍藏版）》请在冰豆网上搜索。

在线用户信息表格编辑.docx

在线用户信息表格编辑

在线用户信息表格编辑——实现搜索功能

1、在某个页面中添加一个搜索信息的表单

urlvalue='/userInfoManageAction.action'/>"method="post">

按用户类型搜索

按用户ID搜索

按用户名称搜索

按销售业绩搜索

src="

urlvalue='/images/search_btn.gif'/>"/>

2、编程实现搜索功能的后台Servlet程序

publicvoiddoSearchUserInfo_ByUserType（HttpServletRequestrequest,

HttpServletResponseresponse,StringsearchKeyWord）

throwsServletException,IOException{

StringtargetPage=this.getServletContext（）.getInitParameter（"forwardShowErrorInfoTargetPage"）;

intuserType;

if（searchKeyWord.equals（"普通用户"））{

userType=1;

}

elseif（searchKeyWord.equals（"后台管理"））{

userType=2;

}

else{//其它类型的用户

userType=0;

}

ListsomeUserInfosVOList=null;

UserInfoInterfaceoneUserInfoBean=newUserInfoManageImple（）;

try{

someUserInfosVOList=oneUserInfoBean.doSearchUserInfo_ByUserType（userType）;

}catch（WebCRMExceptione）{

request.setAttribute（"errorText",e.getMessage（））;

forwardTargetPage（targetPage,request,response）;

return;

}

if（someUserInfosVOList.size（）==0）{

request.setAttribute（"errorText","没有搜索到满足条件的结果信息！

"）;

forwardTargetPage（targetPage,request,response）;

}else{

request.setAttribute（"someUserInfosVOList",someUserInfosVOList）;

StringforawrdShowSearchResultTargetPage="/userManage/showSearchResultInfo.jsp";

forwardTargetPage（forawrdShowSearchResultTargetPage,request,response）;

}

return;

}

3、添加一个显示搜索结果信息的JSP页面

<%@pagepageEncoding="gb2312"%>

<%@taglibprefix="c"uri="

DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http:

//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

//www.w3.org/1999/xhtml">

蓝梦集团CRM系统在线用户信息搜索结果页面

urlvalue='/css/pageContentStyle.css'/>"rel="stylesheet"type="text/css"/>

urlvalue='/javascript/commonJavaScript.js'/>"

type="text/javascript">

varwebContextName="${pageContext.request.contextPath}";

urlvalue='/javascript/onLineEditTableRow.js'/>"

type="text/javascript">

includepage="/commonPage/pageHead.jsp">

include>

includepage="/commonPage/navMenuBar.jsp">

include>

#63F">

用户名

别名

密码回答问题

密码答案

电子邮件

性别

添加一行

forEachvar="oneUserInfosVO"items="${someUserInfosVOList}">

${oneUserInfosVO.userName}

${oneUserInfosVO.aliaoName}

${oneUserInfosVO.passWordAsk}

${oneUserInfosVO.passWordAnswer}

${oneUserInfosVO.userMail}

choose>

whentest="${oneUserInfosVO.userSex==1}">

outvalue="男"/>

when>

whentest="${oneUserInfosVO.userSex==0}">

outvalue="女"/>

when>

choose>

编辑该行

删除该行

forEach>

includepage="/commonPage/authorInfo.jsp">

include>

实现在线编辑功能

1、添加onLineEditTableRow.js文件

varuniqueRow=0;

varxmlHttpRequest;

/****************下面为增加新行的代码****************************/

functionaddNewRow（cellCount）{

vartbodyObj=document.getElementById（"dataTableTBodyID"）;

varnewTR=document.createElement（'tr'）;

varnewTDs=newArray（cellCount）;

for（varindex=0;index

newTDs[index]=document.createElement（'td'）;//新增的数据行包含有cellCount个单元格

}

varnewInputs=newArray（cellCount）;

for（varindex=0;index

newInputs[index]=document.createElement（'input'）;//新增的数据行包含有cellCount个输入框

newInputs[index].type="text";

newInputs[index].name="colName"+index;

newInputs[index].value="";//新增的行中单元格的初始值

}

newInputs[cellCount-1].type="button";//设置"保存"按钮的类型

newInputs[cellCount-1].id="saveButtonName"+（++uniqueRow）;//设置"保存"按钮的id名称

newInputs[cellCount-1].value="保存该行";

newInputs[cellCount-1].onclick=function（）{

varinputButtonValue=newArray（cellCount-1）;

for（varindex=0;index

inputButtonValue[index]=newInputs[index].value;

}//获得用户在文本框中所输入的各个新的值

saveNewRowDataToWebServer（inputButtonValue）;

};

for（varindex=0;index

newTDs[index].appendChild（newInputs[index]）;//将动态创建的各个文本框添加到对应的单元格中

newTR.appendChild（newTDs[index]）;//再将各个单元格添加到新增加的表格行中

}

tbodyObj.insertBefore（newTR,null）;//将新增加的表格行插入到当前的表格中

}

functionsaveNewRowDataToWebServer（inputButtonValue）{

varnewRowData="";

for（varindex=0;index

newRowData=newRowData+"dataName"+index+"="+inputButtonValue[index]+"&";

}

newRowData=newRowData+"dataCount="+inputButtonValue.length//只需要将newRowData作为查询参树字符串向服务器发送

varrequestURL=webContextName+"/onLineEditServlet.action?

action=saveOneNewRow&"+newRowData;

xmlHttpRequest=createXMLHTTPRequestObject（）;

xmlHttpRequest.onreadystatechange=processHttpResponseForSaveNewRow;

xmlHttpRequest.open（"GET",requestURL,true）;//Get请求方式的代码

xmlHttpRequest.send（null）;

}

functionprocessHttpResponseForSaveNewRow（）{

if（xmlHttpRequest.readyState==4）{

if（xmlHttpRequest.status==200）{

if（xmlHttpRequest.responseText!

=""）{

window.alert（"在将该行数据保存到数据库表中时出现了“"+httpRequest.responseText+"”错误!

"）;

}

else{

window.alert（"已经将该行数据保存到数据库表中!

"）;

}

elseif（xmlHttpRequest.status==404）{

alert（"没有找到与所请求的文件相匹配的资源！

"）;

}

else{

alert（"你所请求的页面发生异常，错误代码为：

"+httpRequest.status）;

}

else{

document.getElementById（showState）.innerHTML="检测中，请稍等...";

}

/*******************************下面为编辑某行的代码*************************************/

functioneditThisRow（inputButtonObj,dataID,cellCount）{//dataID代表要编辑的数据行的主键ID值

varinputButtonTempObj=inputButtonObj;

while（!

inputButtonTempObj.tagName||inputButtonTempObj.tagName.toLowerCase（）!

="tr"）{

inputButtonTempObj=inputButtonTempObj.parentNode;

}//从当前的标签往上搜索定位找到标签（页就是定位到当前编辑的表格行）

varinps=inputButtonTempObj.getElementsByTagName（"span"）;

varmyVals=[];

for（vari=0,len=inps.length;i

myVals[myVals.length]=inps[i].firstChild.nodeValue;

}

editThisRowData（document.getElementById（'add'）,inputButtonTempObj.nextSibling,

myVals,dataID,cellCount）;

inputButtonTempObj.parentNode.removeChild（inputButtonTempObj）;

}

functioneditThisRowData（inputButtonObj,sibBefore,vals,dataID,cellCount）{

vartbodyObj=document.getElementById（"dataTableTBodyID"）;

varnewTR=document.createElement（'tr'）;////新增的数据行包含有三个单元格

varnewTDs=newArray（cellCount）;

varnewInputs=newArray（cellCount）;

for（varindex=0;index

newTDs[index]=document.createElement（'td'）;

newInputs[index]=document.createElement（'input'）;

newInputs[index].type="text";

newInputs[index].name="colName"+index;

newInputs[index].value=vals[index];//获得原来表格单元格中的原来数据

}

newInputs[cellCount-1].type="button";//设置"保存"按钮的类型

newInputs[cellCount-1].id="saveButtonName"+（++uniqueRow）;//设置"保存"按钮的id名称

newInputs[cellCount-1].value="保存该行";

newInputs[cellCount-1].onclick=function（）{

varinputButtonValue=newArray（cellCount-1）;

for（varindex=0;index

inputButtonValue[index]=newInputs[index].value;

}

saveThisEditedRowDataToServer（inputButtonValue,dataID）;

};

for（varindex=0;index

newTDs[index].appendChild（newInputs[index]）;

newTR.appendChild（newTDs[index]）;

}

tbodyObj.insertBefore（newTR,sibBefore）;

}

functionsaveThisEditedRowDataToServer（inputButtonValue,dataID）{

varnewRowData="dataID="+dataID+"&";

for（varindex=0;index

newRowData=newRowData+"dataName"+index+"="+inputButtonValue[index]+"&";

}

newRowData=newRowData+"dataCount="+inputButtonValue.length//只需要将newRowData作为查询参树字符串向服务器发送

varrequestURL=webContextName+"/onLineEditServlet.action?

action=saveOneEditRow&"+newRowData;

xmlHttpRequest=createXMLHTTPRequestObject（）;

xmlHttpRequest.onreadystatechange=processHttpResponseForSaveOneEditRow;

xmlHttpRequest.open（"GET",requestURL,true）;//Get请求方式的代码

xmlHttpRequest.send（null）;

}

functionprocessHttpResponseForSaveOneEditRow（）{

if（xmlHttpRequest.readyState==4）{

if（xmlHttpRequest.status==200）{

if（xmlHttpRequest.responseText!

=""）{

window.alert（"在将该行数据保存到数据库表中时出现了“"+httpRequest.responseText+"”错误!

"）;

}

else{

window.alert（"已经将该行数据保存到数据库表中!

"）;

}

elseif（xmlHttpRequest.status==404）{

alert（"没有找到与所请求的文件相匹配的

版权申诉 word格式文档无特别注明外均可编辑修改；预览文档经过压缩，下载后原文更清晰！ 立即下载

配套讲稿：: 如PPT文件的首页显示word图标，表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
特殊限制：: 部分文档作品中含有的国旗、国徽等图片，仅作为作品整体效果示例展示，禁止商用。设计者仅对作品中独创性部分享有著作权。
关键词：: 在线用户信息表格编辑

冰豆网所有资源均是用户自行上传分享，仅供网友学习交流，未经上传用户书面授权，请勿作他用。

关于本文

本文标题：在线用户信息表格编辑.docx
链接地址：https://www.bdocx.com/doc/11805307.html

在线用户信息表格编辑.docx

热门标签