본문 바로가기
SPRING

230309_AJAX

by 경 훈 2023. 3. 9. 
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<header>
<h1 align="center">
마켓 관리 프로그램 v1.0
</h1>
</header>
</header>
<nav class="navbar navbar-inverse">
	<div class="container-fluid">
	<div class="navbar-header">
		<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
			<span class="icon-bar"></span>
			<span class="icon-bar"></span>
			<span class="icon-bar"></span>                        
		</button>
	<a class="navbar-brand" href="/kim13_001/">HOME</a>
	</div>
	<div class="collapse navbar-collapse" id="myNavbar">
	<ul class="nav navbar-nav">
		<li class="active">
		</li>
		<li class="dropdown">
		<a class="dropdown-toggle" data-toggle="dropdown" href="#">상품관리<span class="caret"></span></a>
			<ul class="dropdown-menu">
				<li><a href="in">상품정보</a></li>
			</ul>
		</li>
		<li class="dropdown">
		<a class="dropdown-toggle" data-toggle="dropdown" href="#">마이인포<span class="caret"></span></a>
			<ul class="dropdown-menu">
				<li><a href="myinfoin">마이인포정보</a></li>
			</ul>
		</li>
	</ul>
	<ul class="nav navbar-nav navbar-right">
		<li><a href="mem"><span class="glyphicon glyphicon-user"></span>회원가입</a></li>
		<li><a href="login"><span class="glyphicon glyphicon-log-in"></span>로그인</a></li>
	</ul>
	</div>
	</div>
</nav>
</html>

 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-3.6.0.min.js"></script>
<link rel="stylesheet" href="//code.jauery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code,jwuery.com/ui/1.12.1/jquery-ui.js"></script>
<meta charset="UTF-8">
<script type="text/javascript">
	$(function() {
		$("#codecheck").click(function(){
			var spcode = $("#spcode").val();
			$.ajax({
				type:"post",
				async:true,
				dataType:"text",
				url:"codecheck",
				data:{"spcode":spcode},
				success:function(cnt) {
					if(cnt==0) {
						alert("사용가능한 아이디입니다");
					}
					else {
						alert("중복된 아이디입니다");
					}
				},
				error:function(cnt) {
					alert("전송실패");
				}
			});
		});
		$("#button1").click(function() {
			var spcode = $("#spcode").val();
			var spname = $("#spname").val();
			var su = $("#su").val();
			var danga = $("#danga").val();
			var sam = {"spcode":spcode,"spname":spname,"su":su,"danga":danga};
			var sam = JSON.stringify(sam);
			$.ajax({
				type:"post",
				async:true,
				url:"save1",
				data:{json1:sam},
				success:function() {
					alert("전송성공!")
				},
				error:function() {
					alert("전송실패!")
				}
			});			
		});
		$("#reset1").click(function() {
			$("#spcode").val('');
			$("#spname").val('');
			$("#su").val('');
			$("#danga").val('');
		});
		$("#out1").click(function() {
			$.ajax({
				type:"post",
				dataType:"json",
				url:"out1",
				success:function(data) {
					var htm = "<table border='1' align='center'>";
						htm+= "<tr>";
						htm+= "<th>상품코드</th><th>상품명</th><th>수량</th><th>단가</th><th>총액</th>";
						htm+= "</tr>";
						for(var i in data) {
							htm+="<tr>";
							htm+="<td>"+data[i].spcode+"</td>";
							htm+="<td>"+data[i].spname+"</td>";
							htm+="<td>"+data[i].su+"</td>";
							htm+="<td>"+data[i].danga+"</td>";
							htm+="<td>"+data[i].price+"</td>";
							htm+="</tr>";
						}
						htm+="</table>";
						$("#out").html(htm);
				},
				error:function() {
					alert("출력오류")
				}
			});
		});
	});
</script>
<title>Insert title here</title>
</head>
<body>
	<form action="" method="post">
		<table border="1" align="center">
			<tr>
				<th>상품코드</th>
				<td>
					<input type="text" name="spcode" id="spcode">
					<input type="button" id="codecheck" value="중복체크">
				</td>			
			</tr>
			<tr>
				<th>상품명</th>
				<td><input type="text" name="spname" id="spname"></td>			
			</tr>
			<tr>
				<th>수량</th>
				<td><input type="text" name="su" id="su"></td>			
			</tr>
			<tr>
				<th>단가</th>
				<td><input type="text" name="danga" id="danga"></td>			
			</tr>
			<tr>
				<td colspan="2" align="center">
					<input type="button" id="button1" value="전송">
					<input type="button" id="reset1" value="초기화">
					<input type="button" id="out1" value="불러오기">
				</td>			
			</tr>
		</table>
	</form>
	<div id="out"></div>
</body>
</html>
package com.ezen.kim13_001.market;

public class MarketDTO {
	int spcode;
	String spname;
	int su,danga,price;
	public MarketDTO() {
	}
	public MarketDTO(int spcode, String spname, int su, int danga, int price) {
		super();
		this.spcode = spcode;
		this.spname = spname;
		this.su = su;
		this.danga = danga;
		this.price = price;
	}
	public int getSpcode() {
		return spcode;
	}
	public void setSpcode(int spcode) {
		this.spcode = spcode;
	}
	public String getSpname() {
		return spname;
	}
	public void setSpname(String spname) {
		this.spname = spname;
	}
	public int getSu() {
		return su;
	}
	public void setSu(int su) {
		this.su = su;
	}
	public int getDanga() {
		return danga;
	}
	public void setDanga(int danga) {
		this.danga = danga;
	}
	public int getPrice() {
		return price;
	}
	public void setPrice(int price) {
		this.price = price;
	}
}

 

package com.ezen.kim13_001.market;

import java.util.ArrayList;

public interface Service1 {
	public void insert(int spcode,String spname,int su,int danga,int price);
	public ArrayList<MarketDTO> out();
	public String codecheck(int spcode);
}

 

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper
    PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
    "https://mybatis.org/dtd/mybatis-3-mapper.dtd">

<mapper namespace="com.ezen.kim13_001.market.Service1">
	<insert id="insert">
		insert into company309 values (#{param1},#{param2},#{param3},#{param4},#{param5})
	</insert>
	<select id="out" resultType="com.ezen.kim13_001.market.MarketDTO">
		select * from company309
	</select>
	<select id="codecheck" resultType="String">
		select count(*) from company309 where spcode = #{param1}
	</select>
</mapper>

 

package com.ezen.kim13_001.market;

import java.util.ArrayList;

import javax.servlet.http.HttpServletRequest;

import org.apache.ibatis.session.SqlSession;
import org.json.simple.JSONArray;
import org.json.simple.JSONObject;
import org.json.simple.parser.JSONParser;
import org.springframework.beans.factory.annotation.Autowired;
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;

@Controller
public class MarketController {
	@Autowired
	SqlSession sqlsession;
	@RequestMapping(value="/in")
	public String ko1() {
		return "input";
	}
	@RequestMapping(value="/save1")
	public String ko2(HttpServletRequest request) {
		String json1 = request.getParameter("json1");
		JSONParser jp = new JSONParser();
		try {
			JSONObject jobj;
			jobj = (JSONObject)jp.parse(json1);
			int spcode = Integer.parseInt((String)jobj.get("spcode"));
			String spname = (String)jobj.get("spname");
			int su = Integer.parseInt((String)jobj.get("su"));
			int danga = Integer.parseInt((String)jobj.get("danga"));
			int price = su*danga;
			Service1 ss1 = sqlsession.getMapper(Service1.class);
			ss1.insert(spcode,spname,su,danga,price);
		}
		catch(Exception e) {
			e.printStackTrace();
		}
		return "redirect:in";
	}
	@ResponseBody
	@RequestMapping(value="/out1",method = RequestMethod.POST,produces = "application/text;charset=UTF-8")
	public String ko3() {
		Service1 ss1 = sqlsession.getMapper(Service1.class);
		ArrayList<MarketDTO> list = ss1.out();
		JSONArray array = new JSONArray();
		for(int i=0;i<list.size();i++) {
			JSONObject member = new JSONObject();
			int spcode = list.get(i).getSpcode();
			String spname = list.get(i).getSpname();
			int su = list.get(i).getSu();
			int danga = list.get(i).getDanga();
			int price = list.get(i).getPrice();
			member.put("spcode", spcode);
			member.put("spname", spname);
			member.put("su", su);
			member.put("danga", danga);
			member.put("price", price);
			array.add(member);
		}
		String jsoninfo = array.toJSONString();
		return jsoninfo;
	}
	@ResponseBody
	@RequestMapping(value="/codecheck",method = RequestMethod.POST)
	public String ko4(HttpServletRequest request) {
		int spcode = Integer.parseInt(request.getParameter("spcode"));
		Service1 ss1 = sqlsession.getMapper(Service1.class);
		String cnt = ss1.codecheck(spcode);
		return cnt;
	}
}
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-3.6.0.min.js"></script>
<link rel="stylesheet" href="//code.jauery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code,jwuery.com/ui/1.12.1/jquery-ui.js"></script>
<meta charset="UTF-8">
<script type="text/javascript">
	$(function(){
		$("#send1").click(function(){
			var id = $("#id").val();
			var name = $("#name").val();
			var phone = $("#phone").val();
			var gender = $("#gender").val();
			var address = $("#address").val();
			var sam = {"id":id,"name":name,"phone":phone,"gender":gender,"address":address};
			var sam = JSON.stringify(sam);
			$.ajax ({
				type:"post",
				async:true,
				url:"save2",
				data:{json1:sam},
				success:function() {
					alert("전송성공!")
				},
				error:function(request,status,error){
					alert("code:"+request.status+"\n"+"message:"+request.responseText+"\n"+"error:"+error);
				}
			});
		});
		$("#reset1").click(function(){
			$("#id").val('');
			$("#name").val('');
			$("#phone").val('');
			$("#gender").val('');
			$("#address").val('');
		});
	 	$("#out2").click(function() {
			$.ajax({
				type:"post",
				dataType:"json",
				url:"out2",
				success:function(data) {
					var htm ="<table border='1' align='center'>";
						htm+="<tr>";
						htm+="<th>아이디</th><th>이름</th><th>전화번호</th><th>성별</th><th>주소</th>";
						htm+="</tr>";
						for(var i in data) {
							htm+="<tr>";
							htm+="<td>"+data[i].id+"</td>";
							htm+="<td>"+data[i].name+"</td>";
							htm+="<td>"+data[i].phone+"</td>";
							htm+="<td>"+data[i].gender+"</td>";
							htm+="<td>"+data[i].address+"</td>";
							htm+="</tr>";
						}
						htm+="</table>";
						$("#out").html(htm);
				},
				error:function(request,status,error){
					alert("code:"+request.status+"\n"+"message:"+request.responseText+"\n"+"error:"+error);
				}
			});
		}); 
	 	$("#idcheck").click(function() {
	 		var id = $("#id").val();
	 		$.ajax ({
	 			type:"post",
	 			async:true,
				dataType:"text",
				url:"idcheck2",
				data:{"id":id},
				success:function(cnt) {
					if(cnt==0) {
						alert("사용가능한 아이디입니다.")
					}
					else {
						alert("중복된 아이디입니다.")
					}
				},
				error:function(request,status,error){
					alert("code:"+request.status+"\n"+"message:"+request.responseText+"\n"+"error:"+error);
				}
			});
	 	});
	});
</script>
<title>Insert title here</title>
</head>
<body>
	<form action="">
		<table border="1" align="center">
			<tr>
				<th>아이디</th>
				<td>
					<input type="text" id="id" name="id">
					<input type="button" id="idcheck" value="중복검사">
				</td>
			</tr>
			<tr>
				<th>이름</th>
				<td><input type="text" id="name" name="name"></td>
			</tr>
			<tr>
				<th>전화번호</th>
				<td><input type="text" id="phone" name="phone"></td>
			</tr>
			<tr>
				<th>성별</th>
				<td>
					<select name="gender" id="gender">
						<option value="남자">남자</option>
						<option value="여자">여자</option>
					</select>
				</td>
			</tr>
			<tr>
				<th>거주지</th>
				<td><input type="text" id="address" name="address"></td>
			</tr>
			<tr>
				<td colspan="2" align="center">
					<input type="button" id="send1" value="전송">
					<input type="button" id="reset1" value="리셋">
					<input type="button" id="out2" value="불러오기">
				</td>
			</tr>
		</table>
	</form>
	<div id="out"></div>
</body>
</html>
package com.ezen.kim13_001.myinfo;

import java.util.ArrayList;

public interface Service2 {
	public void insert(String id,String name,String phone,String gender,String address);
	public ArrayList<MyinfoDTO> out2();
	public String idcheck2(String id);
}

 

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper
    PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
    "https://mybatis.org/dtd/mybatis-3-mapper.dtd">

<mapper namespace="com.ezen.kim13_001.myinfo.Service2">
	<insert id="insert">
		insert into myinfo309 values (#{param1},#{param2},#{param3},#{param4},#{param5})
	</insert>
	<select id="out2" resultType="com.ezen.kim13_001.myinfo.MyinfoDTO">
		select * from myinfo309
	</select>
	<select id="idcheck2" resultType="String">
		select count(*) from myinfo309 where id=#{param1}
	</select>
</mapper>

 

package com.ezen.kim13_001.myinfo;

import java.util.ArrayList;

import javax.servlet.http.HttpServletRequest;

import org.apache.ibatis.session.SqlSession;
import org.json.simple.JSONArray;
import org.json.simple.JSONObject;
import org.json.simple.parser.JSONParser;
import org.springframework.beans.factory.annotation.Autowired;
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;

@Controller
public class MyinfoController {
	@Autowired
	SqlSession sqlsession;
	
	@RequestMapping(value="/myinfoin")
	public String ko1() {
		return "myinfoinput";
	}
	@RequestMapping(value="/save2")
	public String ko2(HttpServletRequest request) {
		String json1 = request.getParameter("json1");
		JSONParser jp = new JSONParser();
		try {
			JSONObject jobj;
			jobj = (JSONObject)jp.parse(json1);
			String id = (String)jobj.get("id");
			String name = (String)jobj.get("name");
			String phone = (String)jobj.get("phone");
			String gender = (String)jobj.get("gender");
			String address = (String)jobj.get("address");
			Service2 ss2 = sqlsession.getMapper(Service2.class);
			ss2.insert(id, name, phone, gender, address);
		}
		catch(Exception e) {
			e.printStackTrace();
		}
		return "redirect:myinfoin";
	}
	@ResponseBody
	@RequestMapping(value="/out2",method = RequestMethod.POST,produces = "application/text;charset=UTF-8")
	public String ko2() {
		Service2 ss2 = sqlsession.getMapper(Service2.class);
		ArrayList<MyinfoDTO> list = ss2.out2();
		JSONArray array = new JSONArray();
		for(int i=0;i<list.size();i++) {
			JSONObject member = new JSONObject();
			String id = list.get(i).getId();
			String name = list.get(i).getName();
			String phone = list.get(i).getPhone();
			String gender = list.get(i).getGender();
			String address = list.get(i).getAddress();
			member.put("id", id);
			member.put("name", name);
			member.put("phone", phone);
			member.put("gender", gender);
			member.put("address", address);
			array.add(member);
		}
		String jsoninfo = array.toJSONString();
		return jsoninfo;
	}
	@ResponseBody
	@RequestMapping(value="/idcheck2")
	public String ko3(String id) {
		Service2 ss2 = sqlsession.getMapper(Service2.class);
		String cnt = ss2.idcheck2(id);
		return cnt;
	}
}

 

'SPRING' 카테고리의 다른 글

230313_게시판  (0) 2023.03.13
230310_AJAX  (0) 2023.03.10
230308_AJAX  (0) 2023.03.08
230307_Tiles  (0) 2023.03.07
230306_Tiles  (0) 2023.03.06

관련글

댓글

티스토리툴바