如何通过 java 获取 JS Grid 值
How to get JS Grid value by java
我正在使用 js 网格 ( http://js-grid.com/docs/ ),我想在用户单击提交按钮时获取所有 js-grid 内容,如下代码所示:
<link type="text/css" rel="stylesheet" href="jsgrid.min.css" />
<link type="text/css" rel="stylesheet" href="jsgrid-theme.min.css" />
<script type="text/javascript" src="jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="jsgrid.min.js"></script>
<form name="form1" method="post" action="MyJavaBackend">
<div id="jsGrid"></div>
<Input type="submit">
</form>
<script>
var clients = [
{ "Name": "Otto Clay", "Age": 25, "Country": 1, "Address": "Ap #897-1459 Quam Avenue", "Married": false },
];
var countries = [
{ Name: "", Id: 0 },
{ Name: "United States", Id: 1 },
{ Name: "Canada", Id: 2 },
{ Name: "United Kingdom", Id: 3 }
];
$("#jsGrid").jsGrid({
width: "100%",
height: "400px",
inserting: true,
editing: true,
sorting: true,
paging: true,
data: clients,
fields: [
{ name: "Name", type: "text", width: 150, validate: "required" },
{ name: "Age", type: "number", width: 50 },
{ name: "Address", type: "text", width: 200 },
{ name: "Country", type: "select", items: countries, valueField: "Id", textField: "Name" },
{ name: "Married", type: "checkbox", title: "Is Married", sorting: false },
{ type: "control" }
]
});
</script>
但是我的后端文件:
public ActionForward create(ActionMapping mapping, ActionForm form,
HttpServletRequest request,
HttpServletResponse response)
throws Exception {
String[] datas = request.getParameterValues("data");// **get null**
return mapping.findForward("create");
}
我查看了以下文章:
http://zetcode.com/articles/jsgridservlet/
但它只得到一行被编辑的记录。 (我想要获取所有 table 数据)
用户通过 request.getParameterValues 或 request.getParameter 或 ..... 单击提交按钮后,如何从 jsgrid 获取所有数据(所有用户输入)???
在字体末尾javascript:
function onSubmit(){
var items = $("#jsGrid").jsGrid("option", "data");//$("#jsGrid") must match <div id="jsGrid"></div>
var json = JSON.stringify(items);
document.form1.json.value=json;
}
<form name="form1" method="post" action="MyJavaBackend">
<div id="jsGrid"></div>
<input type="hidden" name="json" >
<Input type="button" onClick="onSubmit();">
</form>
在后端 Java:
import org.json.JSONArray;
import org.json.JSONException;
import org.json.JSONObject;
.....
String json_data = request.getParameter("json");
JSONArray jsonArray = new JSONArray(json_data);
for(int i=0;i<jsonArray.length();i++) {
JSONObject jsonObject=jsonArray.getJSONObject(i);
String name=jsonObject.getString("Name");
String age=jsonObject.getString("Age");
}
....
我正在使用 js 网格 ( http://js-grid.com/docs/ ),我想在用户单击提交按钮时获取所有 js-grid 内容,如下代码所示:
<link type="text/css" rel="stylesheet" href="jsgrid.min.css" />
<link type="text/css" rel="stylesheet" href="jsgrid-theme.min.css" />
<script type="text/javascript" src="jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="jsgrid.min.js"></script>
<form name="form1" method="post" action="MyJavaBackend">
<div id="jsGrid"></div>
<Input type="submit">
</form>
<script>
var clients = [
{ "Name": "Otto Clay", "Age": 25, "Country": 1, "Address": "Ap #897-1459 Quam Avenue", "Married": false },
];
var countries = [
{ Name: "", Id: 0 },
{ Name: "United States", Id: 1 },
{ Name: "Canada", Id: 2 },
{ Name: "United Kingdom", Id: 3 }
];
$("#jsGrid").jsGrid({
width: "100%",
height: "400px",
inserting: true,
editing: true,
sorting: true,
paging: true,
data: clients,
fields: [
{ name: "Name", type: "text", width: 150, validate: "required" },
{ name: "Age", type: "number", width: 50 },
{ name: "Address", type: "text", width: 200 },
{ name: "Country", type: "select", items: countries, valueField: "Id", textField: "Name" },
{ name: "Married", type: "checkbox", title: "Is Married", sorting: false },
{ type: "control" }
]
});
</script>
但是我的后端文件:
public ActionForward create(ActionMapping mapping, ActionForm form,
HttpServletRequest request,
HttpServletResponse response)
throws Exception {
String[] datas = request.getParameterValues("data");// **get null**
return mapping.findForward("create");
}
我查看了以下文章: http://zetcode.com/articles/jsgridservlet/
但它只得到一行被编辑的记录。 (我想要获取所有 table 数据)
用户通过 request.getParameterValues 或 request.getParameter 或 ..... 单击提交按钮后,如何从 jsgrid 获取所有数据(所有用户输入)???
在字体末尾javascript:
function onSubmit(){
var items = $("#jsGrid").jsGrid("option", "data");//$("#jsGrid") must match <div id="jsGrid"></div>
var json = JSON.stringify(items);
document.form1.json.value=json;
}
<form name="form1" method="post" action="MyJavaBackend">
<div id="jsGrid"></div>
<input type="hidden" name="json" >
<Input type="button" onClick="onSubmit();">
</form>
在后端 Java:
import org.json.JSONArray;
import org.json.JSONException;
import org.json.JSONObject;
.....
String json_data = request.getParameter("json");
JSONArray jsonArray = new JSONArray(json_data);
for(int i=0;i<jsonArray.length();i++) {
JSONObject jsonObject=jsonArray.getJSONObject(i);
String name=jsonObject.getString("Name");
String age=jsonObject.getString("Age");
}
....