自定义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 之 模糊查询
原创粉丝点击