기록장

스프링부트 게시판 만들기 (5) - 글 목록에 링크 추가 본문

인턴 기록/게시판?블로그?만들기

스프링부트 게시판 만들기 (5) - 글 목록에 링크 추가

210_yy 2021. 4. 26. 15:37

board페이지를 들어가면 db에서 글 목록들을 불러오는데 그중에서도 제목을 누르면 그 글의 내용이 보이도록 링크를 추가하는 작업을 할 것이다.

 

 

(2)번 글에서 작성했던 

이 함수를 실행시켰을 때의 결과는

 

 

 

다음 그림과 같았다. 근데 글 제목을 클릭했을 때 해당 글의 내용을 보여주어야 하기 때문에 링크를 추가해보도록 하겠다.

 

그러기 위해선 getBoardList함수의 내용을 수정해야한다 

 

function getBoardList() {
	$.ajax({
		type: 'GET',
		url: '/getBoardList',
		success: function(result) {
			//들고오면 테이블에 뿌리기 
			//페이징 처리는 다음에 .. 

			if(result.length>1){
				result.forEach(function(item){
					str='<tr>'
					str += "<td>"+item.idx+"</td>";
					str+="<td>"+item.writer+"</td>";
					str+="<td><a href = 'view?idx=" + item.idx + "'>" + item.title + "</a></td>";
					str+="<td>"+item.date+"</td>";
					str+="<td>"+item.hit+"</td>";
					str+="</tr>"
					$('#boardtable').append(str);

        		})
				
			}
		}
		,
		error: function(result) {
		},
		complete: function() {
		}

	})
}

 

(for문을 foreach문으로 바꿨는데 이건 딱히 상관없다 !!)

변경된 부분은 title을 <td>에 넣고 str에 추가하는 것이었는데 거기에 <a href>태그를 넣어준 것밖에 없다.

 

주소는 idx를 보냈을 때 해당 idx를 가진 글의 content를 보여주기 위해 idx 번호를 추가하였다.

 

 

 

 

그림을 보면 제목 부분에 링크가 추가된 것을 확인할 수 있다 !!

 

다음에는 저 제목을 클릭했을 때 알맞게 mapping되도록 해보겠다

반응형
Comments