스프링 게시판 만들기 2

SPRING FRAMEWORK 2020. 6. 1. 16:36

스프링 게시판 만들기 2

저장을 해야 해요. 스크립트를 만들어요. 

function  save_note()
{
	if(check_save())
	{
		return true;
	}
	$("#a_save_btn").prop("disabled", true);
	var url;
	var sql_state_value;
	if($("#i_idx").val()=='')
	{
		url = '/board/save';
		sql_state_value = 'insert';
	}
	else
	{
		url = '/board/save';
		sql_state_value = 'update';
	}	
	
	var postData = {};
    postData["sql_state"] = sql_state_value;
    postData["idx"] = $("#i_idx").val()
    postData["title"] = $("#title").val()
	postData["mdate"] = $("#mdate").val()
	postData["mt_content"] = $('#summernote').summernote('code')
	postData["uuid"] =  $("#i_uuid").val()
	postData["division"] = $("#division").val()
	postData["mt_input_id"] =  $('#login_idx').val()
	postData["mt_update_id"] =  $('#login_idx').val()
	
	if($('#always').is(':checked'))
	{
		postData['always']='Y';
	}
	else
	{
		postData['always']='N';
	}
	var data = JSON.stringify(postData);
	getPostData(url,data,callback_save,false);
}

체크내용스크립트는 별 내용이 없어요. 

function check_save()
{		
	console.log($('#summernote').summernote('code'));
	if($('#summernote').summernote('code')=='<p><br></p>')
	{
		showmessage("알림","내용을 확인해 주세요.",2000,'');
		$("#title").focus();
		return true;
	}
	if($('#summernote').summernote('code')=='')
	{
		showmessage("알림","내용을 확인해 주세요.",2000,'');
		$("#title").focus();
		return true;
	}
	if($("#mdate").val()=='')
	{
		showmessage("알림","작성일 확인해 주세요.",2000,'');
		$("#mdate").focus();
		return true;
	}
	if($("#title").val()=='')
	{
		showmessage("알림","제목을 확인해 주세요.",2000,'');
		$("#title").focus();
		return true;
	}
	if($("#division").val()=='')
	{
		showmessage("알림","커뮤니티 종류 확인해 주세요.",2000,'');
		$("#division").focus();
		return true;
	}
	return false;
}

 

응답후에요. 

var callback_save = function (result)
{
	$('#a_save_btn').removeAttr("disabled");
	if(result['result']=='INSERT_OK')
	{
		showmessage("알림","새글이 등록되었습니다.",5000,'');
		$("#i_idx").val(result['idx']);
		self.location = "/board/board?idx="+$("#i_idx").val();
	}
	else if(result['result']=='UPDATE_OK')
	{	
		showmessage("알림","수정이 되었습니다.",5000,'');
		self.location = "/board/board?idx="+$("#i_idx").val();
	}
	else
	{
		showmessage("알림",result['message'],20000,'');
	}
	
}

/board/save 컨트롤러를 만들어 볼께요. 

@RequestMapping(value = "/save", method = RequestMethod.POST)
	@ResponseBody
	public Map<String, String> regedit(@RequestBody CommonData dto) throws Exception{
		Map<String, String> paramMap = new HashMap<>();
		smsp.print_CommonData(dto);
		String sql_state = dto.get("sql_state");
		String idx = dto.get("idx");
		String uuid = dto.get("uuid");
		if(sql_state.equals("insert"))
		{
			//새글
			service.insert(dto, "Board_Mapper.new_save");
			paramMap.put("result", "INSERT_OK");
			idx = service.selectstr(dto, "Board_Mapper.new_save_idx");
			paramMap.put("idx", idx);
		}
		else if(sql_state.equals("update"))
		{
			//내용수정
			service.update(dto, "Board_Mapper.update");
			paramMap.put("result", "UPDATE_OK");
		}		
		return paramMap;
	}

컨트롤러 부분이었어요.  이제 쿼리부분이에요.

Board_Mapper.xml 파일을 만들어 쿼리는 이렇게 작성했어요. 

<insert id="new_save">		
		insert into tb_board(
					mdate
				  , title
				  , muuid
				  , content
				  , always
				  , division
				  , mt_input_wdate
				  , mt_input_id
				  , mt_update_wdate
				  , mt_update_id
				  )
		   values(  #{mdate}
				  , #{title}
				  , #{uuid}
				  , #{mt_content}
				  , #{always}
				  , #{division}
				  , now()
				  , #{mt_input_id}
				  , now()
				  , #{mt_update_id}
		          )
	</insert>
	<!-- 내용수정 -->
	<update id="update" >
  		update tb_board 
  		   set title = #{title}
  		     , content = #{mt_content} 
  		     , always = #{always}
  		     , mt_update_wdate =  now()
  		     , mt_update_id = #{mt_update_id}
  		 where idx = #{idx}
  	</update>
  	<!-- 새글번호 -->
  	<select id="new_save_idx" resultType="String"> 
		SELECT idx 
		 from tb_board
		where muuid = #{uuid}
	</select>

그리고 글을 저장하고 나면 수정폼이 아닌 일반 페이지에서 보여지면 좋겠어요. 

그래서 일반 페이지도 작성해요. 

<div class="card-body register-card-body">
			      <p class="login-box-msg">글내용</p>
				      <table class="table table-write" id="add_mt">
						<colgroup>			
						<col style="width:120px" />
						<col style="width:*" />						
						</colgroup>
						<tr>						
							<th>작성일</th>
							<td>
								${mdate}
							</td>
						</tr>
						<tr>						
							<th>제목</th>
							<td>${title}</td>
						</tr>
						<tr>
							<th>내용</th>
							<td>
								<div id="summernote">${content}</div>
							</td>
						</tr>
					</table>			      
				<!-- 게시판 구분 -->
			      <input type="hidden" id="division" name="division" value="test1" />
			    <!-- 글번호 --> 
			      <input type="hidden" class="form-control" id="i_idx" value="${idx}">
			    <!-- UUID 부여 -->
			      <input type="hidden" class="form-control" id="i_uuid" value="${uuid}">
			      
			    </div>

일반페이지는 board.jsp로 했어요. 적은 내용이 보여요. 

그리고 글을 적었으면 목록을 봐야겠죠?

목록이에요.

    <div class="card-body register-card-body">
			      <p class="login-box-msg">목록</p>
				      <div style="text-align: right;">
						<c:if test="${issave == 'yes'}">
						<button title="수정" type="button" id="a_edit_btn" class="btn btn-outline-primary" onclick="edit_note();">새글</button>
						</c:if>
  					  </div>
			      	
		      	  <table class="table table-bordered" id="board_list">
		      	  </table>
				<!-- 게시판 구분 -->
			      <input type="hidden" id="division" name="division" value="test1" />
			    </div>
			    <div class="footer_area">
					<div class="text-center">
						<ul class="pagination pagination-sm m-0 float-right" id="item_list_page">
						</ul>
					</div>
				</div>
			      
			    
			    <div style="text-align: right;">
					<c:if test="${issave == 'yes'}">
					<button title="수정" type="button" id="a_edit_btn" class="btn btn-outline-primary" onclick="edit_note();">새글</button>
					</c:if>
				</div>

 페이지를 로드한다음 jquery로 글을 읽어올꺼에요. 

var item_count;
var pageMaker;
$(document).ready(function(){
	item_count=0;
	list_page(1);
});
function list_page(in_data)
{
	var url;
	var sql_state_value = 'select';
	url = "/board/list_get";
	
	var postData = {};
    postData["sql_state"] = sql_state_value;
    if(!ISNULL(pageMaker))
    {
    	postData["page"] = in_data
		postData["perPageNum"] = pageMaker.cri.perPageNum
    }
	postData["title"] = $("#i_title").val()
	postData["division"] = $("#division").val()
	
    var data = JSON.stringify(postData);
    
	getPostData(url,data,callback_list);		
}

이렇게 호출을 해요. 

pageMaker가 선언이 안되어 있으면 페이지 정보는 없이 데이터를 요청해요. 

@RequestMapping(value = "/list_get", method = RequestMethod.POST, consumes="application/json")
	  public @ResponseBody CommonData list_get(@RequestBody CommonData dto) throws Exception {		  
		  CommonData R_data = new CommonData();
		  Iterator keyData = dto.keySet().iterator();
	      while (keyData.hasNext()) {
	          String key = ((String)keyData.next());
	          String value = dto.get(key);
	      }     
	      SearchCriteria cri = new SearchCriteria();     
	      if(dto.get("page")!=null)
	      {
	      	 cri.setPage(Integer.valueOf(dto.get("page"))); 
	      	 dto.put("perPageNum", Integer.valueOf(dto.get("perPageNum")));
	      }
	      else
	      {
	      	 cri.setPage(1);
	      	 dto.put("perPageNum", cri.getPerPageNum());
	      }
	      dto.put("pageStart", cri.getPageStart());     
	      PageMaker pageMaker = new PageMaker();
	      pageMaker.setCri(cri);
	      pageMaker.setTotalCount(service.listSearchCount(dto,"Board_Mapper.Board_select_cnt"));
	      List<Map<String, Object>> list = service.select(dto, "Board_Mapper.Board_select");
	      R_data.put("list", list);
	      R_data.put("pageMaker", pageMaker);
	      R_data.put("result", "SELECT_OK");
	      return R_data;
	  }

데이터를 요청 받았어요. 

그럼 받은 데이터를 화면에 표시해줘요. 

var callback_list = function (result_data)
{
	if(result_data['result']=='SELECT_OK')
	{
		var result = result_data.list;
	   	pageMaker = result_data.pageMaker;
	   	$("#board_list").empty();
	   	var i = $('#board_list').length + 2; //두칸뒤로.
	   	$("#board_list").append('<colgroup>'
   				+'						<col style="width:60px" />'
   				+'						<col style="width:200px" />'
   				+'						<col style="width:*" />'
   				+'						<col style="width:120px" />'
   				+'						</colgroup>					'
   				+'						<tr>'
   				+'							<th>번호</th>'
   				+'							<th>날짜</th>'
   				+'							<th>제목</th>'
   				+'							<th>작성자</th>'
   				+'						</tr>'
   				);
	   	var item_count=1 + (pageMaker.cri.page-1)*pageMaker.cri.perPageNum;
   		var no_num=0; 
   		jQuery.each( result, function( index, value ) {
   			$("#board_list").append('<tr>'
					  +'<td>'+value.idx+'</td>'
					  +'<td class="left">'
					  +value.mdate
					  +'</td>'
					  +'<td class="left">'
					  +'<a class="" href="/board/board?idx='+value.idx+'">'
					  +value.title
					  +'</a>'
					  +'<input type="hidden" class="form-control" id="b_idx'+index+'"' 
					  +' value="'+value.idx+'">'
					  +'</td>'
					  +'<td>'
					  +value.uname
					  +'</td>'
					  +'</tr>'
					  );	
   			item_count++;
			});
   		$("#item_list_page").empty();
   		if(pageMaker.prev)
   		{
   			$("#item_list_page").append('<li  class="page-link"><a href="#" onclick="list_page('+(pageMaker.startPage - 1)+')">&laquo;</a></li>');
   		}
   		for(var f_i=pageMaker.startPage;f_i<=pageMaker.endPage;f_i++)
   		{	
   			
   			if(pageMaker.cri.page == f_i)
   			{	
   				$("#item_list_page").append('<li class="page-link"><a href="#" onclick="list_page('+(f_i)+') ">'+f_i+'</a></li>');
   			}
   			else
   			{
   				$("#item_list_page").append('<li class="page-link"><a href="#" onclick="list_page('+(f_i)+') ">'+f_i+'</a></li>');
   			}
   			
   		}
   		if(pageMaker.next && pageMaker.endPage > 0)
   		{
   			$("#item_list_page").append('<li class="page-link"><a href="#" onclick="list_page('+(pageMaker.endPage + 1)+')">&raquo;</a></li>');
   		}
	}		
}

이렇게 하면 화면에 이렇게 표시되요. 

게시판 목록

오늘은 여기까지 정리 할께요. 

필요한 파일은 여기에 첨부할께요. 

남은 항목은 첨부파일, 게시글 이미지 따로 저장, 댓글 기능등이 남았네요.

오늘은 여기까지 정리할게요. 

jsp파일들이에요. 

board.jsp
0.00MB
list.jsp
0.01MB
write_e.jsp
0.01MB

컨트롤러 파일이에요. 

Board_Controller.java
0.01MB

다음은 맵퍼 파일이에요. 

Board_Mapper.xml
0.00MB

아 그리고 service와 dao를 수정했어요. 몽땅 올릴테니 파일을 변경해주세요. 

commonDAO.java
0.00MB
first_commonDAOImpl.java
0.00MB
second_commonDAOImpl.java
0.00MB

먼저 DAO파일이였구요 다음은 SERVICE파일이에요. 

common_Service.java
0.00MB
Common_ServiceImpl.java
0.01MB
First_ServiceImpl.java
0.00MB
Second_ServiceImpl.java
0.00MB

이상입니다. 

저작자표시

'SPRING FRAMEWORK' 카테고리의 다른 글

카페24 is not allowed to connect to this mariadb server  (0) 2020.09.14
SPRING CONTROLLER 스프링 컨트롤러  (0) 2020.06.22
스프링 게시판 만들기 1  (0) 2020.05.27
spring mvc homepage 스프링 홈페이지 만들기 6  (0) 2020.05.19
spring mvc homepage 스프링 홈페이지 만들기 5  (0) 2020.05.18
블로그 이미지

은호아빠

여행, 맛집, 일상, 프로그래밍, 개발자, 윈도우, 웹, jsp, spring, db, mysql, oracle, c#

,

공지사항

글 보관함

달력

«   2024/05   »
일 월 화 수 목 금 토
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31

티스토리툴바