js 弹出框 importTags控件使用案例

来源:互联网 发布:数据统计流程ppt 编辑:程序博客网 时间:2024/06/05 09:12

js 弹出框 importTags控件使用案例 

(1)html 页面

<div class="row-form">                        <div class="span4">收件人</div>                        <div class="span8 input-append">                            <input type="hidden" name="email_receive" id="email_receive_state" value=""/>                            <input type="text" name="email_real_name" id="email_real_name_state" value="" readonly="readonly"                                   class="validate[]"/>                            <button class="btn" type="button"                                    onclick="pop_custom_dialog(26666,'pop_email_select_value_upt',true)">选择                            </button>                        </div>                    </div>


pop_custom_dialog 弹框选择
(2)弹框js代码

 //*********************************自定义弹出框,选择返回结果**********************************    function pop_custom_select_value(popId, selectId, isMulit, value) {        if (selectId == "pop_email_select_value") {            pop_mailgroup_select_value(popId, selectId, isMulit, value);        }        if (selectId == "pop_email_select_value_upt") {            pop_mailgroup_select_value_upt(popId, selectId, isMulit, value);        }    }

(3)收件人多选值js代码

//*********************************自定义弹出框,选择返回结果(修改)*****************************    var listPayUpt=[];    function pop_mailgroup_select_value_upt(popId,selectId,isMulit,value) {        if(value != "") {            for(var i=0;i<value.length;i++) {                var valJson = jQuery.parseJSON(value[i]);                listPayUpt.push([valJson.email,valJson.real_name]);            }            //去重            var dic = {};            for (var i = listPayUpt.length; i--;)  dic[listPayUpt[i]]=listPayUpt[i];            var r = [];            for (var v in dic)    r.push(dic[v]);            listPayUpt=r;            //排序            //  listPay.sort(function(a,b){return a[0]-b[0]});        }        payStyleUpt();        AutoSetPayNameUpt();    }    var flagtagsUpt =true;    function payStyleUpt(){        if (flagtagsUpt){            $("#email_real_name_state").tagsInput({'width':'100%',                'height':'auto',                'onRemoveTag': function(text){                    for(var i=0;i<listPayUpt.length;i++)                        if(text==listPayUpt[i][1])                            listPayUpt.splice(i,1);                    AutoSetPayNameUpt();                    $("#detailList").slideUp();                },'defaultText':''//默认输入框的文本提示            });            $(".tagsinput").css("min-height","28px");            $("#real_name_tag").remove();            flagtagsUpt = false;        }    }    function AutoSetPayNameUpt(){        var listPname = [];        var listPid=[];        for(var i=0;i<listPayUpt.length;i++){            listPname.push(listPayUpt[i][1]);            listPid.push(listPayUpt[i][0]);        }        $("#email_real_name_state").importTags(listPname.join(","));        if(listPname.length==0){            $("#email_real_name_state").importTags("");        }        $("#email_real_name_state").val(listPname.join(","));        $("#email_receive_state").val(listPid.join(";"));    }
(4)实际页面效果



原创粉丝点击