jquery-rockselect.js 6.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199
  1. /**
  2. edittable 单击选择插件
  3. caratename:chenxihu
  4. caratetime:214-04-06 21:40:00
  5. email:qqqq2900@126.com
  6. homepage:www.xh829.com
  7. */
  8. (function ($) {
  9. rockselectdata = {};
  10. function rockselect(cans){
  11. var me = this;
  12. var defv = js.applyIf(cans,{
  13. rand:js.getrand(),
  14. limit:10,
  15. maxheight:400,
  16. num:''
  17. });
  18. for(var i in defv)this[i] = defv[i];
  19. this.init = function(){
  20. if(!this.num)this.num = this.rand;
  21. if(!rockselectdata[this.num])rockselectdata[this.num] = {};
  22. this.showView();
  23. if(rockselectdata[this.num].alldata){
  24. this.loaddatashow(rockselectdata[this.num].alldata);
  25. }else{
  26. this.loaddata();
  27. }
  28. rockselectdata[this.num] = this;
  29. }
  30. this.clickstr = function(act,val){
  31. return 'rockselectdata.'+this.num+'.'+act+'('+val+')';
  32. }
  33. this.showView = function(){
  34. this.hide();
  35. var o2 = $(this.viewobj);
  36. var lefta =o2.offset();
  37. this.top = lefta.top+o2.height();
  38. var s = '<div id="rockselectdiv" class="box" style="position:absolute;z-index:999;left:'+lefta.left+'px;top:'+this.top+'px;background:white;border:1px var(--main-color) solid;border-radius:5px;"><div style="background:var(--main-bgcolor);border-radius:5px">';
  39. s+='<div style="display:flex;border-bottom:var(--border)"><select style="width:100px;border:none;background:none;display:none" id="rockselect_select"><option value="">-选择-</option></select><input type="input" style="background:none;border:none;border-radius:0;;flex:1" placeholder="输入关键词搜索" onkeydown="'+this.clickstr('keydown','this')+'" class="input"></div>';
  40. s+='<div id="rockselectdivs" style="max-height:'+this.maxheight+'px;overflow:auto"><div style="padding:50px;" align="center">'+js.ling(30)+'</div></div>';
  41. s+='</div></div>';
  42. $('body').append(s);
  43. }
  44. this.loaddata = function(key){
  45. if(!key)key='';
  46. $.ajax({
  47. type:'get',data:{key:jm.base64encode(key)},
  48. url:this.url,dataType:'json',
  49. success:function(ret){
  50. me.loaddatashow(ret);
  51. },
  52. error:function(){
  53. $('#rockselectdivs').html('加载错误');
  54. }
  55. });
  56. }
  57. this.loaddatashow=function(ret){
  58. this.alldata = ret;
  59. var rows = ret;
  60. if(ret.rows)rows = ret.rows;
  61. if(ret.data)rows = ret.data;
  62. if(this.ondatachuli)rows = this.ondatachuli(rows, ret);
  63. this.yuandata = rows;
  64. this.firstdata(rows);
  65. }
  66. this.pageload=function(zl,p){
  67. $('#rockselectdivpage').remove();
  68. var ds = this.autodata;
  69. var str='',i,len=ds.length,j=0,sty,d,cls,str1='';
  70. for(i=(p-1)*zl;i<len;i++){
  71. d = ds[i];sty= '';cls='list-itemv';
  72. if(d.style)sty+=''+d.style+';';
  73. if(d.padding)sty+='padding-left:'+d.padding+'px;';
  74. if(d.disabled)cls='';
  75. str+='<div class="'+cls+'"';
  76. if(!d.disabled)str+=' onclick="'+this.clickstr('itemclick',''+i+'')+'"';
  77. str+= ' style="padding:7px 10px;'+sty+'">'+d.name+'';
  78. if(d.subname)str+='&nbsp;<span style="font-size:12px">('+d.subname+')</span>';
  79. str+='</div>';
  80. j++;
  81. if(j>=zl)break;
  82. }
  83. if(len>zl){
  84. str1='<div id="rockselectdivpage" style="padding:8px 10px;background:rgba(0,0,0,0.1)">总记录'+len+'条('+Math.ceil(len/zl)+'/'+p+')';
  85. if(p>1)str1+='&nbsp;<span class="zhu cursor" onclick="'+this.clickstr('pageload',''+zl+','+(p-1)+'')+'">&lt;上页</span>';
  86. if(j==zl && ds[p*zl])str1+='&nbsp;<span class="zhu cursor" onclick="'+this.clickstr('pageload',''+zl+','+(p+1)+'')+'">下页&gt;</span>';
  87. str1+='</div>';
  88. }
  89. if(!str)str='<div align="center" style="padding:30px">无记录</div>';
  90. setTimeout(function(){
  91. $('#rockselectdivs').html(str).after(str1);
  92. if(p==1)me.setweizhi();
  93. },10);
  94. }
  95. //点击
  96. this.itemclick = function(i){
  97. var d = this.autodata[i];
  98. if(d.disabled)return;
  99. var nav = d.name;
  100. if(this.nameobj)this.nameobj.value = nav;
  101. var val = d.value;
  102. if(typeof(val)=='undefined')val = d.id;
  103. if(typeof(val)=='undefined')val = d.name;
  104. if(this.idobj)this.idobj.value = val;
  105. if(this.onitemclick)this.onitemclick(nav,val,d);
  106. this.hide();
  107. }
  108. this.keydown = function(o1){
  109. if(!this.yuandata)return;
  110. clearTimeout(this.autoctime);
  111. this.autoctime = setTimeout(function(){me.sousouval(o1);},10);
  112. }
  113. this.sousouval = function(o1){
  114. var ds=[],val= strreplace(o1.value);
  115. var da = this.yuandata,len=da.length,j=0,zl=this.limit;
  116. if(val){
  117. for(i=0;i<len;i++)if(da[i].name.indexOf(val)>-1 || (da[i].subname && da[i].subname.indexOf(val)>-1)){
  118. ds.push(da[i]);j++;if(j>=zl*3)break;
  119. }
  120. }else{
  121. ds=da;
  122. }
  123. this.firstdata(ds);
  124. this.nowinpvle= val;
  125. }
  126. this.firstdata = function(ds){
  127. this.autodata = ds;
  128. this.pageload(this.limit,1);
  129. }
  130. this.hide = function(){
  131. $('#rockselectdiv').remove();
  132. }
  133. //设置位置
  134. this.setweizhi = function(){
  135. var obj = $('#rockselectdiv');
  136. var hei = obj.height() + this.top;
  137. var khe = winHb() + $(document).scrollTop();
  138. var dhe = hei - khe,min=200;
  139. if(dhe > 0){
  140. var o2 = $('#rockselectdivs');
  141. var nhei= o2.height()-dhe-5;
  142. if(nhei < min){
  143. var ntop = this.top - (min-nhei);
  144. if(ntop < 0){
  145. min = min + ntop - 5;
  146. ntop = 5;
  147. }
  148. obj.css('top',''+ntop+'px');
  149. nhei = min;
  150. }
  151. o2.css('height',''+nhei+'px');
  152. }
  153. }
  154. this.setSelectData = function(dt,na, fid){
  155. if(!dt || dt.length==0)return;
  156. var o = get('rockselect_select');
  157. o.length = 0;
  158. $(o).show();
  159. dt.unshift({value:'',name:na});
  160. js.setselectdata(o, dt, 'value');
  161. $(o).change(function(){
  162. me.changeselect(this, fid);
  163. });
  164. }
  165. this.changeselect = function(o, fid){
  166. var val = o.value;
  167. var da = this.yuandata,len=da.length,ds=[],i;
  168. if(val){
  169. for(i=0;i<len;i++)if(val==da[i][fid])ds.push(da[i]);
  170. }else{
  171. ds=da;
  172. }
  173. this.firstdata(ds);
  174. }
  175. }
  176. js.addbody('rockselectdiv', 'remove','rockselectdiv');
  177. $.rockselect = function(cans){
  178. var funcls = new rockselect(cans);
  179. setTimeout(function(){funcls.init()},5);
  180. return funcls;
  181. };
  182. })(jQuery);
粤ICP备19079148号