1、前台页面：
因为要展示正版和非正版，所以传个Type值过去：
//正版序列号库列表
var type = $("input[name='serialNumber']:checked").val();
$("#inside_tableElement").datagrid({
striped : true,
collapsible : true,
url : "${basePath}/genuineSerialNumberManagementAction_list.do",
queryParams:{
"genuineSerialNumberManagement.type":type
},
columns : [ [
{field : 'softDisplayName',title : '软件名',align : 'center',width : (datag_width * 0.44)},
{field : 'version',title : '版本号',align : 'center',width : (datag_width * 0.44)},
{field : 'serialNumber',title : '序列号',align : 'center',width : (datag_width * 0.44)}
] ],
fitColumns : true,
rownumbers : true,
pagination:true,
pageSize: ,
pageList: [, , ],
onSelectAll : function() {
},
onUnselectAll : function() {
},
onSelect : function() {
},
onUnselect : function(rowIndex, rowData) {
}
});
后台list方法：
public void list(){
GridData<GenuineSerialNumberManagement> genuineSerialNumberManagements = null;
try {
HQLBuilderUtil builderUtil = new HQLBuilderUtil(GenuineSerialNumberManagement.class);
builderUtil.addOrderByProperty(" this.id ", true);
if(genuineSerialNumberManagement.getType() != null){
int type = genuineSerialNumberManagement.getType();
builderUtil.addWhereClause(" this.type=? ", type);//增加查询属性type
}
//当有SoftDisplayName传过来时，还要增加查询属性SoftDisplayName
if(genuineSerialNumberManagement.getSoftDisplayName() != null && !"".equals(genuineSerialNumberManagement.getSoftDisplayName())){
String softDisplayName = genuineSerialNumberManagement.getSoftDisplayName();
builderUtil.addWhereClause(" this.softDisplayName=? ", softDisplayName);
}
System.out.println(builderUtil.toQueryListHql());
genuineSerialNumberManagements = genuineSerialNumberManagementService.getPageView(builderUtil, getPageNum(), getPageSize());
} catch (Exception e) {
log.error("正版序列号管理列表获取失败！", e);
}finally{
print(ActionUtil.jsonObj(genuineSerialNumberManagements));
}
}
我们可以看下HQLBuilderUtil 工具类里面的addWhereClause：注意需要加 =? 来与参数对应
/**
* 添加过滤条件，组织WHERE语句(可变参数附条件)
* @param condition 过滤的条件
* @param params 参数列表
* @return 工具类本身
*/
public HQLBuilderUtil addWhereClause(String condition, Object... params){
//1.组织语句
if(StringUtils.isBlank(whereClause)){
whereClause = " WHERE " + condition;
}else{
whereClause += " AND " + condition;
}
//2.添加参数
if(params != null && params.length>){
for (Object param : params) {
paramList.add(param);
}
}
return this;
}
2、接着，我们看点击左右软件名字，与右侧展示数据的交互
//左边菜单栏切换
function changeMenu(obj){
$(obj).siblings().removeClass("selected");
$(obj).addClass("selected");
var softDisplayName = $(obj).text(),
type = $('input[name="serialNumber"]:checked').val();
if(type === ""){
$("#inside_tableElement").datagrid('load',{
"genuineSerialNumberManagement.type":type,
"genuineSerialNumberManagement.softDisplayName":softDisplayName
})
}else{
$("#inside_tableElement_no").datagrid('load',{
"genuineSerialNumberManagement.type":type,
"genuineSerialNumberManagement.softDisplayName":softDisplayName
})
}
}
也就是上面的list方法，传入了softDisplayName的查询属性。
3、接着，正版和非正版之间切换：注意$("#inside_tableElement_no")需要这样初始化表格之后，才能再像正版那样使用 load 传入参数重新加载
//正版与非正版之间切换
$("#genuineSerialNumber").click(function(){
$("#tableName").text("正版序列号库：");
$("#center1").css('display','block');
$("#center2").css('display','none');
var type = $("#genuineSerialNumber").val();
var softDisplayName = $("#softNameMenu .selected").text();
$("#inside_tableElement").datagrid("load",{
"genuineSerialNumberManagement.type":type,
"genuineSerialNumberManagement.softDisplayName":softDisplayName
});
});
$("#non_genuineSerialNumber").click(function(){
$("#tableName").text("非正版序列号库：");
$("#center1").css('display','none');
$("#center2").css('display','block');
var type = $("#non_genuineSerialNumber").val();
var softDisplayName = $("#softNameMenu .selected").text();
$("#inside_tableElement_no").datagrid({
striped : true,
collapsible : true,
url : "${basePath}/genuineSerialNumberManagementAction_list.do",
queryParams:{
"genuineSerialNumberManagement.type":type,
"genuineSerialNumberManagement.softDisplayName":softDisplayName
},
columns : [ [
{field : 'softDisplayName',title : '软件名',align : 'center',width : (datag_width * 0.44)},
{field : 'version',title : '版本号',align : 'center',width : (datag_width * 0.44)},
{field : 'serialNumber',title : '序列号',align : 'center',width : (datag_width * 0.44)}
] ],
fitColumns : true,
rownumbers : true,
pagination:true,
pageSize: ,
pageList: [, , ]
});
});
4、struts的s:iterator标签循环遍历：
左侧的软件名称是通过struts遍历数据的值来展示，通过下面方式。
后台需要设置list到前台来：
public String listUI(){
List<GenuineSerialNumberManagement> genuineSerialNumberManagements = genuineSerialNumberManagementService.queryAll();
List<GenuineSerialNumberManagement> genuineSerialNumberManagementList = new ArrayList<GenuineSerialNumberManagement>();
if(genuineSerialNumberManagements != null){
for(GenuineSerialNumberManagement gsnm : genuineSerialNumberManagements){
GenuineSerialNumberManagement gm = new GenuineSerialNumberManagement();
gm.setSoftDisplayName(gsnm.getSoftDisplayName());
genuineSerialNumberManagementList.add(gm);
}
}
getRequest().setAttribute("genuineSerialNumberManagementList", genuineSerialNumberManagementList);
return RETURN_LISTUI;
}
前台通过下面方式获取遍历：
<div id="softNameMenuContent">
<s:if test="#request.genuineSerialNumberManagementList != null">
<s:iterator value="#request.genuineSerialNumberManagementList">
<a class="softName" onclick="changeMenu(this);"><span><s:property value="#request.softDisplayName" /></span></a>
</s:iterator>
</s:if>
</div>