맛집목록 만들기

sql>tbl_local 테이블생성

create table tbl_local(
	id varchar(10) primary key,
    pname varchar(200) not null,
    phone varchar(30),
    address varchar(500),
    wdate datetime default now()
);

LocalVO 생성

package com.example.domain;

import java.util.Date;

public class LocalVO {
	
	private String id;
	private String pname;
	private String address;
	private Date wdate;
	private String phone;
	
	public String getId() {
		return id;
	}
	public void setId(String id) {
		this.id = id;
	}
	public String getPname() {
		return pname;
	}
	public void setPname(String pname) {
		this.pname = pname;
	}
	public String getAddress() {
		return address;
	}
	public void setAddress(String address) {
		this.address = address;
	}
	public Date getWdate() {
		return wdate;
	}
	public void setWdate(Date wdate) {
		this.wdate = wdate;
	}
	public String getPhone() {
		return phone;
	}
	public void setPhone(String phone) {
		this.phone = phone;
	}
	
	@Override
	public String toString() {
		return "LocalVO [id=" + id + ", pname=" + pname + ", address=" + address + ", wdate=" + wdate + ", phone="
				+ phone + "]";
	}
	
}

LocalDAO 생성

package com.example.persistence;

import java.util.List;

import com.example.domain.LocalVO;
import com.example.domain.SearchCriteria;

public interface LocalDAO {
	public void insert(LocalVO vo);
	public List<LocalVO> list(SearchCriteria cri);
	public int total(SearchCriteria cri);
	
	public void delete(String id);
	
	public void update(LocalVO vo);
}

LocalMapper생성

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper
    PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper  namespace="LocalMapper">
	<insert id="insert">
		insert into tbl_local(id,pname,address,phone)
		values(#{id},#{pname},#{address},#{phone})
	</insert>
	<select id="list" resultType="com.example.domain.LocalVO">
		select * from tbl_local
		<if test="searchType=='pname'">
			where pname like concat('%',#{keyword},'%')
		</if>
		<if test="searchType=='address'">
			where address like concat('%',#{address},'%')
		</if>
		order by wdate desc
		limit #{pageStart},#{perPageNum}
	</select>
	<select id="total" resultType="int">
		select count(*) from tbl_local
	</select>
	<delete id="delete">
		delete from tbl_local where id=#{id}
	</delete>
	
	<update id="update">
		update tbl_local set phone=#{phone}
		where id=#{id}
	</update>
</mapper>

LocalDAOImpl 생성

package com.example.persistence;

import java.util.List;

import javax.inject.Inject;

import org.apache.ibatis.session.SqlSession;
import org.springframework.stereotype.Repository;

import com.example.domain.LocalVO;
import com.example.domain.SearchCriteria;

@Repository
public class LocalDAOImpl implements LocalDAO{
	@Inject
	SqlSession session;
	private String namespace="LocalMapper";
	
	@Override
	public void insert(LocalVO vo) {
		// TODO Auto-generated method stub
		session.insert(namespace +".insert",vo);
	}

	@Override
	public List<LocalVO> list(SearchCriteria cri) {
		// TODO Auto-generated method stub
		return session.selectList(namespace+".list",cri);
	}

	@Override
	public int total(SearchCriteria cri) {
		// TODO Auto-generated method stub
		return session.selectOne(namespace +".total",cri);
	}

	@Override
	public void delete(String id) {
		// TODO Auto-generated method stub
		session.delete(namespace+".delete",id);
	}

	@Override
	public void update(LocalVO vo) {
		// TODO Auto-generated method stub
		session.update(namespace+".update",vo);
	}
}

LocalController생성

package com.example.web;

import java.util.HashMap;

import javax.inject.Inject;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.ResponseBody;

import com.example.domain.LocalVO;
import com.example.domain.PageMaker;
import com.example.domain.SearchCriteria;
import com.example.persistence.LocalDAO;

@Controller
public class LocalController{
	@Inject
	LocalDAO dao;
	
	
	@RequestMapping("insert")
	public String insert(){
		return "insert";
	}
	
	@RequestMapping("mlist")
	public String mlist(){
		return "mlist";
	}
	
	@ResponseBody
	@RequestMapping(value="insert" ,method=RequestMethod.POST)
	public void insertPost(LocalVO vo){
		dao.insert(vo);
	}
	
	@RequestMapping("list")
	public String list(){
		return "list";
	}
	
	@ResponseBody
	@RequestMapping("list.json")
	public HashMap<String, Object> listJson(SearchCriteria cri){
		HashMap<String, Object> map=new HashMap<String, Object>();
		cri.setPerPageNum(5);
		PageMaker pm=new PageMaker();
		pm.setCri(cri);
		pm.setTotalCount(dao.total(cri));
		
		map.put("list", dao.list(cri));
		map.put("pm", pm);
		return map;
	}
	
	@ResponseBody
	@RequestMapping(value="delete" ,method=RequestMethod.POST)
	public void deletePost(String id){
		dao.delete(id);
	}
	
	@ResponseBody
	@RequestMapping(value="update" ,method=RequestMethod.POST)
	public void updatePost(LocalVO vo){
		//System.out.println(vo.toString());
		dao.update(vo);
	}
	
	
	
}

MenuVO 생성

package com.example.domain;

public class MenuVO {
	private int mid;
	private String id;
	private String mname;
	private int price;
	
	public int getMid() {
		return mid;
	}
	public void setMid(int mid) {
		this.mid = mid;
	}
	public String getId() {
		return id;
	}
	public void setId(String id) {
		this.id = id;
	}
	public String getMname() {
		return mname;
	}
	public void setMname(String mname) {
		this.mname = mname;
	}
	public int getPrice() {
		return price;
	}
	public void setPrice(int price) {
		this.price = price;
	}
	
	@Override
	public String toString() {
		return "MenuVO [mid=" + mid + ", id=" + id + ", mname=" + mname + ", price=" + price + "]";
	}
	
	
}

MenuDAO 생성

package com.example.persistence;

import java.util.List;

import com.example.domain.MenuVO;

public interface MenuDAO {
	public List<MenuVO> list(String id);
	public void insert(MenuVO vo);
}

MenuMapper생성

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper
    PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper  namespace="MenuMapper">
	<select id="list" resultType="com.example.domain.MenuVO">
		select * from tbl_menu
		where id=#{id}
		order by id desc
	</select>
	<insert id="insert">
		insert into tbl_menu(id,mname,price) 
		values(#{id},#{mname},#{price})
	</insert>
</mapper>

MemuDAOImpl생성

package com.example.persistence;

import java.util.List;

import javax.inject.Inject;

import org.apache.ibatis.session.SqlSession;
import org.springframework.stereotype.Repository;

import com.example.domain.MenuVO;

@Repository
public class MenuDAOImpl implements MenuDAO{
	@Inject
	SqlSession session;
	private String namespace="MenuMapper";
	
	
	@Override
	public List<MenuVO> list(String id) {
		// TODO Auto-generated method stub
		return session.selectList(namespace +".list",id);
	}


	@Override
	public void insert(MenuVO vo) {
		// TODO Auto-generated method stub
		session.insert(namespace+".insert",vo);
	}

}

MenuController생성

package com.example.web;

import java.util.List;

import javax.inject.Inject;

import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;

import com.example.domain.MenuVO;
import com.example.persistence.MenuDAO;

@RestController
public class MenuController {
	
	@Inject
	MenuDAO dao;
	
	
	@RequestMapping("menu.json")
	public List<MenuVO> list(String id){
		return dao.list(id);
	}
	
	@RequestMapping("menu.insert")
	public void insert(MenuVO vo){
		dao.insert(vo);
	}
}

insert

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<title>Insert title here</title>
	<link href="${pageContext.request.contextPath}/resources/main.css" rel="stylesheet">
	<script src="http://code.jquery.com/jquery-3.1.1.min.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/3.0.1/handlebars.js"></script>
</head>
<body>
	<h1 class="h1">[맛집 등록]</h1>
	<div class="div-search">
		<div style="float:left">
			<input type="checkbox" id="chkall">
			<input type="button" value="선택저장" id="btninsert">
		</div>
		<div style="float:right;">
			<input type="text" id="query" value="만수동 버거킹">
			<input type="button" id="btnsearch" value="검색">
			검색수:<span id="total"></span>건
		</div>
	</div>
	<table width=700 id="tbl" class="tbl-search"></table>
	<script id="temp" type="text/x-handlebars-template">
	{{#each documents}}
		<tr class="row">
			<td><input type="checkbox" class="chk"></td>
			<td class="id" width=150>{{id}}</td>
			<td class="pname" widht=200>{{place_name}}</td>
			<td class="address" width=200>{{address_name}}</td>
			<td class="phone" width=150>{{phone}}</td>
		</tr>
	{{/each}}
	</script>
	<div id="btn-two">
		<button id="btnpre">PRE</button>
		<button id="btnnext">NEXT</button>
	</div>	 
	<jsp:include page="list.jsp"></jsp:include>
</body>
	<script>
	var query=$("#query").val();
	var page=1;
	var is_end=false;
	
	
	$("#chkall").on("click",function(){
		if($(this).is(":checked")){
			$("#tbl .row .chk").each(function(){
				$(this).prop("checked",true);
			});
		}else{
			$("#tbl .row .chk").each(function(){
				$(this).prop("checked",false);
			});
		}
	});
	
	$("#btninsert").on("click",function(){
		if(!confirm("저장하시겠습니까?")) return;
		$("#tbl .row .chk:checked").each(function(){
			var row=$(this).parent().parent();
			var id=row.find(".id").html();
			var pname=row.find(".pname").html();
			var phone=row.find(".phone").html();
			var address=row.find(".address").html();
			//alert(id + "\n "+ pname + "\n "+ phone + "\n "+ address);
			$.ajax({
				type:"post",
				url:"insert",
				data:{"id":id,"pname":pname,"phone":phone,"address":address},
				success:function(){
		
				}
			});
		});
		alert("저장되었습니다.");
		getlist();
		getmylist();
	});
	
	$("#btnpre").on("click",function(){
		if(page > 1){
			page -= 1;
			getlist();
		}
	});
	
	$("#btnnext").on("click",function(){
		if(!is_end){
			page += 1;
			getlist();
		}
	});
	
	$("#btnsearch").on("click",function(){
		page=1;
		query=$("#query").val();	
		getlist();
	});
	$("#query").keyup(function(key){
		if(key.keyCode==13){
			page=1;
			query=$("#query").val();
			getlist();
		}
	});
	getlist();
	function getlist(){
		$.ajax({
			type:"get",
			url:"https://dapi.kakao.com/v2/local/search/keyword.json",
			headers:{"Authorization":"KakaoAK 6baa3500ff42695b48d705aa87132cb3"},
			data:{"query":query,"size":"5","page":page},
			success:function(data){
				var temp=Handlebars.compile($("#temp").html());
				$("#tbl").html(temp(data));
				$("#total").html(data.meta.total_count);
				is_end=data.meta.is_end;
				$("#chkall").prop("checked",false);
				
			}
		});
	}
	</script>
</html>

 

list 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<title>Insert title here</title>
	<script src="http://code.jquery.com/jquery-3.1.1.min.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/3.0.1/handlebars.js"></script>
	<link href="${pageContext.request.contextPath}/resources/main.css" rel="stylesheet">
</head>
<body>
	<h1 class="h1">[맛집목록]</h1>
	<div class="div-search">
			<input type="checkbox" id="chkdel">
			<input type="button" id="btndel" value="선택삭제">
			<div style="float:right">
				<input type="text" id="keyword" value="버거킹">
				<select id="searchType">
					<option value="pname">이름</option>
					<option value="address">주소</option>
				</select>
				<input type="button" id="btnmysearch" value="검색">
				검색수:<span id="mysearch"></span>
				<!--  전체페이지:<span id="mytotal"></span> -->
			</div>
	</div>
	<table id="tbl-my" class="tbl-search"></table>
	<script id="temp-my" type="text/x-handlebars-template">
	{{#each list}}
		<tr class="row">
			<td width=50><input type="checkbox" class="chk" id="{{id}}"></td>
			<td width=100 class="id">{{id}}</td>
			<td class="pname" width="200"><a href="{{id}}">{{pname}}</td>
			<td width="100"><input type="text" value="{{phone}}" class="phone"  size=10></td>
			<td class="address" width="200">{{address}}</td>
			<td width=50><button id="btnup">수정</button></td>
		</tr>
	{{/each}}
	</script>
	<div id="pagination" class="pagination"></div>
	<jsp:include page="mlist.jsp"></jsp:include>
</body>
	<script>
	var mypage=1;
	var searchType=$("#searchType").val();
	var keyword=$("#keyword").val();
	getmylist();
	var id;
	
	$("#btnmysearch").on("click",function(){
		keyword=$("#keyword").val();
		getmylist();
	});
	
	$("#keyword").keyup(function(key){
		if(key.keyCode==13){
			keyword=$("#keyword").val();
			getmylist();
		}
	});
	
	$("#tbl-my").on("click","a",function(e){
		e.preventDefault();
		id=$(this).attr("href");
		getmenulist();
	});
	$("#tbl-my").on("click",".row #btnup",function(){
		
		if(!confirm("수정하시겠습니까?")) return;
		var row=$(this).parent().parent();
		var phone=row.find(".phone").val();
		var id=row.find(".id").html();
		
		//alert(phone +"\n" +id);
		
		$.ajax({
			 type:"post",
			 url:"update",
			 data:{"phone":phone,"id":id},
			 success:function(){
				
			 }
		});
		 alert("수정되었어요");
		 getmylist();
		
	});
	$("#btndel").on("click",function(){
		if(!confirm("삭제하시겠습니까?")) return;
		$("#tbl-my .row .chk:checked").each(function(){
			var id=$(this).attr("id");
			$.ajax({
				type:"post",
				url:"delete",
				data:{"id":id},
				success:function(){
					getmylist();
				}
			});
		});
	});
	
	$("#chkdel").on("click",function(){
		if($(this).is(":checked")){
			$("#tbl-my .row .chk").each(function(){
				$(this).prop("checked",true);
			});
		}else{
			$("#tbl-my .row .chk").each(function(){
				$(this).prop("checked",false);
			});
		}
	});
	
	function getmylist(){
		$.ajax({
			type:"get",
			url:"list.json",
			data:{"page":mypage,"keyword":keyword,"searchType":searchType},
			success:function(data){
				var temp=Handlebars.compile($("#temp-my").html());
				$("#tbl-my").html(temp(data));
				$("#mytotal").html(data.pm.totalCount);
				$("#chkdel").prop("checked",false);
			
				
				var str="";
				
				if(data.pm.prev){
					str += "<a href='" +  (data.pm.startPage-1)  + "' >◀</a>";
				}
				
				for(var i=data.pm.startPage; i<=data.pm.endPage; i++){
					if(data.pm.cri.page == i){
						str += "&nbsp;<a href='" +  i  + "' class='active'>" + i + "</a>&nbsp";
					}else{
						str += "&nbsp;<a href='" + i +  "'>"  + i + "</a>&nbsp;";	
					}
				}
				
				if(data.pm.next){
					str += "<a href='" +  (data.pm.endPage+1)  + "'>▶</a>";
				}
				
				$("#pagination").html(str);
			}
		});
	}
	$("#pagination").on("click","a",function(event){
		event.preventDefault();
		mypage=$(this).attr("href");
		getmylist();
	});
	</script>
</html>

mlist

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<title>Insert title here</title>
	<link href="${pageContext.request.contextPath}/resources/main.css" rel="stylesheet">
	<script src="http://code.jquery.com/jquery-3.1.1.min.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/3.0.1/handlebars.js"></script>
</head>
<body>
	<h1>[메뉴 목록]</h1>
	<div class="div-search">
		맛집아이디:<span id="id"></span>
	</div>
	<div class="div-menu">
		<table class="tbl-search">
			<tr>
				<td>메뉴이름</td>
				<td><input type="text" id="txtname"></td>
			</tr>
			<tr>
				<td>메뉴가격</td>
				<td><input type="text" id="txtprice"></td>
			</tr>
		</table>
		<div style="float:right; margin-top:10px;">
			<button id="btnmenu">메뉴추가</button>
		</div>
	</div>
	<table class="tbl-menu" id="tbl-menu"></table>
	<script id="temp-menu" type="text/x-handlebars-template">
	{{#each .}}
	<tr>
		<td>{{mid}}</td>
		<td>{{mname}}</td>
		<td>{{price}}</td>
	</tr>
	{{/each}}
	
</script>
	
</body>
	<script>
	
	$("#btnmenu").on("click",function(){
		//alert("성공");
		if(!confirm("저장하시겠습니까?")) return;
			var mname=$("#txtname").val();
			var price=$("#txtprice").val();
			var id=$("#id").html();
			
			//alert(mname +"\n"+ price +"\n"+id);
			
			
			$.ajax({
				type:"get",
				url:"menu.insert",
				data:{"mname":mname,"price":price,"id":id},
				success:function(){
					
				}
			});
			alert("저장됨");
			getmenulist();
			$("#txtname").val('');
			$("#txtprice").val('');
			
	});
	
	getmenulist();
	function getmenulist(){
		$.ajax({
			type:"get",
			url:"menu.json",
			data:{"id":id},
			success:function(data){
				var temp=Handlebars.compile($("#temp-menu").html());
				$("#tbl-menu").html(temp(data));
				$("#id").html(id);
			}
		});
	}
	</script>
</html>