EasyUI的面板和Ajax的结合使用

学习这一点的时候,让我感到很惊讶,因为我在丝毫没有看到ajax影子的情况下的的确确的使用着ajax,这必然是极好的。

面板的属性,方法和行为相对比较多,在这里就不做太多的累赘,这里只说一下关于一些关于被面板封装的Ajax操作。

$(function(){
	$("#box").panel({
		title: '搜面板',
		width: 500,
		height: 500,
		iconCls: 'icon-search',
		left: 300,
		top: 150,
		cla: 'a',
		headerCls: 'b',
		bodyCls: 'c',
		// fit: true,
		// border: false,
		// noheader: true,
		collapsible: true,//可折叠按钮
		minimizable: true,//最小化按钮
		maximizable: true,//最大化按钮
		closable: true,//关闭按钮
		tools: [{	//自定义方式
			iconCls: 'icon-help',
			handler: function (){
				alert("help");
			},
		},{
		}],
		tools: [{	//自定义方式
			iconCls: 'icon-reload',
			handler: function (){
				$("#box").panel('refresh');
			},
		},{
		}],
		// collapsed: true,
		href: 'content.php',
		loadingMessage: '加载中,请稍等。。。',
		extractor: function(data){
			return data.substring(0,7);
		},
		// onBeforeLoad: function(){
		// 	alert("远程加载之前触发!");
		// },
		// onLoad: function(){
		// 	alert("远程加载之后触发!");
		// },
		// onBeforeOpen: function(){
		// 	alert("打开之前触发!");
		// },
		// onOpen: function(){ 
		// 	alert("打开之后触发!");
		// },
		// onBeforeClose: function(){
		// 	alert("关闭之前触发!");
		// },
		// onClose: function(){ 
		// 	alert("关闭之后触发!");
		// },
		// onBeforeDestroy: function(){
		// 	alert("销毁之前触发!");
		// },
		// onDestroy: function(){ 
		// 	alert("销毁之后触发!");
		// },
		// onBeforeCollapse: function(){
		// 	alert("折叠之前触发!");
		// },
		// onCollapse: function(){ 
		// 	alert("折叠之后触发!");
		// },
		


	});

	 $("#box").panel('panel').css('position','absolute');
	 // $("#box").panel('destroy');
});


  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值