自定义select之模糊查询
来源:互联网 发布:法师雾化器做芯数据 编辑:程序博客网 时间:2024/06/07 12:19
//select 模糊查询function FuzzyQuery() {var _this = this;_this.value = "";}FuzzyQuery.prototype = {constructor : FuzzyQuery,init : function(option) {var _this = this;var options = option || {};//计数_this.amount = 0;//所在容器id_this.id = options.parentId;//接口_this.url = options.apiUrl;//参数_this.dataSetId = options.dataSetId;_this.fieldType = option.fieldType;console.log(_this.fieldType);console.log(option)//标题名称_this.isTitle = options.isTitle?options.isTitle : "";//select的class_this.isClass = options.isClass?options.isClass : "";//select的返回值设置_this.isVal = options.isVal?options.isVal : "";_this.style = options.style?options.style:"";//判断是否返显_this.returnFlag = options.returnFlag?options.returnFlag:false;_this.fn = options.fn;$(_this.id).append(_this.drawSelect());_this.getDataList();_this.event();}, drawSelect : function() { var _this = this;return '<div class="fuzzy-query-body" style="'+_this.style+'">' + _this.isTitle + '<input allattr="isrequired" type="text" class="fuzzy-query" placeholder="请选择..." />\ <div class="fuzzy-query-lists"></div>\ <select type="hidden" class="fuzzy-query ' + _this.isClass + '"></select></div>';}, getDataList : function() {var _this = this;var fieldTypeList = {'0':'str', '1':'integers', '2':'twoDecimalPlaces', '3':'twoDecimalPlaces', '4':'isBlooean', '5':'integers', '6':'stringArr', '7':'twoDecimalPlacesArr'};var getFieldType = '';console.log('_this.isVal: '+_this.isVal);if(sessionStorage.getDrlFieldConLists && !_this.fieldType && _this.fieldType!==0 && $(_this.id).parents('.operations_main.commom__main').length===0 && !$(_this.id).hasClass('dialog_public_body')){var datas = JSON.parse(sessionStorage.getDrlFieldConLists);//console.log(amountforRuleList++);//本类型的字段if(!datas) { $(_this.id).find('select').empty(); $(_this.id).find('.fuzzy-query-lists').html('<span class="empty">查无此项</span>'); return false;}_this.value = datas.map(function(item, index) {return '<option data-fieldTitle="' + item.fieldTitle + '"\ value="' + item.fieldId + '"\ data-dataSetId="' + item.dataSetId + '"\ data-fieldId="' + item.fieldId + '"\ data-fieldName="' + item.fieldName + '"\ data-fieldType="' + item.fieldType + '"\ >' + item.fieldTitle + '</option>';}).join(''); $(_this.id).find("select").html(_this.value); if(!_this.amount && _this.isVal){ $(_this.id).find("select").val(_this.isVal); $(_this.id).find("input").val($(_this.id).find("select").find("option:selected").attr("data-fieldtitle"));}var $_aOpts_ = $(_this.id).find("select").find("option");$(_this.id).find(".fuzzy-query-lists").empty();$_aOpts_.each(function(index, item) {$(_this.id).find(".fuzzy-query-lists").append('<div class="fuzzy-query-lists-chid" title="'+$(item).attr("data-fieldtitle")+'">' + $(item).attr("data-fieldtitle") + '</div>');}); //模糊查询功能$(_this.id).find(".fuzzy-query-lists").find(".fuzzy-query-lists-chid").each(function(index, item) {var _self = this;$(_self).on("click", function(e) {$(_self).parent().animate({"opacity" : 0}, 100, function() {$(_this.id).find("input").val($(_self).html());$(_this.id).find("select")[0].selectedIndex = index; $(_this.id).find("select").trigger("change");$(this).css({"display" : "none"});});e.stopPropagation();return false;});});_this.fn && _this.fn($(_this.id).find("select"));}else{console.log(_this.fieldType)var filedTypeToNumber = 0;var filedTypeJson = {'0':'str', '1':'integers', '2':'twoDecimalPlaces', '3':'twoDecimalPlaces', '4':'isBlooean', '5':'integers', '6':'stringArr', '7':'twoDecimalPlacesArr'};for(var name in filedTypeJson){if(_this.fieldType===filedTypeJson[name]){filedTypeToNumber = name;break;}}console.log(filedTypeToNumber)$.ajax({url : _this.url, type : "POST", data : {dataSetId : _this.dataSetId, fieldTitle : _this.returnFlag?$(_this.id).find("input").val():'',fieldType : _this.returnFlag?filedTypeToNumber:''},async:false,success : function(data) {if(data.success) {var datas = data.data;sessionStorage.getDrlFieldConLists = JSON.stringify(datas);//本类型的字段if(!datas) { $(_this.id).find("select").empty(); $(_this.id).find(".fuzzy-query-lists").html('<span class="empty">查无此项</span>'); return false;}_this.value = datas.map(function(item, index) {return '<option data-fieldTitle="' + item.fieldTitle + '"\ value="' + item.fieldId + '"\ data-dataSetId="' + item.dataSetId + '"\ data-fieldId="' + item.fieldId + '"\ data-fieldName="' + item.fieldName + '"\ data-fieldType="' + item.fieldType + '"\ >' + item.fieldTitle + '</option>';}).join(''); $(_this.id).find("select").html(_this.value); if(!_this.amount && _this.isVal){ $(_this.id).find("select").val(_this.isVal); $(_this.id).find("input").val($(_this.id).find("select").find("option:selected").attr("data-fieldtitle"));}var $_aOpts_ = $(_this.id).find("select").find("option");$(_this.id).find(".fuzzy-query-lists").empty();$_aOpts_.each(function(index, item) {$(_this.id).find(".fuzzy-query-lists").append('<div class="fuzzy-query-lists-chid" title="'+$(item).attr("data-fieldtitle")+'">' + $(item).attr("data-fieldtitle") + '</div>');}); //模糊查询功能$(_this.id).find(".fuzzy-query-lists").find(".fuzzy-query-lists-chid").each(function(index, item) {var _self = this;$(_self).on("click", function(e) {$(_self).parent().animate({"opacity" : 0}, 100, function() {$(_this.id).find("input").val($(_self).html());$(_this.id).find("select")[0].selectedIndex = index; $(_this.id).find("select").trigger("change");$(this).css({"display" : "none"});});e.stopPropagation();return false;});});_this.fn && _this.fn($(_this.id).find("select"));}else{//alert(data.errorMessage);}_this.amount++;}, error : function() {//alert(data.errorMessage);}});}}, event : function() {var _this = this;$(_this.id).find("input.fuzzy-query").on("focus click", function(e) {$(_this.id).find(".fuzzy-query-lists").css({"display" : "block"}).animate({"opacity" : 1},100);e.stopPropagation();return false;});$(_this.id).find("input").on("keyup", function() {$.ajax({url : _this.url, type : "POST", data : {dataSetId : _this.dataSetId, fieldTitle : $(_this.id).find("input").val(),fieldType:_this.returnFlag?_this.fieldType:''},success : function(data) {if(data.success) {var datas = data.data;if(!sessionStorage.ruleData){sessionStorage.ruleData = JSON.stringify(datas);}if(!datas) { $(_this.id).find("select").empty(); $(_this.id).find(".fuzzy-query-lists").html('<span class="empty">查无此项</span>'); return false;}_this.value = datas.map(function(item, index) {return '<option data-fieldTitle="' + item.fieldTitle + '"\ value="' + item.fieldId + '"\ data-dataSetId="' + item.dataSetId + '"\ data-fieldId="' + item.fieldId + '"\ data-fieldName="' + item.fieldName + '"\ data-fieldType="' + item.fieldType + '"\ >' + item.fieldTitle + '</option>';}).join(""); $(_this.id).find("select").html(_this.value); if(!_this.amount && _this.isVal){ $(_this.id).find("select").val(_this.isVal); $(_this.id).find("input").val($(_this.id).find("select").find("option:selected").attr("data-fieldtitle"));}var $_aOpts = $(_this.id).find("select").find("option");$(_this.id).find(".fuzzy-query-lists").empty();$_aOpts.each(function(index, item) {$(_this.id).find(".fuzzy-query-lists").append('<div class="fuzzy-query-lists-chid">' + $(item).attr("data-fieldtitle") + '</div>');}); //模糊查询功能$(_this.id).find(".fuzzy-query-lists").find(".fuzzy-query-lists-chid").each(function(index, item) {var _self = this;$(_self).on("click", function(e) {$(_self).parent().animate({"opacity" : 0}, 100, function() {$(_this.id).find("input").val($(_self).html());$(_this.id).find("select")[0].selectedIndex = index; $(_this.id).find("select").trigger("change");$(this).css({"display" : "none"});});e.stopPropagation();return false;});});_this.fn && _this.fn(_this);}else{//alert(data.errorMessage);}_this.amount++;}, error : function() {//alert(data.errorMessage);}});});}};
自定义select 之 模糊查询
阅读全文
0 0
- 自定义select之模糊查询
- select下拉框之select2模糊查询
- angularJs自定义模糊查询
- select 下拉框 模糊查询
- 自定义select查询结果
- angular自定义过滤器模糊查询
- solr之~模糊查询
- SQL之模糊查询
- java之模糊查询
- mongodb 之 模糊查询
- SQL查询之模糊查询
- js模糊查询 定位select 下拉框
- jQuery 实现 select模糊查询 反射机制
- 带模糊查询的select下拉框
- Select下拉框(支持输入模糊查询)
- select查询 like模糊查询 as别名定义 逻辑运算符
- Android之Sqlite模糊查询
- mongdb 学习之 模糊查询
- Spring MVC原理及配置详解
- Dijkstra最短路算法
- f:loadBundle用法
- 格式化
- 微信JS支付代码 前端调用微信支付接口
- 自定义select之模糊查询
- 决策树学习笔记
- Haproxy搭建MySQL主备和Tomcat负载均衡集群
- jieba分词
- 利用django框架,手把手教你搭建数据可视化系统(一)
- if-elif条件判断,while循环和for…in循环
- 【网络管理者必知】2分钟了解新出台的《网络安全法》
- beautifulsoap 安装失败问题
- 文章标题