jsp 在对页面某条数据进行更新时，首先要跳转到更新的页面，更新的页面会显示出这条数据的信息（一般是把该数据的ID传到后台方法中进行处理），对这些信息进行修改后点击更新按钮，成功的话则更新操作完成。
下面的代码涉及到更新操作和增加操作，框架是springmvc+jsp。其中也有通过js实现 单选框 和 下拉式列表 选中某项值的具体操作代码。
作为学习的一种参考！！
下拉式列表jsp页面：
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
.......
<script>
var id="${id}";
//根据ID获得服务信息
function getServerInfo()
{
var para={};
para.id=id;
$.ajax("operation/monitor/getjson?action=getinfo",{
async:true,
cache:false,
success : function(data, textStatus, jqXHR) {
if (textStatus == "success") {
try {
if (data.success) {
getinfores(data);
} else {
jAlert("getinfo.error1:" + data.message);
}
} catch (e) {
jAlert("getinfo.error2:" + e.message);
}
}
},
dataType : "json",
data : para,
type : "post",
processData : true
}).error(function() {
jAlert("getinfo.error3");
});
}
//给页面的文本框赋值
function getinfores(data)
{
var rows = data.rows;
if(rows.length >0)
{
$("#server_name").val(rows[0].server_name);
$("#server_ip").val(rows[0].server_ip);
var status =rows[0].server_role_name;
//下拉式列表选中指定项
$("#role option").each(function () {
if (this.value == status) {
this.selected = "selected";
}
});
}
}
//页面加载时调用函数
$(function()
{
getServerInfo();
});
//更新服务器信息
function updateinfo()
{
$("#btnsubmit").attr('disabled',"true");
setTimeout('$("#btnsubmit").removeAttr("disabled");', 5000);
var para = {};
para.id=id;
para.server_name = $("#server_name").val();
para.server_ip = $("#server_ip").val();
para.server_role = $("#role").val();
$.ajax("operation/monitor/getjson?action=update", {
async : false,
cache : false,
success : function(data, textStatus, jqXHR) {
if (textStatus == "success") {
try {
if (data.success) {
jAlert("操作成功");
document.location='<%=basePath%>operation/monitor';
} else {
jAlert("updateinfo.error1:" + data.message);
}
} catch (e) {
jAlert("updateinfo.error2:" + e.message);
}
}
},
dataType : "json",
data : para,
type : "post",
processData : true
}).error(function() {
jAlert("update.error3");
});
}
</script>
</head>
<body>
<!-- 菜单功能 -->
<%@include file="../left.jsp"%>
<div class="rightWapper">
<!--顶部 -->
<%@include file="../../../common/header.jsp"%>
<div class="content-header">
<p>监控管理</p>
</div>
<div class="webAdd">
<h1>服务器编辑</h1>
<ul>
<li><span>服务器名称：</span><input type="text" name="server_name" id="server_name" /></li>
<li><span>服务器IP：</span><input type="text" name="server_ip" id="server_ip" /></li>
<li><span>服务器角色：</span>
<select name="role" id="role">
<option value="采集服务器">采集服务器</option>
<option value="任务调度服务器">任务调度服务器</option>
<option value="负载均衡服务器">负载均衡服务器</option>
<option value="Web应用服务器">Web应用服务器</option>
<option value="分析服务器">分析服务器</option>
<option value="数据库服务器">数据库服务器</option>
<option value="缓存数据器">缓存数据器</option>
<option value="其他服务器">其他服务器</option>
</select>
</li>
</ul>
<div class="netBtnBox">
<input id="btnsubmit" name="btnsubmit" type="button" value="修改" class="btn-success" onclick="updateinfo()" />
<input type="button" value="取消" class="btn-default" onclick="document.location='<%=basePath%>operation/monitor'" />
</div>
</div>
</div>
<!--底部 -->
<%@include file="../../../common/footer.jsp"%>
</body>
</html>
单选框的选中某项处理：
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> ....... <script> var id = "${id}"; function getinfo() { var para = {}; para.id = id; $.ajax("operation/antiMonitor/getjson?action=getinfo", { async : true, cache : false, success : function(data, textStatus, jqXHR) { if (textStatus == "success") { try { if (data.success) { getinfores(data); } else { jAlert("getinfo.error1:" + data.message); } } catch (e) { jAlert("getinfo.error2:" + e.message); } } }, dataType : "json", data : para, type : "post", processData : true }).error(function() { jAlert("getinfo.error3"); }); } function getinfores(data) { var rows = data.rows; if(rows.length >0) { $("#ip").val(rows[0].ip); $("#type").val(rows[0].type); //处理单选框 var status = data.rows[0].status; $("[name='status']").each(function () { if (this.value == status) { this.checked = true; } }); } } function saveinfo() { $("#btnsubmit").attr('disabled',"true"); setTimeout('$("#btnsubmit").removeAttr("disabled");', 5000); var para = {}; para.id = "${id}"; para.ip = $("#ip").val(); para.type = $("#type").val(); para.status = ""; $("input:checked[name='status']").each(function () { para.status = this.value; }); $.ajax("operation/antiMonitor/getjson?action=update", { async : false, cache : false, success : function(data, textStatus, jqXHR) { if (textStatus == "success") { try { if (data.success) { jAlert("操作成功"); document.location='<%=basePath%>operation/antiMonitor'; } else { jAlert("saveinfo.error1:" + data.message); } } catch (e) { jAlert("saveinfo.error2:" + e.message); } } }, dataType : "json", data : para, type : "post", processData : true }).error(function() { jAlert("saveinfo.error3"); }); } $(function() { getinfo(); }); </script> </head> <body> <!-- 菜单功能 --> <%@include file="../left.jsp"%> <div class="rightWapper"> <!--顶部 --> <%@include file="../../../common/header.jsp"%> <div class="content-header"> <p>反监控管理</p> </div> <div class="webAdd"> <h1>修改代理IP</h1> <ul> <li><span>代理IP：</span><input id="ip" name="ip" type="text" /></li> <li><span>状态：</span><input type="radio" name="status" value="1" />启用<input type="radio" name="status" value="0" />未启用</li> <li><span>类型：</span> <select id="type" name="type"> <option value="1">国内</option> <option value="2">国外</option> </select> </li> </ul> <div class="netBtnBox"> <input id="btnsubmit" name="btnsubmit" type="button" value="保存" class="btn-success" onclick="saveinfo()" /> <input type="button" value="取消" class="btn-default" onclick="document.location='<%=basePath%>operation/antiMonitor'" /> </div> </div> </div> <!--底部 --> <%@include file="../../../common/footer.jsp"%> </body> </html> controller 类： /** * 查询json数据 * @param map * @param request * @return */ @RequestMapping("/getjson") public String getjson(ModelMap map, HttpServletRequest request) { try { String straction = request.getParameter("action").toLowerCase(); HashMap<String, Object> res; if("add".toLowerCase().equals(straction)) { //添加 service.add(request); res = new HashMap<String, Object>(); res.put("success", true); res.put("message", "ok"); }else if("update".toLowerCase().equals(straction)) { //保存 service.update(request); res = new HashMap<String, Object>(); res.put("success", true); res.put("message", "ok"); }else if("del".toLowerCase().equals(straction)) { //删除 service.del(request); res = new HashMap<String, Object>(); res.put("success", true); res.put("message", "ok"); }else if("getinfo".toLowerCase().equals(straction)) { //查询详细信息 res = new HashMap<String, Object>(); res.put("success", true); res.put("message", "ok"); res.put("rows", service.getinfo(request)); } else { throw new Exception("getjson.error:没有找到指定的action"); } //返回结果 map.put("jsondata", JSON.toJSONString(res)); }catch(Exception e) { //错误记日志 LogRecord.error("getjson.error:(" + e.getMessage() + ")" + e.getStackTrace()); //输出错误信息 HashMap<String, Object> res = new HashMap<String, Object>(); res.put("success", false); res.put("message", "getjson.error:" + e.getMessage()); map.put("jsondata", JSON.toJSONString(res)); } return "common/json"; } service类：
/** * 修改 服务器信息 * @return * @throws Exception */ public boolean update(HttpServletRequest request) throws Exception { Map<String,String> filterMap = new HashMap<String, String>(); String id = CommonUtil.getNoNullPara(request, "id"); String server_name =CommonUtil.getNoNullPara(request, "server_name"); String server_ip =CommonUtil.getNoNullPara(request, "server_ip"); String server_role =CommonUtil.getNoNullPara(request, "server_role"); if(StringUtils.isNotEmpty(id)) { filterMap.put("id", id); } if(StringUtils.isNotEmpty(server_name)) { filterMap.put("server_name", server_name); } if(StringUtils.isNotEmpty(server_ip)) { filterMap.put("server_ip", server_ip); } if(StringUtils.isNotEmpty(server_role)) { filterMap.put("server_role_name", server_role); } if(operationManDaoImpl.updateServerInfo(filterMap)) { return true; }else { throw new Exception("server.update.error:" + String.valueOf("operationManDaoImpl.updateServerInfo(filterMap)")); } } daoImpl 方法： /** * @param filterMap * @return * 更新服务器信息 */ public boolean updateServerInfo(Map<String,String> filterMap) { StringBuffer sql = new StringBuffer("update servers set "); if(filterMap.size()>0) { if(null!=filterMap.get("server_name")) { sql.append(" server_name='"+filterMap.get("server_name")+"',"); } if(null!=filterMap.get("server_ip")) { sql.append("server_ip='"+filterMap.get("server_ip")+"',"); } if(filterMap.get("server_role_name")!=null) { //根据服务器角色名称获得服务器角色id String roleSql="select server_role_id from server_role WHERE server_role_name='"+filterMap.get("server_role_name")+"'"; int server_role =Integer.valueOf(this.jdbcTemplate.queryForList(roleSql).get(0).get("server_role_id").toString()); sql.append("server_role="+server_role); } if(null!=filterMap.get("id")) { sql.append(" where id="+Integer.valueOf(filterMap.get("id").toString())); } } return this.jdbcTemplate.update(sql.toString())>0; }