当前位置: 代码迷 >> Java Web开发 >> 求教,关于Jquery datagrid的有关问题
  详细解决方案

求教,关于Jquery datagrid的有关问题

热度:573   发布时间:2016-04-17 00:48:52.0
求教,关于Jquery datagrid的问题
现在,我在jsp页面中,用datagrid做了一个动态加载的列表,这个列表中每一行有两个单元格是下拉菜单框。页面刚加载完时,表格只有一个表头,在表头上方有一个“增加”按钮,点击一次该按钮,列表下方就增加一行,当我在这一行中输入了相关内容后,再去点击“增加”按钮,希望再增加一行出来,同时第一行输入的内容保留,但现在的问题是,当我增加一行后,第一行输入的内容便清空了。
我想了很多种法子,都不行,请熟悉jquery datagrid功能的朋友帮帮忙啊。谢谢


------解决方案--------------------
后台Demo代码:
package com.test.Action;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import com.opensymphony.xwork2.ActionSupport;
import com.test.bean.User;

@SuppressWarnings("serial")
public class UserAction extends ActionSupport {

private List<Object> rows = new ArrayList<Object>();
private int total;

public String execute() { 
System.out.println("execute invoked@@@");
for (int i = 0; i < 10; i++) {
User user = new User();
user.setId(i);
user.setUsername("user_"+i);
user.setPassword("pass_"+i);
HashMap<String, Object> map = new HashMap<String, Object>();
map.put("userId", user.getId());
map.put("userName", user.getUsername());
map.put("password", user.getPassword());
rows.add(map);
}
return SUCCESS;
}

public List<Object> getRows() {
return rows;
}

public void setRows(List<Object> rows) {
this.rows = rows;
}


public int getTotal() {
return total;
}


public void setTotal(int total) {
this.total = total;
}
}
前台代码:
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
<link rel="stylesheet" type="text/css" href="css/easyui.css">
 <link rel="stylesheet" type="text/css" href="css/icon.css">
<script type="text/javascript" src="js/jquery-1.6.min.js"></script>
<script type="text/javascript" src="js/jquery.easyui.min.js"></script>

<script type="text/javascript">
function showUserList() {
alert('进来了');
$('#table').datagrid({
url:'userAction.action',
columns:[[
{field:'userId',title:'ID',width:100},
{field:'userName',title:'用户名',width:100},
{field:'password',title:'密码',width:100,align:'right'}
]]
});
}
</script>

</head>
<body>
<div>
<a href="javascript:showUserList()">得到用户组</a>
</div>
<hr>
<div>
<table id="table">
</table>
</div>
</body>
</html>

最后注意几点:struts-json-plugin.jar和jquery一些相关的css,和js文件需要引用。以及struts.xml中的配置:
<package name="struts" extends="json-default">
<action name="userAction" class="com.test.Action.UserAction">
<result type="json"></result>
 </action>
</package>
  相关解决方案