easyui扩展自定义组件实例

easyui扩展自定义组件

1. 注册组件comboboxTotree

$.parser.plugins.push("comboboxTotree");//注册扩展组件
$.fn.comboboxTotree = function (options, param) {//定义扩展组件
	//当options为字符串时，说明执行的是该插件的方法。
	if (typeof options == "string") { return $.fn.combobox.apply(this, arguments); }
	options = options || {};
	//当该组件在一个页面出现多次时，this是一个集合，故需要通过each遍历。
	return this.each(function () {
		var jq = $(this);
		//$.fn.combobox.parseOptions(this)作用是获取页面中的data-options中的配置
		var opts = $.extend({}, $.fn.combobox.parseOptions(this), options);
		commonReceiveOrg(opts)
	});
};
function commonReceiveOrg(data){
	//1、这里组装组件结构和样式
	//2、如果里面应用到了其他easyui的组件需要重新获取下组件，要不动态加载的组件不会拥有其样式
	//$.parser.parse('#'+currentBoxtId);
}

2. 调用组件

1、页面引入comboboxTotree.js
2、页面配置：（例）
<div class="easyui-comboboxTotree" data-options="
		currentBoxtId:'comboboxTotree1',//必传项，即当前盒子的id
		idField:'ticketNameId',
		targetIdField:'win_ticketNameId',
		......各配置型
"></div>