来源:自学PHP网 时间:2015-04-14 14:51 作者: 阅读:次
[导读] 需求:当在查询页面查询到后台数据后,在查询页面点击更新按钮后,弹出一个模式窗口。在该模式窗口中得到更新之前各input标签的值。修改完毕点击提交时关闭该模态窗口,同时刷新...
需求:当在查询页面查询到后台数据后,在查询页面点击更新按钮后,弹出一个模式窗口。在该模式窗口中得到更新之前各input标签的值。修改完毕点击提交时关闭该模态窗口,同时刷新父窗口(查询窗口)的内容。下面是流程。
1.我是用struts2标签遍历得到后台数据的。首先得引入struts2标签<%@ taglib prefix="s" uri="/struts-tags"%>
2.查询页面关键代码:
[html]
<span style="color:#CC0000"><script type="text/javascript" src="js/jquery-1.6.4.min.js"></script></span>
<script type = "text/javascript">
<span style="color:#CC0000">function update(id,name,address,phone){//定义一个函数传入表单的四个参数
//alert(phone);
window.showModalDialog('update.jsp',{"id":id,"name":name,"address":address,"phone":phone},"dialogWidth=400px;dialogHeight=400px;dialogLeft=10;dialogTop=145");
}</span>
<span style="color:#CC0000">function refresh(){//此刷新函数被弹出的子模态窗口调用。
window.location.href = "findEmployee.action";
}</span>
</script>
</head>
<body>
<center>
<h1>查询雇员信息</h1>
<hr>
<table border="1" class="datalist">
<tr class="altrow">
<td>姓名</td>
<td>住址</td>
<td>电话</td>
<td align="center">操作</td>
</tr>
<s:iterator value="#request.list">
<tr>
<td><s:property value="name" /></td>
<td><s:property value="address" /></td>
<td><s:property value="phone" /></td>
<span style="color:#CC0000"><td><a href="" onclick="update(<s:property value='id' />,'<s:property value='name' />','<s:property value='address' />','<s:property value="phone" />')">更新</a> <a href="javascript:if(confirm('确认删除?')){window.location.href='deleteEmployee.action?id=<s:property value="id" />'}">删除</a>
</td></span>
</tr>
</s:iterator>
<tr><td colspan = "4" align ="center"><a href = "addEmp.jsp">添加雇员信息</a></td></tr>
</table>
<hr>
</center>
</body>
3.执行更新功能的模态窗口子页面关键代码:
[html]
<script type="text/javascript" src="js/jquery-1.6.4.min.js"></script>
</head>
<script type="text/javascript">
$(function() {
var id = window.dialogArguments.id; //模态窗口通过window.dialogArguments获取父窗体传递过来的参数
var name = window.dialogArguments.name;
var address = window.dialogArguments.address;
var phone = window.dialogArguments.phone;
$("title").html("修改ID编号为" + id + "的信息");//给标题赋值
$("input[name='id']").val(id); //给各个文本框赋修改之前的值
$("input[name='name']").val(name);
$("input[name='address']").val(address);
$("input[name='phone']").val(phone);
//点击事件
$("#button1").click(function() {
var id1 = $("#myid").val(); //得到修改后各个文本框的值
var name1 = $("#myname").val();
var address1 =$("#myaddress").val();
var phone1 = $("#myphone").val();
$.get("updateEmployee.action",{"id":id1,"name":name1,"address":address1,"phone":phone1},function(data){//执行action
if(data.indexOf("true")>-1){ //判断返回的字符串中是否包含true
window.opener.refresh(); //调用父窗体中定义的刷新方法从而刷新父窗体
window.close(); //关闭本页面
}else{
alert("error");
}
},"text");
});
});
</script>
<body>
<center>
<h1>更新操作</h1>
<hr>
<form action="updateEmployee.action" method="post" id="form1"
name="form1">
<table border=1>
<tr>
<td align="right">ID编号</td>
<td><input value="${param.id }" name="id" id="myid"></td>
</tr>
<tr>
<td align="right">用户名</td>
<td><input type="text" value="${param.name}" name="name" id="myname">
</td>
</tr>
<tr>
<td align="right">用户住址</td>
<td><input type="text" value="${param.address }"
name="address" id="myaddress">
</td>
</tr>
<tr>
<td align="right">用户电话</td>
<td><input type="text" value="${param.phone }" name="phone" id="myphone">
</td>
</tr>
<tr>
<td colspan="2" align="center"><input type="button" value="更新"
id="button1"> <input type="reset" value="重置">
</td>
</tr>
</table>
</form>
</center>
</body>
4.action里面通过out对象对当前页面打印一个标志性的字符串,用于判断更新是否成功。代码如下:
[java]
public void update() {
HttpServletResponse response = ServletActionContext.getResponse();
PrintWriter out;
try {
out = response.getWriter();
employ = new Employee(id,name, address, phone);
System.out.println("=============="+employ);
boolean result = emp.update(employ);
System.out.println(result);
if (result) {
out.print("true");
//return SUCCESS;
}
} catch (IOException e) {
e.printStackTrace();
}
//return ERROR;
}
|
自学PHP网专注网站建设学习,PHP程序学习,平面设计学习,以及操作系统学习
京ICP备14009008号-1@版权所有www.zixuephp.com
网站声明:本站所有视频,教程都由网友上传,站长收集和分享给大家学习使用,如由牵扯版权问题请联系站长邮箱904561283@qq.com