본문 바로가기

SW Dev Portfolio

JAVA-Spring : Javascript +JQuery 메일 [보내는 사람] 전체 목록 삭제하기

반응형

https://cofs.tistory.com/270

 

javascript 중복 submit 방지 / 다중 클릭 방지 / 중복 클릭 방지

javascript 중복 submit 방지 / 다중 클릭 방지 / 중복 클릭 방지 웹 페이지에서 form submit 이벤트나 버튼의 클릭 등 이벤트가 여러번 발생하면 곤란할 때가 있다. 예를 들어 글을 등록할 때 등록버튼

cofs.tistory.com

참고하였습니다.

 var TodoubleSubmitFlag = 0;
    function TodoubleSubmitCheck(){

        if(TodoubleSubmitFlag == 1 ){
            return TodoubleSubmitFlag;
        }
else if(TodoubleSubmitFlag=0)
{
            TodoubleSubmitFlag = 1;
            return false;
        }

    }


var gubnData = '';
$('#btnSendtoAll').click(function() {
if (TodoubleSubmitCheck()) return;

gubnData='T'; //to , cc 구분 값
getAllJYsoftEmployee(gubnData)

});

 



TodoubleSubmitFlag =0 > return : false > 넘어감 > getAllJYsoftEmployee작동

TodoubleSubmitFlag =1 > return : true > 못넘어감 > 계속 return 


 -> 한번 더 클릭하면 경고문 띄우고 모두 취소 -> 이걸 만들고 싶었다
-> 엑스 표시 누르면 삭제 되는 코드 참고 ! -> JQuery로 되어 있었음

$('.tableType1 tr td:eq(0) div').on('click', 'div', function(){
			
var btnIndex = $(this).closest('div').index();
alert("삭제하시겠습니까"+btnIndex)
			
$('.tableType1 tr td:eq(0) div div:eq('+btnIndex+')').remove();});
반응형
 //1번째 클릭 ->ToClickFlag =0; -> return :false -> 함수 실행 -> ToClickFlag =1;
//2번째 클릭 ->ToClickFlag =1; -> return :true  -> for문 : JQurey 실행 ->ToClickFlag =0;

var ToClickFlag = 0;
		    
            
function TodoubleSubmitCheck(){
    
if(ToClickFlag ==1){
    alert("전체 삭제하시겠습니까")
    for ( var i = 0; i <21; i++) {
           var j = 0;
           
  //$(받는사람 목록).삭제();        
  $('.tableType1 tr td:eq(0) div div:eq('+j+')').remove();}
            
  ToClickFlag =0;
  return true;
 }
  else if(ToClickFlag==0){
                        
           ToClickFlag = 1;
           return false;
      }
     }

참고하여 변형해서 사용

개발한 부분에서 두버튼이 함수 하나를 사용하여 버튼 클릭 이벤트 오류 있음 !!

flag 값 을 두개로 나눔 

var toClickFlag = 0; 
var ccClickFlag = 0; 

 var num =50;
 var gubnData = '';

$('#btnSendtoAll').click(function() {
$(this).css('background', 'red')

gubnData ='T'; //to , cc 구분 값

if (ToOrCcdoubleClickCheck(num ,gubnData)== true){ 
    $(this).css('background', '')
    return;}

getAllJYsoftEmployee(gubnData)

});

// 참조 : 직원 호출
$('#btnSendccAll').click(function() {
$(this).css('background', 'red')
gubnData = 'C';

if (ToOrCcdoubleClickCheck(num ,gubnData)== true) {
    $(this).css('background', '')
    return;}


getAllJYsoftEmployee(gubnData)

});
function ToOrCcdoubleClickCheck(num ,gubnData){

if(toClickFlag ==1 && gubnData=='T'){
        // 삭제 코드 
    alert("받는 사람 전체 삭제하시겠습니까" )
    for ( var i = 0; i <num; i++) {
        var j =0;
        $('.tableType1 tr td:eq(0) div div:eq('+j+')').remove();
                //$ (받는사람 목록).삭제();
    }
    toClickFlag =0;
    return true;
}

if(ccClickFlag ==1 && gubnData =='C') {
    alert("참조 전체 삭제하시겠습니까" )
    for ( var i = 0; i <num; i++) {
        var j =0;
        $('.tableType1 tr td:eq(1) div div:eq('+j+')').remove();
                //$ (참조 목록).삭제();
        }
    ccClickFlag =0;
    return true;
}

if(toClickFlag==0 && gubnData=='T'){

    toClickFlag = 1;
    return false;

    }
if(ccClickFlag==0 && gubnData =='C'){

    ccClickFlag = 1;
    return false;

    }
}

반복 되는 부분이 있어서 리팩토링이 필요한데 일단은 ,,,, 기능적인 오류부터 잡고 추후에 ,, 웹개발 너무 힘들다

반응형