yctb-SpringBoot/web/js/v1/ui/searchgrid/searchgrid.js

//快速检索下拉列表
(function($){
	
	function createpage(target){
	 var grid  = $.data(target,'searchgrid').grid;	
	 var opts  = $.data(target, 'searchgrid').options;
	 
	 if(!opts.localdb && !opts.remotedb){
	   $('.searchgrid-pages',grid).hide();
		return true; 
	 }
	 
	 var pageCount = Math.ceil(opts.total/opts.pageSize); 
     var pages = $('.searchgrid-pages .searchgrid-pages-inner',grid);	
         pages.html('');
     var table = $('<table style="width:100%;"></table>').appendTo(pages);
     var tr = $('<tr></tr>').appendTo(table);
     $('<td width="10px"></td>').appendTo(tr);
     $('<td width="30px"><a href="javascript:void(0)" icon="FisrtPage" >首页</a></td>').appendTo(tr);
     $('<td width="30px"><a href="javascript:void(0)" icon="PrevPage"  >上页</a></td>').appendTo(tr);
     $('<td width="30px"><a href="javascript:void(0)" icon="NextPage"  >下页</a></td>').appendTo(tr);
     $('<td width="30px"><a href="javascript:void(0)" icon="LastPage"  >尾页</a></td>').appendTo(tr);
     $('<td><span></span></td>').appendTo(tr);
     $('<td width="150px" align="right" ><span icon="PageInfo"></span></td>').appendTo(tr);
  

     
     pages.find('a[icon=FisrtPage]').unbind('.searchgrid').bind('click.searchgrid', function(){
    	 if (opts.pageNumber > 1) selectPage(target, 1);
	 });
     
     pages.find('a[icon=PrevPage]').unbind('.searchgrid').bind('click.searchgrid', function(){
    	  if (opts.pageNumber > 1) selectPage(target, opts.pageNumber - 1);
	 });
     
     pages.find('a[icon=NextPage]').unbind('.searchgrid').bind('click.searchgrid', function(){
    	   var pageCount = Math.ceil(opts.total/opts.pageSize);
			if (opts.pageNumber < pageCount) selectPage(target, opts.pageNumber + 1);
	 });
     
     pages.find('a[icon=LastPage]').unbind('.searchgrid').bind('click.searchgrid', function(){
    		var pageCount = Math.ceil(opts.total/opts.pageSize);
			if (opts.pageNumber < pageCount) selectPage(target, pageCount);
	 });
     
	}
	
   function selectPage(target, pageCount){
	   var opts  = $.data(target, 'searchgrid').options;
	   var input = $.data(target,'searchgrid').input;
	   opts.pageclick =true;
       opts.pageNumber = pageCount; 
      
       if( opts.localdb){
         LoadLocalData(target,input.val(),opts.querySQL); 
       }else{
    	 request(target,input.val());   
       }
   }
 
   function showPageInfo(target){
	   var grid  = $.data(target, 'searchgrid').grid;
	   var pages = $('.searchgrid-pages .searchgrid-pages-inner',grid);	
	   var span =  pages.find('span[icon=PageInfo]');
	   var opts  = $.data(target, 'searchgrid').options; 
		var pageCount = Math.ceil(opts.total/opts.pageSize); 
	   span.html('第 '+opts.pageNumber+'/'+pageCount+' 页 共 '+opts.total+' 行'); 
   }
   
	
	function setSize(target) {
		var grid = $.data(target, 'searchgrid').grid;
		var opts = $.data(target, 'searchgrid').options;
		var box =  $.data(target, 'searchgrid').input;
	 
		var gridWidth = opts.width;
		if (gridWidth == 'auto') {
			/*以表头的宽度作为总体的宽度*/
			gridWidth = grid.find('table').outerWidth()+20; 
		}else{
			gridWidth = parseInt(gridWidth);
		}
		grid.find('div.searchgrid-body').width(gridWidth);
		
		var innerWidth = gridWidth; 
			innerWidth = gridWidth - grid.outerWidth() + grid.width();

		//设置左上角位置（考虑屏幕边界截屏的问题）
		if(box.offset().left+gridWidth>$(window).width()){
			grid.css({
			    left:$(window).width()-gridWidth-3,/*加3预防window出现水平滚动栏*/
			  	top:box.offset().top + 22
			  });
		}else{
			grid.css({
			    left:box.offset().left,
			  	top:box.offset().top + 22
			  });
		}
		$('div.searchgrid-view', grid).width(innerWidth);
   
		if (opts.height == 'auto') {
			$('div.searchgrid-body', grid).height(200);
		} else {
			$('div.searchgrid-body', grid).height(
					opts.height
					- (grid.outerHeight() - grid.height())
					- $('div.searchgrid-header', grid).outerHeight(true)
					- $('div.searchgrid-title', grid).outerHeight(true) 
			);
		}
		var header = $('.searchgrid-view div.searchgrid-header',grid);
		header.width(innerWidth);
	};
	
	/**
	 * wrap and return the grid object, fields and columns
	 */
	function wrapGrid(target, rownumbers) {
		var grid = jQuery('<div class="searchgrid"></div>').appendTo('body');  
		grid.append(
				'<div class="searchgrid-wrap">' +
					'<div class="searchgrid-view">' +
							'<div class="searchgrid-header">' +
								'<div class="searchgrid-header-inner"></div>' +
							'</div>' +
							'<div class="searchgrid-body">' +
							'<table border="0" cellspacing="0" cellpadding="0"></table></div>' +
							'<div class="searchgrid-pages">' +
					          '<div class="searchgrid-pages-inner"></div>' +
					        '</div>' +
					'</div>' + 
				'</div>'
		);
		 
	function getColumns(thead){
			var columns = [];
			$('tr', thead).each(function(){
				var cols = [];
				$('td', this).each(function(){
					var th = $(this);
					var col = {
						title: th.html(),
						align: th.attr('align') || 'left',
						sortable: th.attr('sortable')=='true' || false,
						checkbox: th.attr('checkbox')=='true' || false
					};
					if (th.attr('field')) {
						col.field = th.attr('field');
					}
					if (th.attr('formatter')){
						col.formatter = eval(th.attr('formatter'));
					}
					if (th.attr('rowspan')) col.rowspan = parseInt(th.attr('rowspan'));
					if (th.attr('colspan')) col.colspan = parseInt(th.attr('colspan'));
					if (th.attr('width')) col.width = parseInt(th.attr('width'));
					
					cols.push(col);
				});
				columns.push(cols);
			});
			
			return columns;
		}
		 
 
		return {
			grid: grid,
			frozenColumns: null,
			columns: null
		};
	}
	
	function createColumnHeader(target){
		var opts = $.data(target, 'searchgrid').options;
	    var columns = opts.columns;
		var width   = opts.width;
 
		var t = $('<table border="0" cellspacing="0" cellpadding="0"><thead></thead></table>');
		for(var i=0; i<columns.length; i++) {
			var tr = $('<tr></tr>').appendTo($('thead', t));
			var cols = columns[i];
			for(var j=0; j<cols.length; j++){
				var col = cols[j];
				
				if(typeof col.width=='undefined'){
					 col.width = Math.ceil(col.title.length*15)+10; 
					 opts.columns[i][j].width = col.width; 
				}
				opts.headwidth = opts.headwidth + parseInt(col.width,10);
			 
				var attr = '';
				if (col.rowspan) attr += 'rowspan="' + col.rowspan + '" ';
				if (col.colspan) attr += 'colspan="' + col.colspan + '" ';
				var th = $('<td ' + attr + '></td>').appendTo(tr);
			 
				 if(col.field){
					th.append('<div class="searchgrid-cell"><span class="spancolumn"></span></div>');
					th.attr('field', col.field);
					$('.searchgrid-cell', th).width(col.width);
					$('span', th).html(col.title); 
				} else {
					th.append('<div class="searchgrid-cell-group"></div>');
					$('.searchgrid-cell-group', th).html(col.title);
				}
			}
			
		} 
		return t;
	}
	
	/**
	 * set the common properties
	 */
	function setProperties(target) {
		var grid = $.data(target, 'searchgrid').grid;
		var opts = $.data(target, 'searchgrid').options;
		var data = $.data(target, 'searchgrid').data;
		
		if (opts.striped) {
			$('.searchgrid-view .searchgrid-body tr:odd', grid).addClass('searchgrid-row-alt');
		}
		if (opts.nowrap == false) {
			$('.searchgrid-body .searchgrid-cell', grid).css('white-space', 'normal');
		}
		
		$('.searchgrid-header td:has(.searchgrid-cell)', grid).hover(
			function(){$(this).addClass('searchgrid-header-over');},
			function(){$(this).removeClass('searchgrid-header-over');}
		);
		
		$('.searchgrid-body tr', grid).unbind();
		
		$('.searchgrid-body tr', grid).mouseover(function(){
			var index = $(this).attr('searchgrid-row-index');
			$('.searchgrid-body tr[searchgrid-row-index='+index+']',grid).addClass('searchgrid-row-over');
		}).mouseout(function(){
			var index = $(this).attr('searchgrid-row-index');
			$('.searchgrid-body tr[searchgrid-row-index='+index+']',grid).removeClass('searchgrid-row-over');
		}).click(function(){
	 
			var index;
	       
			$('.searchgrid-view .searchgrid-body tr.searchgrid-row-selected', grid).each(function(){
			   index = parseInt($(this).attr('searchgrid-row-index')); 
			});
			  
			if(index>0||index==0){ 
				unselectRow(target, index);
			}; 
			index = $(this).attr('searchgrid-row-index');
			selectRow(target, index);  
			grid.hide();
			setValues(target);	
				
		}); 
 
		var body = $('.searchgrid-view .searchgrid-body', grid);
		var header = $('.searchgrid-view .searchgrid-header', grid);
		body.scroll(function(){
			header.scrollLeft(body.scrollLeft());
		});
		
		
	}
	 
	function getColumnOption(target, field){
		var opts = $.data(target, 'searchgrid').options;
		if (opts.columns){
			for(var i=0; i<opts.columns.length; i++){
				var cols = opts.columns[i];
				for(var j=0; j<cols.length; j++){
					var col = cols[j];
					if (col.field == field){
						return col;
					}
				}
			}
		}
 
		return null;
	}
	
	/**
	 * get column fields which will be show in row
	 */
	function getColumnFields(columns){
		if (columns.length == 0) return [];
		
		function getFields(ridx,cidx,count){
			var fields = [];
			while(fields.length < count){
				var col = columns[ridx][cidx];
				if (col.colspan && parseInt(col.colspan)>1){
					var ff = getFields(ridx+1, getSubColIndex(ridx,cidx), parseInt(col.colspan));
					fields = fields.concat(ff);
				} else if (col.field){
					fields.push(col.field);
				}
				cidx++;
			}
			
			return fields;
		}
		
		function getSubColIndex(ridx, cidx){
			var index = 0;
			for(var i=0; i<cidx; i++){
				var colspan = parseInt(columns[ridx][i].colspan || '1');
				if (colspan > 1){
					index += colspan;
				}
			}
			return index;
		}
		
		var fields = [];
		for(var i=0; i<columns[0].length; i++){
			var col = columns[0][i];
			if (col.colspan && parseInt(col.colspan)>1){
				var ff = getFields(1, getSubColIndex(0,i), parseInt(col.colspan));
				fields = fields.concat(ff);
			} else if (col.field){
				fields.push(col.field);
			}
		}
		
		return fields;
	}
	
	/**
	 * load data to the grid
	 */
	function loadData(target, data){
		var grid = $.data(target, 'searchgrid').grid;
		var opts = $.data(target, 'searchgrid').options;
		var selectedRows = $.data(target, 'searchgrid').selectedRows;
		var rows = data.rows;
		var headers = data.headers;
	    opts.total = data.total;
		var getWidthDelta = function(){ 
			
			var headerCell = $('.searchgrid-header .searchgrid-cell:first');
			var headerDelta = headerCell.outerWidth() - headerCell.width();
			
			var t = $('.searchgrid-body table', grid);
			t.append($('<tr><td><div class="searchgrid-cell"></div></td></tr>'));
			var bodyCell = $('.searchgrid-cell', t);
			
			var bodyDelta = bodyCell.outerWidth() - bodyCell.width();
			
			return headerDelta - bodyDelta;
		};
		
		var widthDelta = getWidthDelta(); 
		
		function getTBody(fields, rownumbers){
			var tbody = ['<tbody>'];
			for(var i=0; i<rows.length; i++) {
				var row = rows[i];
				
				if (i % 2 && opts.striped){
					tbody.push('<tr searchgrid-row-index="' + i + '" class="searchgrid-row-alt');
				} else {
					tbody.push('<tr searchgrid-row-index="' + i + '" class="');
				}
				tbody.push('">');
				

				for(var j=0; j<fields.length; j++){
					var field = fields[j];
					var col ;
					if(data.headers){
						col = getColumnOption(target, (j+1)+"");
					}else{
						col = getColumnOption(target, field);
					}
					if (col){
						var style = 'width:' + col.width  + 'px;';
						style += 'text-align:' + (col.align || 'left'); 
						tbody.push('<td class="searchgrid-column-' + field + '">'); 
						tbody.push('<div style="' + style + '" ');
					    tbody.push('class="searchgrid-cell '); 
						tbody.push('">');
						var value = row['_DIC_'+field];
						if(value == null){
							value = row[field];
						}
					    if (col.formatter){
							tbody.push(col.formatter(value, row));
						} else {
							tbody.push(value);
						}
						tbody.push('</div>');
						tbody.push('</td>');
					}
				}
				
				tbody.push('</tr>');
			}
			tbody.push('</tbody>');
			return tbody.join('');
		}
		
		$('.searchgrid-body, div.searchgrid-header', grid).scrollLeft(0).scrollTop(0);
		//重写列头field属性
		var fields = getColumnFields(opts.columns);
		var headers = null;
		if(data.headers){
			headers = data.headers.slice(0,fields.length);	
		}else{
			headers = fields;
		}
		$('.searchgrid-view .searchgrid-body table', grid).html(getTBody(headers));
	 
		
		$.data(target, 'searchgrid').data = data;
		setSize(target);
		setProperties(target);
		if(data.rows&&data.rows.length>0){
			//有数据才去选择第一行
			selectRow(target,0);
		}
		
	}
	
	function getSelectedRows(target){
		var opts = $.data(target, 'searchgrid').options;
		var grid = $.data(target, 'searchgrid').grid;
		var data = $.data(target, 'searchgrid').data;
		
		if (opts.idField){
			return $.data(target, 'searchgrid').selectedRows;
		}
		
		var rows = [];
		$('.searchgrid-view .searchgrid-body tr.searchgrid-row-selected', grid).each(function(){
			var index = parseInt($(this).attr('searchgrid-row-index'));
			if (data.rows[index]){
				rows.push(data.rows[index]);
			}
		});
		return rows;
	}
	
	/**
	 * clear all the selection records
	 */
	function clearSelections(target){
		var grid = $.data(target, 'searchgrid').grid;
		
		$('.searchgrid-body tr.searchgrid-row-selected', grid).removeClass('searchgrid-row-selected');
		$('.searchgrid-body .searchgrid-cell-check input[type=checkbox]', grid).attr('checked', false);
		var selectedRows = $.data(target, 'searchgrid').selectedRows;
		while(selectedRows.length > 0){
			selectedRows.pop();
		}
	}
	
	//处理键盘上下左右键
	function inputRow(target,step){
		var grid = $.data(target, 'searchgrid').grid;
		var opts = $.data(target, 'searchgrid').options;
		var index=0;
		var iPre=-1;
		var iNext=-2;
		var iTemp=0; 
		
		$('.searchgrid-view .searchgrid-body tr.searchgrid-row-selected', grid).each(function(){
			  index = parseInt($(this).attr('searchgrid-row-index'),10); 
		});
 
		//获取可见的行
		$('.searchgrid-view .searchgrid-body tr:visible', grid).each(function(){
			iTemp = parseInt($(this).attr('searchgrid-row-index'),10);  
			if(iNext==-1){iNext=iTemp;return false;}
			if(iTemp==index){
				if(step==-1){return false;}
				if(step==1){iNext=-1;}//标记下一条记录在下次循环时调用
			} 
			iPre = iTemp; //上一条记录
		});	
		 
 
	  //若已选的可见行是最后一行那么就不用选
       if(iNext==0||iNext==-1){return true;}
       
       //若已选的可见行是第一行那么就不用选
	   if(iPre==-1){iPre=index;return true;} 
		
		unselectRow(target,index); 
		
		if(step==1){
		  selectRow(target,iNext);
		}else{
		  selectRow(target,iPre);
		}
		 
		MoveScroll(grid);
		//setValues(target);	 
	}
 	
	function MoveScroll(grid){
 
		 var body = $('.searchgrid-view div.searchgrid-body', grid);
		 var item = $('.searchgrid-view .searchgrid-body tr.searchgrid-row-selected', grid); 
		if(item.length==0){
			return ; 
		}
	  	if (item.position().top <= 0){
			var h = body.scrollTop() + item.position().top - item.outerHeight();
			body.scrollTop(h);
		} else if (item.position().top + item.outerHeight() > body.height()){
			var h = body.scrollTop() + item.position().top + item.outerHeight() - body.height();
			body.scrollTop(h);
		}
	  	 
	}
	
	/**
	 * select a row with specified row index which start with 0.
	 */
	function selectRow(target, index){
		var grid = $.data(target, 'searchgrid').grid;
		var opts = $.data(target, 'searchgrid').options;
		var data = $.data(target, 'searchgrid').data;
		var index2; 
	
		$('.searchgrid-view .searchgrid-body tr.searchgrid-row-selected', grid).each(function(){
		  index2 = parseInt($(this).attr('searchgrid-row-index'),10); 
		});
		
		if(index2>=0){ 
			unselectRow(target,index2); 
		}
		
		var selectedRows = $.data(target, 'searchgrid').selectedRows;
		var tr = $('.searchgrid-body tr[searchgrid-row-index='+index+']',grid); 
		tr.addClass('searchgrid-row-selected'); 
		
		if (opts.idField){
			var row = data.rows[index];
			/*这段代码没意义
			for(var i=0; i<selectedRows.length; i++){
				if (selectedRows[i][opts.idField] == row[opts.idField]){
					return;
				}
			}*/
			while(selectedRows.length > 0){
				selectedRows.pop();
			} 
			selectedRows.push(row);
		}
		opts.search = false;
 
	}
	
	
	//查找相应的输入框内的值
	function filter(target, query, callback){ 
		var grid = $.data(target, 'searchgrid').grid;
		var opts = $.data(target, 'searchgrid').options;
	    var bEnter = false;
	        opts.search = false; 
	    
	      
	     $('.searchgrid-body table tr',grid).each(function(){ 
			 $(this).show();  
	     }); 
	    
	 	if(!opts.localdb&&!opts.remotedb){
	 		 
	 		if(query==null||query.length==0){return true;} 
	 		var hasSelected = false;
	 		var visibleRows = $('.searchgrid-body table tr',grid).each(function(){
			 var tr = this;
			 var index = parseInt($(this).attr('searchgrid-row-index'),10);
	  
			 bEnter = false;
			 $(this).show(); 
			 $('div.searchgrid-cell', tr).each(function(){ 
					var item = $(this); 
					//模糊查询，只要输入的字符在项目的任何地方存在就显示
					if (item.text().indexOf(query) !=-1 && query.length!=0){
						 bEnter = true;
						 if(item.text()==query){
							 hasSelected = true;
							 selectRow(target, index);
						 }
					} 
			 });
			 
			 if(bEnter){
				 //$(this).show(); 
			 }else{
				 $(this).hide();
				 unselectRow(target, index);
			 }
			 
		  }).filter(':visible');
			//默认选择第一条记录
			if(!hasSelected&&visibleRows.length>0){	
				selectRow(target, parseInt(visibleRows.eq(0).attr('searchgrid-row-index'),10));
			}
		  MoveScroll(grid); 
	 	}
	 	 
	 	if(query==null||query.length==0){return true;}
		
		if(opts.localdb){ //实现本地客户端文件搜素
			$.data(target, 'searchgrid').selectedRows=[];
			opts.total = 1;
			opts.pageNumber = 1;  
			LoadLocalData(target,query,opts.querySQL); 
		}
		
		//查询生成库数据库
		if(!opts.localdb && opts.remotedb){
			$.data(target, 'searchgrid').selectedRows=[];
			opts.total = 1;
			opts.pageNumber = 1;  
			request(target,query,callback);	
		}
		   //为了避免频繁的查询过滤
	   opts.search = false;
	}
	
	
	function setValues(target, bTriggerOnselect){  
        var grid = $.data(target, 'searchgrid').searchgrid;
		var opts = $.data(target, 'searchgrid').options;
		var rows = $.data(target, 'searchgrid').selectedRows;
	    var input= $.data(target, 'searchgrid').input;
	    //下面三行处理的目的是为了录入框获取焦点时不清除掉页面初始化时的默认值
	    var inText = input.val();
	    var tx = input.attr('tx');
	    var vl = input.attr('vl');
	    
		if(!opts.textFieldOnly){
			target.value='';
		}
	
		for(var i=0; i<rows.length; i++){ 
			var row = rows[i];
			if(row==null){
				return;
			}
			if(!opts.textFieldOnly){
				if(row[opts.idField]!=null && row[opts.idField]!=undefined){
					target.value=row[opts.idField];
				}else{
					target.value='';
				}
			}
			if(row[opts.textField]!=null && row[opts.textField]!=undefined){
				input.val(row[opts.textField]);
			}else{
				input.val('');
			}
			if(opts.onselect && false !== bTriggerOnselect){
				opts.onselect(rows[0]);
			}
		}
		
		//以下处理单击回车键后若没有选择下拉列表的内容而且是默认值的情况
		//就恢复数据库保存字段的值
		if(target.value==''&&vl!=''&&tx==input.val()){
			target.value=vl;
			input.val(tx);	
		}else if(target.value!=''&&input.val()!=''){
			input.attr('vl',target.value);
			input.attr('tx',input.val());
		}
		if(!opts.textFieldOnly){
			 $(target).trigger('blur');
		}
		 
		if(!opts.textFieldOnly){
			 $(target).trigger('change'); 
		}
		
	}
	
	
	/**
	 * select record by idField.
	 */
	function selectRecord(target, idValue){
		var opts = $.data(target, 'searchgrid').options;
		var data = $.data(target, 'searchgrid').data;
		if (opts.idField){
			var index = -1;
			for(var i=0; i<data.rows.length; i++){
				if (data.rows[i][opts.idField] == idValue){
					index = i;
					break;
				}
			}
			if (index >= 0){
				selectRow(target, index);
			}
		}
	}
	
	/**
	 * unselect a row.
	 */
	function unselectRow(target, index){
		var opts = $.data(target, 'searchgrid').options;
		var grid = $.data(target, 'searchgrid').grid;
		var selectedRows = $.data(target, 'searchgrid').selectedRows;
	 
			
		var tr = $('.searchgrid-body tr[searchgrid-row-index='+index+']',grid); 
		tr.removeClass('searchgrid-row-selected');
		if(!opts.textFieldOnly){
			target.value ='';
		}
		var row = $.data(target, 'searchgrid').data.rows[index];
		if (opts.idField){
			for(var i=0; i<selectedRows.length; i++){
				var row1 = selectedRows[i];
				if (row1[opts.idField] == row[opts.idField]){
					for(var j=i+1; j<selectedRows.length; j++){
						selectedRows[j-1] = selectedRows[j];
					}
					selectedRows.pop();
					break;
				}
			}
		}
		
 
	}
	
	//生成提示信息
	function createmsg(target,msg){
		
		var grid = $.data(target, 'searchgrid').grid;
		var wrap = $('div.searchgrid-wrap', grid);
		$('<div class="searchgrid-mask"></div>').css({
			display:'block',
			width: wrap.width(),
			height: wrap.height()
		}).appendTo(wrap);
		$('<div class="searchgrid-mask-msg"></div>')
				.html(msg)
				.appendTo(wrap)
				.css({
					display:'block',
					left:(wrap.width()-$('div.searchgrid-mask-msg:first',grid).outerWidth())/2,
					top:(wrap.height()-$('div.searchgrid-mask-msg:first',grid).outerHeight())/2
				}); 
		
		 var vthis=grid;
		 setTimeout(function(){
			    $('div.searchgrid-mask', vthis).remove();
				$('div.searchgrid-mask-msg', vthis).remove();  
			},3*1000);
		
	}
	
	/**
	 * request remote data
	 */
	function request(target,query,callback){
		var grid = $.data(target, 'searchgrid').grid;
		var opts = $.data(target, 'searchgrid').options;
		var input = $.data(target, 'searchgrid').input;
		var where = opts.whereCls;
		var confid = opts.confid;
		if (!opts.url) return; 
	 
		if(opts.pageclick&&query==''){
			query = opts.query;
			input.val(query);
		}else{
			opts.query = query;
		}
		
		opts.pageclick = false;
		 
		var rowstart = (opts.pageNumber - 1 ) * opts.pageSize + 1;
		var pageSize = opts.pageSize;
		

		var param = $.extend({}, {
			'confid' : confid,
			'rowstart' : rowstart,
			'pageSize' : pageSize,
			'whereCls' : where,
			'pname' : target.name,
			'query' : query
		});
			
		 
		var wrap = $('div.searchgrid-wrap', grid);
		$('<div class="searchgrid-mask"></div>').css({
			display:'block',
			width: wrap.width(),
			height: wrap.height()
		}).appendTo(wrap);
		$('<div class="searchgrid-mask-msg"></div>')
				.html(opts.loadMsg)
				.appendTo(wrap)
				.css({
					display:'block',
					left:(wrap.width()-$('div.searchgrid-mask-msg',grid).outerWidth())/2,
					top:(wrap.height()-$('div.searchgrid-mask-msg',grid).outerHeight())/2
				});
		$.ajax({
			type: opts.method,
			url: opts.url,
			data: param,
			dataType: 'json',
			cache:false,
			success: function(data){
				if(data.Token!=null){
					token=data.Token;//更新全局变量token标志
				}
				if("1"!=data.FHZ){//出错了，弹出错误提醒
					if("CSRF" == data.FHZ){
						showMsg(data.MSG||'',3);
					}
					$('.searchgrid-mask', grid).remove();
					$('.searchgrid-mask-msg', grid).remove();
					return;
       			}
				$('.searchgrid-mask', grid).remove();
				$('.searchgrid-mask-msg', grid).remove();

			    //根据返回的数据设置ID域和文本域
				//有时idField是通过setIdField来设置的
		    	if(opts.idField==null){
		    		opts.idField=data.headers[opts.fieldIndices[0]];
		    	}
		    	if(opts.textField==null){
		    		opts.textField=data.headers[opts.fieldIndices[1]];
		    	} 
				loadData(target, data); 
				showPageInfo(target);
				if($.isFunction(callback)){
					callback(target);
				}
			},
			error: function(){
				$('div.searchgrid-mask', grid).remove();
				$('div.searchgrid-mask-msg', grid).remove(); 
			},
            beforeSend:function(XMLHttpRequest ){
				var cToken = $.cookie("Token") || token;XMLHttpRequest.setRequestHeader('Token',cToken);
			}
		});
	}
	 
	
	//搜索客户端的数据库
	function LoadLocalData(target,query,sql){  
		var opts = $.data(target, 'searchgrid').options;
		var pageNumber = opts.pageNumber;
		var pageSize   = opts.pageSize;
		var startTime = new Date();
		//获取别名
		var t_headers = FWGetDictApplet().getHeaders(opts.confid);
		var headers = [];
		for ( var i = 0; i < t_headers.length; i++) {
			headers[i] = t_headers[i];
		}
		//根据返回的别名数据设置ID域和文本域
	    if(opts.fieldIndices){
	    	if(opts.idField==null){
	    		opts.idField=headers[opts.fieldIndices[0]];
	    	}
	    	if(opts.textField==null){
	    	   opts.textField=headers[opts.fieldIndices[1]];
	    	} 
	    }
		var rowStart = (pageNumber - 1) * pageSize;
		var result = FWGetDictApplet().selectPage(opts.confid, query, rowStart,
				pageSize);
		result = JSON.parse(result);
		var datas = result.pageData||[];
		var rows = [];
		for ( var i = 0; i < datas.length; i++) {
			// 单行转换格式处理
			var arr = datas[i];
			var obj = {};
			// 换成map结构
			for ( var j = 0; j < headers.length; j++) {
				obj[headers[j]] = arr[j];
			}
			rows.push(obj);
		}
	   loadData(target, {
			total : result.total,
			headers:headers,
			rows : rows
	   }); 
	   showPageInfo(target);
  }
	function initInput(target){
		var grid = $.data(target, 'searchgrid').grid;
		var opts = $.data(target, 'searchgrid').options;
		if(!opts.textFieldOnly){
		    var input = $('<input class="searchgrid-text" ></input>').insertAfter(target);	
			 input.attr('vldStr', $(target).attr('vldStr'));
			 input.val($(target).attr('textfield'));
			 //初始化默认值
			 var displayValue = target['displayValue'];
			 if(displayValue){
				 //有值才设置
				 input[0].value = displayValue;
			 }
		}else{
			var input = $(target);
		}
		 if(target.readOnly||target.disabled){
		   disablePrimitiveInput(input[0]);
		 }

		input.bind('mousedown', function(e){
			return false;
		});
		
		input.bind('focus',function(){
		  var opts = $.data(target, 'searchgrid').options;
		  if(!target.readOnly&&!target.disabled&&!opts.disabled){
			  $('div.searchgrid').hide();
				var box = $(input);
				var gridWidth = grid.width(); 
				
				if(gridWidth<40){ 
					$('.searchgrid-view',grid).width(opts.headwidth+25);
					$('.searchgrid-header',grid).width(opts.headwidth+25);
					$('.searchgrid-body',grid).width(opts.headwidth+25); 
					
					gridWidth = grid.width(); 
				}
				//设置左上角位置（考虑屏幕边界截屏的问题）
				if(box.offset().left+gridWidth>$(window).width()){
					grid.css({
					    left:$(window).width()-gridWidth-3,/*加3预防window出现水平滚动栏*/
					  	top:box.offset().top + 22
					  });
				}else{
					grid.css({
					    left:box.offset().left,
					  	top:box.offset().top + 22
					  });
				}
				//有时单击了下拉框后，再单击快速查询框，会导致下框显示列表重叠
				//关闭下拉框
				$('div.fwcombox-panel').hide();
			    grid.show(); 
			    
			    try{
			    	this.select();
			    }catch(e){};
		  }
		});
	  
		input.bind('blur',function(){
			if($(this).attr("readOnly")){
				return true;
			}
			 var msg = FWelementValidate(this);
			 if(msg!=null){
				 FWvalidateTip(this,msg);
			 } else {
				 $(this).qtip("destroy");
			 }
				if(target.value==''){
					this.value="";
				}
		});
		
		input.bind('keydown',function(e){
			switch(e.keyCode){
			case 187:	// 屏蔽=
			case 222:	// 屏蔽'
				return false;
			case 9:
			case 13:
				grid.hide();
				if(input[0].value==''){
					//如果前台什么都没有输入，那么取消默认选中项，否则控件无法清空原来的值。
					$.data(target, 'searchgrid').selectedRows=[];
				}
				setValues(target);
				event.keyCode = 9; //转成TAB键
				return true;
			default:
				return true;
			}
			return true;
		});
		
		input.bind('keyup',function(e){
			
			switch(e.keyCode){
			case 37:	// left
			case 38:	// up
				inputRow(target, -1);
				break;
			case 39:	// right
			case 40:	// down
				inputRow(target, 1);
				break;
			case 9:		//tab
			case 13:	// enter
			case 16:	//shift  不处理这些
				break;
			case 27:	// esc
				grid.hide(); 
				break;
			default:  
				//凡是有输入事件都需要清除隐藏框的代码值 
				if(!opts.textFieldOnly){
					target.value='';  
				}

				clearTimeout(self.searching);
				  if(!opts.search){ //为了避免频繁的查询过滤 
					opts.search = true;
					opts.searching = setTimeout(function(){  
					    filter(target,input.val()); 
					},300); //延迟0.3秒处理
				 }
				  break; 
		   }
			
		   return false;
		
		});
		return input;
	}
	var methods = {
		/**设置或者获取控件是否只读。
		 * 参数flag可不传，不传表示获取控件的只读属性。
		 * @param flag 只读标志，true为设置只读，false为取消只读。
		 * @return 获取只读属性时为true和false，true表示控件只读，false表示控件；
		 * 	设置控件只读属性时返回jquery，当前jquery集合。
		 */
		disabled : function(flag){
			if(arguments.length==0){
				//如果没有入参，那么属于要返回当前是否只读的状态
				if(this.length==0){return null;}
				var opts = $.data(this[0],'searchgrid').options;
				return opts.disabled;
			}else{
				return this.each(function(){
					if(flag){
						//设置为只读
						var opts = $.data(this, 'searchgrid').options;
						var input = $.data(this,'searchgrid').input;
		 				opts.disabled = true;
		 				$(this).removeAttr('disabled'); 
		 				disablePrimitiveInput(input[0]);
		 			}else{
		 				//设置为非只读
						var opts = $.data(this, 'searchgrid').options;
						if(opts.disabled){
							var input = $.data(this,'searchgrid').input;
							enablePrimitiveInput(input[0]);
							opts.disabled = false;
						}
		 			}
	 			});
			}
		},
		/**
		 * 设置控件的显示文本字段
		 * @param text
		 * @returns
		 */
		setTextField:function(text){
			if(this.length==0){return null;}
			if(text.length==0){return null;}
			var opts = $.data(this[0],'searchgrid').options;
			opts.textField = text;
			return true;
		},
		/**
		 * 设置控件的保存字段
		 * @param text
		 * @returns
		 */
	    setIdField:function(value){
			if(this.length==0){return null;}
			if(value.length==0){return null;}
			var opts = $.data(this[0],'searchgrid').options;
			opts.idField = value;
			return true;
		},
		/**
		 * 清空下拉面板的记录
		 */
		clearPanel: function(){
			return this.each(function(){
				var data = $.data(this, 'searchgrid').data;
				//没有输入条件搜索的时候,05q控件的data == null，下拉面板已经为空，无需清空
				if(null != data){
					//清空下拉列表的所有数据
					data.rows = [];
					//清空选中行的数据
					$.data(this, 'searchgrid').selectedRows = [];
					//从HTML上移除面板
					var grid = $.data(this, 'searchgrid').grid;
					grid.find("div.searchgrid-body TBODY").empty();
					grid.find("div.searchgrid-pages span[icon=PageInfo]").empty();				
				}			
			});
		},
		/**
		 * 设置下拉列表的初始值
		 */
		setData:function(value){
				if(this.length==0){return null;}
				if(value.length==0){return null;} 
				filter(this[0], value);
				return true;
		},
		/**
		 * 返回控件是否可见
		 * 返回值：true表示可见，false表示不可见。
		 */
		visible:function(){
			if(this.length==0){return null;}
			var input = $.data(this[0],'searchgrid').input;
			return input.is(":visible");
		},
		/**
		 * 获取或设置集合中第一个元素的查询控件的文本
		 * 获取的方法：
		 * function searchgrid('text') :string
		 * 设置的方法
		 * function searchgrid('text',text) :jquery
		 */
		text : function(text){
			if(arguments.length==0){
				return this.map(function(){
					return $.data(this,'searchgrid').input.val();
				}).get(0);
			}else{
				return this.each(function(){
					$.data(this,'searchgrid').input.val(text);
					$.data(this,'searchgrid').input.attr("tx",text);
					$.data(this,'searchgrid').input.attr("vl",this.value);					
				});
			}
		}, 
		
		/**
		 * 设置字典过滤条件
		 */
		setWhereCls : function (whereCls){
			whereCls = whereCls || "1=2";
			var opts = $.data(this[0],'searchgrid').options;
			opts.whereCls = whereCls;
		},
		
		setTextById : function (id){
			if(null==id || ""==id){
				this[0].value = '';
				$.data(this[0], 'searchgrid').input.val('');
				return ;
			}
			var opts = $.data(this[0],'searchgrid').options;
			var orginWhereCls = opts.whereCls;
			if('STRING' == opts.idFieldType.toUpperCase()){
				opts.whereCls = opts.idField + "='" + id + "'";
			}else if('NUMBER' == opts.idFieldType.toUpperCase()){
				opts.whereCls = opts.idField + "=" + id;
			}else{
				opts.whereCls = opts.idField + "='" + id + "'";
			}
			filter(this[0], '1=1',function(target){
				selectRow(target,0);
				setValues(target,false);//不触发onselect事件
				$.data(target,'searchgrid').options.whereCls = orginWhereCls;
			});
		},
		
		/**
		 * 控件的初始化函数
		 */
		init : function(options){
			
			options = options || {};
			return this.each(function(){
				var state = $.data(this, 'searchgrid');
				var opts;
				if (state) {
					opts = $.extend(state.options, options);
					state.options = opts;
				} else {
					opts = $.extend({}, $.fn.searchgrid.defaults, {
						width:'auto',
						height:'auto',
						fit:false
					}, options);
				  
					var wrapResult = wrapGrid(this, opts.rownumbers);
					if (!opts.columns) opts.columns = wrapResult.columns; 
					$.data(this, 'searchgrid', {
						options: opts,
						grid: wrapResult.grid,
						selectedRows: [],
						input:null
					});
				}
				var  input = initInput(this);
				//创建新的输入框原先生成的隐藏 

				if(!opts.textFieldOnly){
					$(this).removeAttr('vldStr');
					 //将hidden控件的onfocus事件专递到外部可见的input来
					 $(this).focus(function(){input.focus();});
					 //回传外部的blur事件
					 var vthis = $(this);
					 $(this).hide(); 
				}
				

				 $.data(this,'searchgrid').input = input;
				 var textfield = $(this).attr('textfield'); 
			     
				var target = this;
				var grid = $.data(this, 'searchgrid').grid;
	  
				if (opts.columns){
					var t = createColumnHeader(target);
					$('.searchgrid-view div.searchgrid-header-inner', grid).html(t);
				}
				
				setSize(target); 
				createpage(target);
				
				/*if (opts.url) {
					request(target);
				}*/
				
				if(opts.initdata!=null){
					
				    loadData(target, opts.initdata);  
			       
					if(target.value!=null){
						selectRecord(target, target.value);
					} 
				}  
				 
			//	setProperties(target); 
				grid.hide();	
				
				//鼠标点击其他地方就隐藏列表
				$(document).bind('mousedown', function(e){
					$('div.searchgrid').hide();
				}).keydown(function(e){
					//如果不是input控件，那么也隐藏
					if(e.target!=input[0]){
						grid.hide();
					}
				});
				
				//鼠标移动到上面屏蔽掉
				grid.bind('mousedown', function(e){
					return false;
				});
				
			});
		}	
	};
	
$.fn.searchgrid = function(options){ 

	if (methods[options]) {
		return methods[options].apply(this, Array.prototype.slice.call(
				arguments, 1));
	} else if (typeof options == 'object' || !options) {
		return methods.init.apply(this, arguments);
	} else {
		$.error('Method ' + options + ' does not exist on searchgrid');
	}
};
	
	$.fn.searchgrid.defaults = {
		border: true,
		search:false,  //开始搜索数据库时改为true 停止搜索会自动改为false 为避免频繁搜索设置此参数
		localdb:false, //需要检索本地的ACCESS数据库就设置为true
		remotedb:false,//需要检索远程的数据库就设置为true 优先级必localdb低
		width: 'auto',
		height: 'auto',
		columns: null,  //列表框的列名称
		striped: true,  //是否需要显示每行间隔的颜色
		method: 'post',
		nowrap: true,
		confid:null,
		whereCls:null,//远程数据库的查询条件
		idField: null,  //输入框录入的文字对应数据库内的代码
		idFieldType:null,//ID字段的类型，NUMBER,STRING
		textField:null, //代码所对应的显示值
		querySQL:null,  //检索的SQL语句
		initdata:null,    //页面初始化时列表框内的内容
		url: null,      //Aajx 取数时对应的路径
		loadMsg: '正在处理中 ...',
		rownumbers:null,
		fit: false,
		total: 1,
		pageSize: 20,
		pageNumber: 1,
		query:'',
		pageclick:false,
		headwidth:0
	};
	
})(jQuery);