Cookie cookie = new Cookie("remember", null);

쿠키 객체를 생성할 때 원래 쓰던 쿠키명과 null을 넣는다

cookie.setMaxAge(0);

해당 쿠키의 만료기간을 0초로 설정하여 바로 없어지도록 함

response.addCookie(cookie);

쿠키객체를 add해준다. (해당쿠키는 사라진다)

 

아이디 저장 버튼의 required를 지워주고 div를 주석처리한다.

 

EL표현식을 사용해본다

null일 경우 값은 들어가지 않는다.

 

테스트

아이디 저장을 클릭하지 않고 로그인시 remember가 사라지는 것을 확인 할 수 있다

'Web > Jsp' 카테고리의 다른 글

서블릿 JSP 쿠키 만들기  (0) 2020.06.03
EL 표현식 기초  (0) 2020.06.03
200603 // 블로그 blog 만들기 5 / get, post 받는 방식 / JSTL  (0) 2020.06.03
JSTL 다운로드  (0) 2020.06.03
jusoPopup.jsp 이해  (0) 2020.06.02

get방식은 getParameter로 값을 받을 수 있고 버퍼로 받지 못한다

post방식처럼 body에 값을 넣어서 전달하는 경우
 getParameter로 값을 받을 수 있고 버퍼로도 받을 수 있다

-----------------------------------

JSP에서

자바스크립트에 자바변수를 넣을 수 있으나

자바코드에 자바스크립트 변수를 넣을 수 없다

(순서상)

---------------------------------

https://www.tutorialspoint.com/jsp/jsp_standard_tag_library.htm

 

JSP - Standard Tag Library (JSTL) Tutorial - Tutorialspoint

JSP - Standard Tag Library (JSTL) Tutorial In this chapter, we will understand the different tags in JSP. The JavaServer Pages Standard Tag Library (JSTL) is a collection of useful JSP tags which encapsulates the core functionality common to many JSP appli

www.tutorialspoint.com

 

JSTL 라이브러리를 추가

 

JSTL은 최대한 안쓰는 것이 좋다 (꼭 필요한 것만 쓰자)

JSP페이지에 자바코드를 줄이는 것이 좋다

-JSP코드를 더쓰라는 것이 아니라 html에서 jsp jstl코드를 최소화하고 Action파일에서 처리하도록 한다

 

아래코드를 넣어 주면 JSTL을 사용가능하다

<%@ taglib prefix = "c" uri = "http://java.sun.com/jsp/jstl/core" %>

 

<c: 가 붙으면 톰캣이 해석한다

<c:set> 변수 설정

<c:if> 하나의 조건만 쓸때

<c:choose> <c:when> <c:otherwise> if else 문

<c:forEach> 포이치문

<c:out> 출력

 

JSP조건문을 EL로 바꿔보자

 

리다이렉트도 테스트해보자 (쓸필요는 없음)

 

 

https://offbyone.tistory.com/367

 

JSTL - , 태그 사용법

jstl에서 조건에 따른 분기를 처리할 수 있는 태그로 와 가 있습니다. 1. 태그 test 속성내의 EL 의 결과가 참이면 실행됩니다. else 구문은 없습니다. 위의 코드는 변수 name의 값이 "홍길동" 이면 출력

offbyone.tistory.com

--------------------------------

 

주소는 api를 이용하기 때문에 readonly로

 

'Web > Jsp' 카테고리의 다른 글

EL 표현식 기초  (0) 2020.06.03
서블릿 JSP 쿠키 삭제하는 방법  (0) 2020.06.03
JSTL 다운로드  (0) 2020.06.03
jusoPopup.jsp 이해  (0) 2020.06.02
200602 // blog 블로그 만들기 4  (0) 2020.06.02

 

 

 

 

 

 

 

 

'Web > Jsp' 카테고리의 다른 글

서블릿 JSP 쿠키 삭제하는 방법  (0) 2020.06.03
200603 // 블로그 blog 만들기 5 / get, post 받는 방식 / JSTL  (0) 2020.06.03
jusoPopup.jsp 이해  (0) 2020.06.02
200602 // blog 블로그 만들기 4  (0) 2020.06.02
블로그 만들기 3  (0) 2020.06.01

객체 내의 변수명을 따옴표 없이 // 쌍따옴표 // 홑따옴표로 선언및 초기화 할 수 있다.

 

 

결과

 

 

 

'Web > JavaScript' 카테고리의 다른 글

자바스크립트 최근 함수 선언방식  (0) 2020.06.04
자바스크립트 백틱  (0) 2020.06.04
자바스크립트 람다식 this  (0) 2020.06.02
자바스크립트 객체를 JSON으로 바꾸기  (0) 2020.06.02
jQuery 제이쿼리 시작  (0) 2020.06.02

 

자바에서 람다식을 쓰는 이유는 인터페이스의 타입을 몰라도 되기 때문이다.

 

자바스크립트에서 람다식을 쓰는 이유는

자바스크립트의 람다식 ()=>{} 은 function(){} 과는 다르다.

 

 

 

외부의 함수는 정상적으로 버튼을 가리키지만

inner function을 만들면 이상하게 window를 가리키게 되는데 
진짜 그럴때 버튼을 가리키게 하려면 람다식을 쓴다 ()=>

 

 

 

-------------------------------

 

 

 

'Web > JavaScript' 카테고리의 다른 글

자바스크립트 백틱  (0) 2020.06.04
자바스크립트 객체 프로퍼티(필드, 변수) 작성 따옴표  (0) 2020.06.02
자바스크립트 객체를 JSON으로 바꾸기  (0) 2020.06.02
jQuery 제이쿼리 시작  (0) 2020.06.02
AJAX 통신 개념  (0) 2020.06.02

 

 

-------------


반대로 JSON을 자바스크립트 객체로 바꾸려면 

JSON.parse를 쓰자

'Web > JavaScript' 카테고리의 다른 글

자바스크립트 객체 프로퍼티(필드, 변수) 작성 따옴표  (0) 2020.06.02
자바스크립트 람다식 this  (0) 2020.06.02
jQuery 제이쿼리 시작  (0) 2020.06.02
AJAX 통신 개념  (0) 2020.06.02
자바스크립트 history 객체 활용 미완성  (0) 2020.03.13

유용한 함수와 기능들을 만들지 않아도 라이브러리에서 제공해준다

https://www.w3schools.com/jquery/jquery_hide_show.asp

 

jQuery Effects - Hide and Show

jQuery Effects - Hide and Show Hide, Show, Toggle, Slide, Fade, and Animate. WOW! Click to show/hide panel Because time is valuable, we deliver quick and easy learning. At W3Schools, you can study everything you need to learn, in an accessible and handy fo

www.w3schools.com

 

 

 

 

<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>

	<div id="reply-1">첫번째 댓글 입니다.</div>

	<input type="text" id="tf-reply"/>
	<button onclick="start()">댓글쓰기</button>

	<script>
		function start() {
			var a = $('#tf-reply').val();
            $('#reply-1').prepend("<div id='reply-2'>" + a + "</div>");
			// alert(a);
		}
	</script>

</body>
</html>

 

 

<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>

	<div id="reply-1">첫번째 댓글 입니다.</div>

	<input type="text" id="tf-reply"/>
	<button onclick="start()">댓글쓰기</button>

	<script>
		function start() {
			var a = $('#tf-reply').val();
            $('#reply-1').before("<div id='reply-2'>" + a + "</div>");
			// alert(a);
		}
	</script>

</body>
</html>

 

 

 

맨위의 댓글 찾기

 

 

id 번호 늘리기

<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script
	src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<style>
div {
	border: 1px solid black;
	margin: 5px;
	padding: 5px;
}
</style>
</head>
<body>

	<div id="reply-box">
		<div id="reply-1" class="re">첫번째 댓글 입니다.</div>
	</div>

	<input type="text" id="tf-reply" />
	<button onclick="start()">댓글쓰기</button>

	<script>
		var num = 1; // 이 값은 원래 db에서 가져와야됨
		function start() {
			var a = $('#tf-reply').val();
			num++;
			$('#reply-box').prepend("<div id='reply-" + num + "'>" + a + "</div>");
		}
	</script>

</body>
</html>

 

 

 

 

'Web > JavaScript' 카테고리의 다른 글

자바스크립트 람다식 this  (0) 2020.06.02
자바스크립트 객체를 JSON으로 바꾸기  (0) 2020.06.02
AJAX 통신 개념  (0) 2020.06.02
자바스크립트 history 객체 활용 미완성  (0) 2020.03.13
자바스크립트 window.location으로 select 웹사이트 이동  (0) 2020.03.13

자바스크립트의 기술

HTML 파일 화면의 일부분만 새로 받아와서 변경하고 싶은 경우 사용한다 (화면을 새로고침 하지 않는다)

request -> response 시 새로고침 하지 않음

백그라운드에서 데이터를 주고 받을 수 있음

 

제이쿼리 엑시오스 

 

w3school에서 연습

https://www.w3schools.com/js/js_ajax_intro.asp

 

AJAX Introduction

AJAX Introduction AJAX is a developer's dream, because you can: Read data from a web server - after the page has loaded Update a web page without reloading the page Send data to a web server - in the background AJAX Example Explained HTML Page

www.w3schools.com

 

.then

 

fetch + async + await

리턴값.text()

리턴값.json()

https://joshua1988.github.io/web-development/javascript/js-async-await/

 

자바스크립트 async와 await

(중급) 자바스크립트 개발자를 위한 async, await 사용법 설명. 쉽게 알아보는 자바스크립트 async await 개념, 사용법, 예제 코드, 예외 처리 방법

joshua1988.github.io

 

 

 

 

<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script
	src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<style>
div {
	border: 1px solid black;
	margin: 5px;
	padding: 5px;
}
</style>
</head>
<body>

	<div id="reply-box">
		<div id="reply-1" class="re">첫번째 댓글 입니다.</div>
	</div>

	<input type="text" id="tf-reply" />
	<button onclick="start()">댓글쓰기</button>

	<script>
		var num = 1; // 이 값은 원래 db에서 가져와야됨
		function start() {
			num++;
			var a = $('#tf-reply').val();

			// 통신이 성공하면 아래 로직 실행

			$.ajax(
			// ajax 비동기 백그라운드로 다른페이지에 request를 하고 response를 받으면 result에 데이터를 저장한다. 
			// 보낼타입은 json 상대방에게 받을 타입도 json이다. 아래에서 확인

			{ // 오브젝트
				type : 'post',
				url : 'AjaxResponseTest.jsp',
				data : '{"username":"ssar", "password":"1234"}',
				contentType : 'application/json; charset=utf-8',
				dataType : 'json' // 받을데이터를 어떻게 파싱할까 text / json
			}

			).done(
					function(result) { // 통신이 성공
						console.log(result);
						$('#reply-box').prepend(
								"<div id='reply-" + num + "'>" + a + "</div>");
					}).fail(function(error) { // 통신이 실패
				console.log(error);
			});

		}
	</script>

</body>
</html>

 

<%@page import="com.google.gson.Gson"%>
<%@page import="com.cos.blog.dto.ResponseDto"%>
<%@page import="java.io.BufferedReader"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<% 

	BufferedReader br = request.getReader();
	
	String input = null;
	StringBuilder sb = new StringBuilder();
	while((input = br.readLine()) != null ){
		sb.append(input);
	}
	
	System.out.println("받은데이터 시작---");
	System.out.println(sb.toString());
	System.out.println("받은데이터 끝---");
	
	ResponseDto<String> dto = new ResponseDto<>();
	dto.setStatus(200);
	dto.setData("성공");
	
	Gson gson = new Gson();
	String returnStr = gson.toJson(dto);
	System.out.println(returnStr);
	
	out.println(returnStr); // JSON을 리턴
	
%>

 

 

 

 

 

'Web > JavaScript' 카테고리의 다른 글

자바스크립트 객체를 JSON으로 바꾸기  (0) 2020.06.02
jQuery 제이쿼리 시작  (0) 2020.06.02
자바스크립트 history 객체 활용 미완성  (0) 2020.03.13
자바스크립트 window.location으로 select 웹사이트 이동  (0) 2020.03.13
자바스크립트 웹 페이지 프린트  (0) 2020.03.13

+ Recent posts

티스토리툴바