jeestie框架中下拉框select2的用法
阿新 • • 發佈:2018-11-24
使用select2方法是為了使下拉框帶有搜尋選項,方便使用者選擇。使用前就是普通的下拉框,如果下拉的選項很多,你找起來會很費勁,使用select2就可以快速選擇到你想要選擇的選項了。下面將介紹幾個常用的知識。
第一,如何給定普通的下拉框select2許可權
1.jeesite框架中普通的下拉框賦select2許可權:
$("select").select2();
2.常規的頁面賦select2許可權的時候需要引入一些包,這個需要注意一下!
<!-- 下拉框樣式 --> <link type="text/css" rel="stylesheet" href="../css/select2.css" /> <link type="text/css" rel="stylesheet" href="../js/tree-multiselect/jquery.tree-multiselect.css" /> <!-- 下拉框js --> <script src="../js/select2/select2.min.js"></script> <script src="../js/tree-multiselect/jquery.tree-multiselect.js"></script> <script type="text/javascript"> $ (function(){ $ ("#select").select2 ();//要賦值的select的id }); </script>
第二,select2的取值和賦值
$("#id").select2("val","");//賦值
$("#id").select2("val");//取值
第三,jeesit子表中如何給定select2許可權以及下拉框事件選中值後,隱藏掉必填項資訊,沒選中顯示必填項資訊的方法
function addRow(list, idx, tpl, row){ $(list).append(Mustache.render(tpl, { idx: idx, delBtn: true, row: row })); $(list+idx).find("select").each(function(){ $(this).val($(this).attr("data-value")); $(this).select2();//給下拉框給定下拉搜尋許可權 var selectId="#"+$(this).attr("id");//select 的id selectChFc(selectId);//下拉框選中後移除必填項提示 }); $(list+idx).find("input[type='checkbox'], input[type='radio']").each(function(){ var ss = $(this).attr("data-value").split(','); for (var i=0; i<ss.length; i++){ if($(this).val() == ss[i]){ $(this).attr("checked","checked"); } } }); } }
jeesite.js中新增公共的js方法
//下拉框事件選中值後,隱藏掉必填項資訊,沒選中顯示必填項資訊 start function selectFc(){ $("#inputForm").find("select").each(function(){ $(this).bind("change",function(){ var temp=$(this).val(); var fortemp=$(this).attr("name"); if(temp!="" && temp!=null && temp!="undefined"){ $("label[for='"+fortemp+"']").hide(); }else{ $("label[for='"+fortemp+"']").show(); } }) }) } //子表裡邊的下拉框處理 function selectChFc(obj){ $(obj).parent().find("select").bind("change",function(){ var temp=$(this).val(); var fortemp=$(this).attr("id"); if(temp!="" && temp!=null && temp!="undefined"){ $("label[for='"+fortemp+"']").hide(); }else{ $("label[for='"+fortemp+"']").show(); } }) } //下拉框事件選中值後,隱藏掉必填項資訊,沒選中顯示必填項資訊 end