easyui弹出window里加载datagraid

2019独角兽企业重金招聘Python工程师标准>>>

 

easyui弹出window里加载datagraid

function getMerchantNoRangeSucc(merchantNo) {
	$('#dlg-merchantNo-succ').show();
	$('#dlg-merchantNo-succ').window({
		title : '商户分段成功率',
		width:800,
		height:450,
		fitColumns:true,
	    collapsible:false, 
	    minimizable : false,
	    maximizable : false,
	    modal:true,
	    iconCls : "icon-view-detail",
	    buttons : [ 
	    	 {
			text : '关闭',
			iconCls : 'icon-cancel',
			handler : function() {
				$('#dlg-merchantNo-succ').window('close');
			}
		}]
	});
	$('#dlg-merchantNo-succ').window('open');
	$("#datagrid-merchantNo-succ").datagrid({
		url : "modules/sysbase/merchantNoRangeSuccessRate",
		queryParams : {
			merchant_no:merchantNo
		},
		nowWrap : true,
		fitColumns : true,
		fit : true,
		singleSelect:true,
		autoRowHeight : false,
		striped : true,
		rownumbers : true,
		pagination : false, // 显示分页
		striped : true, // 奇偶行颜色不同
		title : "",
		idField : '',
		columns : [[
		            {field : 'merchant_no',title : '商户名',width : 100,},
		            {field : 'node_code',title : '编码',width : 100},
				    {field : 'node_name',title : '名称',width : 100},
				    {field : 'range',title : '金额范围',width : 100},
				    {field : 'total',title : '总交易数',width : 100},
				    {field : 'success',title : '成功笔数',width : 100},
				    {field : 'succ_rate',title : '成功率',width : 100}
		]]
	});
}


function formatMerchantNo(value, row, index) { 
    var str = '<a href="javascript:void(0)" onclick="getMerchantNoRangeSucc('+ "'"+value+"'"+')">' + value + '</a>';  
    return str;  
}

与其配合的jsp是

	<!-- 某个商户号的金额分段成功率 -->
	<div id="dlg-merchantNo-succ" style="display:none">
        <table id="datagrid-merchantNo-succ">
        </table>  
    </div> 

 

最初的垃圾

	<!-- 某个商户号的金额分段成功率 -->
	<div id="dlg-merchantNo-succ" class="easyui-dialog" style="width: 600px; height: auto; padding: 10px 20px" data-options="closed:true,buttons:'#dlg-merchantNo-succ-buttons'">
        <table id="datagrid-merchantNo-succ">
        </table>  
    </div>  
    <div id="dlg-merchantNo-succ-buttons">  
        <a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-cancel'" onclick="javascript:$('#dlg-merchantNo-succ').dialog('close')"  style="width: 90px">关闭</a>  
    </div>

function getMerchantNoRangeSucc(merchantNo) {
	//alert(merchantNo);
	$("#datagrid-merchantNo-succ").datagrid({
		url : "modules/sysbase/merchantNoRangeSuccessRate",
		//url : "modules/sysbase/a.json",
		queryParams : {
			//merchant_no:$('#merchant_no').val()
			merchant_no:merchantNo
		},
		nowWrap : true,
		fitColumns : true,
		fit : true,
		singleSelect:true,
		autoRowHeight : false,
		striped : true,
		rownumbers : true,
		pagination : false, // 显示分页
		striped : true, // 奇偶行颜色不同
		title : "商户分段的成功率",
		idField : '',
		columns : [[
		            {field : 'merchant_no',title : '商户名',width : 100,},
		            {field : 'node_code',title : '编码',width : 100},
				    {field : 'node_name',title : '名称',width : 100},
				    {field : 'range',title : '范围',width : 100},
				    {field : 'total',title : '总交易数',width : 100},
				    {field : 'success',title : '成功交易数',width : 100},
				    {field : 'succ_rate',title : '成功率',width : 100}
		]],
		//toolbar : "#tool-bars",
		//pageNumber : 1,
		//pageSize : 20
	});
	
	$('#dlg-merchantNo-succ').dialog({
	    title: '商户分段的成功率',
	    width: 800,
	    height: 400,
	    closed: false,
	    cache: false,
	    modal: true
	});
	$('#dlg-merchantNo-succ').diglog('open');
	$('#dlg-merchantNo-succ').diglog('center');
}

 

combobox的使用

<input name="node_code" id="node_code" type="text" style="width:150px" class="easyui-textbox" />

 

    //通道
	$('#node_code').combobox({
		valueField:'pay_node_code', //值字段
	    textField:'pay_node_name', //显示的字段
	    url:'modules/sysbase/queryAllPayNodeUse',
	    panelHeight:300,
	    required:false,
		editable:false//不可编辑，只能选择
	});
	
	$('#start_date').datebox('setValue', '今天');
	$('#end_date').datebox('setValue', '今天');

 

转载于:https://my.oschina.net/lenglingx/blog/1535697