깜놀하는 해므찌로

JavaScript Modal 모달창 열기 구현 본문

IT

JavaScript Modal 모달창 열기 구현

agnusdei1207 2022. 7. 4. 16:55
반응형
SMALL
<%-- 모달 열기 --%>                         
function openModal(){   
	fncLoadingStart();        
	$.ajax({             
	    method: "POST",   
	    url: "modal.do",	                                                  
	    data : $("#defaultFrm").serialize(),    
	    dataType: "HTML",          
	    success: function(data) {          
	    	$("#display_view1").html(data);     
	    	view_show(1);           
	    },complete : function(){
	    	fncLoadingEnd();
		}     
	});	
}

1. 모달의 경우 ajax 를 통해 <div> 에 html 을 붙이는 식으로 사용한다.

2. serialize() 함수를 활용하여  <form> 내에 모든 name 키 값을 직렬화 시켜 데이터 통신을 한결 수월하게 만든다.

3. url 의 주소로 요청이 들어가면 해당 Controller 는 html 페이지를 String 타입으로 반환한다.

4. html() 함수를 통해 String 타입을 html 로 읽어 페이지를 붙인다.

반응형
LIST