先附上前端easyUI easyui-datagrid中代码
<table id="dg" title="选课信息" class="easyui-datagrid" fitColumns="true"
pagination="true" url="stuServlet?method=getStuList" fit="true" toolbar="#tb">
<thead>
<tr>
<th field="cb" checkbox="true"></th>
<th field="id" width="50">学生编号</th>
<th field="name" width="100">学生姓名</th>
<th field="birString" width="250">birthday</th>
<th field="gname" width="100">班级名称</th>
<th field="count" width="100">已选课数</th>
<th field="cptime" width="100">所选课时</th>
</tr>
</thead>
</table>
以上代码可在页面上展现出选课列表
但是如果我们需要添加模糊功能,那么就需要更改url地址来显示模糊列表
代码如下
<div> 学生姓名: <input type="text" name="stuName" id="stuName"><button onClick="searchStu()" id="search" class="easyui-linkbutton" iconCls="icon-search" plain="true">搜索</button></div>
js代码如下
function searchStu(){
$('#search').bind('click', function(){
var str=$("#stuName").val();
$('#dg').datagrid("options").url = 'stuServlet?method=mohu&stuName='+encodeURI(encodeURI(str));
$('#dg').datagrid('load');
});
}
首先由于这里是使用url方式直接传给后端(相当于是get方法,还有一种是post会自动编码) 因此需要将要查询的参数携带到url中 这样后端才能拿到这个数据到数据库中进行模糊查询
但是这里传递的是中文的话 就会出现乱码问题,因此需要先将中文在前端页面上解析 就需要用到encodeURI(encodeURI(str))进行两次编码 两次是为了使浏览器不进行编码,然后后台在request.getParameter进行一次解码就能获取到中文数据,而如果前台只进行一次编码的话,那么浏览器会对其进行一次解码 后台request.getParameter也会进行一次解码则还是会乱码
servlet代码如下
String stuName = request.getParameter("stuName");
stuName=URLDecoder.decode(stuName,"utf-8");
这样这里拿到的stuName即为填入的中文
注意还要写上
if(stuName!=null&&stuName.length()>0) {
mohuList= studentService.mohuList(stuName);
String string = JSON.toJSONString(mohuList);
response.getWriter().write(string);
}
因为datagrid需要的是json字符串!
最后想说的是 最好使用动态拼接页面列表比较方便,不要把页面写死就!!!