目的,点击窗口中的输入框,再弹出一个子窗口,可以选择类路径,点击确定后,自动填入父窗体的输入框
一、先在父窗口创建点击事件
<td class="kv-content">
<input id="beanClass" name="beanClass" class="easyui-validatebox" onclick="popClassCron()" />
</td>
function popClassCron(){
var dialog = parent.sy.modalDialog({
title: '选择类路径',
height: '450',
url: sy.contextPath + '/manage/dynamicClassCron.jsp',
buttons: [{
text: '确定',
handler: function () {
var d = dialog.find('iframe').get(0).contentWindow;
var bean_class = $("#bean_class",d.document).val();
var method_name = $("#method_name",d.document).val();
if(bean_class == ''){
parent.$.messager.alert('提示框','请选择一个类!','warning');
}else{
$('#beanClass').val(bean_class);
$('#methodName').val(method_name);
dialog.dialog('destroy');
}
}
}]
});
}
二、编写dynamicClassCron.jsp页面
<script>
$(function() {
var queryField=$("#queryField").val();
var queryValue=$.trim($("#queryValue").val());
var params = {"queryField":queryField,"queryValue":queryValue};
grid = $('#grid').datagrid({
url : sy.contextPath + '/scheduleJobController/findClassesList_noSecurity',
fit : true,
fitColumns : true,
pagination : true,
queryParams:params,
pageSize : 20,
pageList : [ 20, 50, 100],
rownumbers : true,
nowrap : false,
singleSelect:true,//单选
// striped : true,//单双行效果
columns : [ [
{field:'class_id',checkbox:true,formatter:function (val,row){
console.info(val);
}},
{field:'bean_class',title:'类名',align: 'center',width:200,formatter:function (val,row) {
if(val == null){
return null;
}else{
var valArray = val.split('.');
var len = val.split('.').length;
var finalClass = valArray[len-1];
return "<span title='"+val+"'>"+finalClass+"</span>";
}
}
},
{field:'method_name',title:'方法名',align: 'center',width:100,formatter:function (val,row) {
if(val == null){
return null;
}else{
return "<span title='"+val+"'>"+val+"</span>";
}
}
},
{field:'description',title:'描述',align: 'center',width:100,formatter:function (val,row) {
if(val == null){
return null;
}else{
return "<span title='"+val+"'>"+val+"</span>";
}
}
}
]],
toolbar : '#toolbar',
onBeforeLoad : function(param) {
parent.$.messager.progress({
text : '数据加载中....'
});
},
onClickRow:function(rowIndex, rowData){
var bean_class = rowData["bean_class"];
var method_name = rowData["method_name"];
$("#bean_class").val(bean_class);
$("#method_name").val(method_name);
},
onLoadSuccess : function(data) {
$("#grid").parent().find("div.datagrid-header-check").children("input[type='checkbox']").eq(0).attr("style", "display:none;");
parent.$.messager.progress('close');
}
});
});
//查询按钮
function doSearch(){
$('#grid').datagrid("load",{
queryField:$("#queryField").val(),
queryValue:$.trim($("#queryValue").val())
});
}
//刷新按钮
function doRefresh(){
$('#grid').datagrid("load",{
queryField:$("#queryField").val(),
});
$('#queryValue').val('');
}
</script>
*注意: columns :field 的字段用来接收数据,必须和后台传输的字段名一致,若后台用的sql查询,则字段名与数据库字段小写一致,如果后台用hql查询,则和对应类的名字一样。
三、java代码
EasyDataGrid grid = new EasyDataGrid();
StringBuilder sqlConn = new StringBuilder();
StringBuilder sqlCount = new StringBuilder();
String queryValue = dto.getQueryValue();
String queryFiled = dto.getQueryField();
sqlConn.append("select * from T_RUN_SCHEDULE_CLASS where 1=1");
if(StringUtil.isNotNull(queryValue)){
if (queryFiled.equals("bean_class")){
sqlConn.append(" and regexp_substr(bean_class, '[^.]+', 1, regexp_count(bean_class,'[^.]+')) in (" +
"select * from(select regexp_substr(bean_class, '[^.]+', 1, regexp_count(bean_class,'[^.]+'))"+
"class from T_RUN_SCHEDULE_CLASS) where class like '%").append(queryValue).append("%')");
}else {
sqlConn.append(" and ").append(queryFiled).append(" like '%").append(queryValue).append("%'");
}
}
sqlCount.append("select count(*) from(").append(sqlConn.toString()).append(")");
Long total = this.countBySql(sqlCount.toString());
List rows = this.findBySql(sqlConn.toString(),dto.getPage(),dto.getRows());
grid.setTotal(total);
grid.setRows(rows);
return grid;
queryFiled 是dynamicClassCron.jsp页面中的查找类型
queryValue 是dynamicClassCron.jsp页面中的输入框用户设置的查找条件
total 和 rows是easyui 可以接受的分页参数,grid.setTotal(total) 、grid.setRows(rows);便可以实现分页,但前提是查找rows时要将dto参数放到sql语句中。
四、总结
1、我在dynamicClassCron.jsp中引入了bootstrap却没用,导致布局不理想
2、sql查询是用原生sql语句,表名字段名必须和数据库一致;hql语句是与对象映射的语句,表名和字段名都是类名和类属性
3、field中的数据可以筛选,用formatter:function(val,row){ 条件 }即可