jquery

Multiselet Change Event

호밀밭의밀수꾼 2024. 12. 13. 14:08
//multiselect option
$("#target").multiselect({
onDropdownShow:function(){
 setMultiselectChange(this)
},
onDropdownHide:function(){
 if(getMultiselectChange(this)){
 //호출할 함수
 }
},
});



_multiselectorChange = [];
function setMultiSelectChange(multiSelector){
 //global
 _multiselectorChange = [];
 try{
  if(!!multiSelector.$select.val()){
   _multiselectChange = [...multiSelector.$select.val()];
   if(_multiselectChange.length == multiSelector.$select[0].lenght){
    _multiselectChange = [];
   }
  }
 } catch(err){
  console.error(err);
 }
}

//multiselect change value check
function getMultiselectChange(multiSelector){
 let tf = false;
 try{
  //multi select check
  if(!!multiSelector.$select.val()){
   let originArr = _multiselectChange;
   let newArr = [..._multiSelector.$select.val()]
   if(newArr.length == multiSelector.$select[0].length){
    newArr = []
   }
   if(originArr.join('')!==newArr('')){
    tf = true;
   }
  }else{
   //filter check
   if(!!multiSelector.query){
    if(_multiselectChange.length > 0 ){
     tf = true;
    }
   }else{
    if(_multiselectChange,length > 0){
     tf = true;
    }
   }
  }
 } catch(err){
  console.error(err);
 }
 return tf;
}

멀티 셀렉트에서 체크박스를 누를때마다 하위 함수가 호출되는걸 방지하고 선택후 셀렉트 창이 사라지면 하위 함수 호출하도록 변경