index
<a href="custcontroller?work=move">custuserlist</a>
CustUserController.java
@WebServlet("/custcontroller")
public class CustUserController extends HttpServlet {
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
String work = req.getParameter("work");
if(work.equals("move")) {
forward("custuserlist.html", req, resp); // 거길루 가!
}
else if(work.equals("detail")) {
// System.out.println("CustUserController detail");
String id = req.getParameter("id");
System.out.println("id:" + id);
CustUserDao dao = CustUserDao.getInstance();
CustUserDto custdto = dao.getCustuser(id);
// 보내줄 데이터
req.setAttribute("cust", custdto);
// 이동
forward("custuserdetail.jsp", req, resp);
}
}
@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
}
public void forward(String link, HttpServletRequest req, HttpServletResponse resp)throws ServletException, IOException {
RequestDispatcher dis = req.getRequestDispatcher(link);
dis.forward(req, resp);
}
}
custuserlist.html
<title>Insert title here</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>
<h1>고객 목록(MVC Model2)</h1>
<form action="muldel.jsp" method="post">
<table style="width: 700" id="tab" border="2">
<col width="100"><col width="300"><col width="300">
<tr>
<th bgcolor="#ffff00">
<input type="checkbox" name="alldel" onclick="deletechecks(this.checked)">
</th>
<th bgcolor="gray">ID</th>
<th bgcolor="gray">Name</th>
</tr>
<tr class="titleAf">
<td height="2" bgcolor="#0000ff" colspan="3"></td>
</tr>
<!-- 여기에 추가 된다 -->
<tr>
<td align="center" height="1" bgcolor="#c0c0c0" colspan="3">
<input type="submit" value="고객정보 삭제">
</td>
</tr>
<tr>
<td height="2" bgcolor="#0000ff" colspan="3"></td>
</tr>
<tr bgcolor="#f6f6f6">
<td colspan="3">
<a href="adduser?work=addView">고객정보 추가</a>
</td>
</tr>
</table>
</form>
<script type="text/javascript">
//$(document).ready(function () {
$(function () {
$.ajax({
url:"./custData",
type:"get",
data:"work=data",
success:function(datas){
// alert('success');
let custlist = datas.map.custlist;
$.each(custlist, function (i, val) {
let app = "<tr bgcolor='#f6f6f6'>"
+ "<td align='center' bgcolor='yellow'>"
+ "<input type='checkbox' name='delck' value='" + val.id + "'>"
+ "</td>"
+ "<td>" + val.id + "</td>"
+ "<td>"
+ "<a href='custcontroller?work=detail&id=" + val.id + "'>" + val.name + "</a>"
+ "</td>"
+ "</tr>";
$(".titleAf").eq(-1).after(app); // class titleAf 뒤에 추가
});
},
error:function(){
alert('error');
}
});
});
</script>
</body>
custuserdetail.jsp
<%
CustUserDto dto = (CustUserDto)request.getAttribute("cust");
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>custuserdetail</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>
<h1>고객정보</h1>
<table style="width: 600">
<col width="200"><col width="400">
<tr>
<td height="2" bgcolor="#00ff00" colspan="3"></td>
</tr>
<tr bgcolor="#f6f6f6">
<th>ID</th>
<td id="id"><%=dto.getId() %></td>
</tr>
<tr>
<td height="2" bgcolor="#00ff00" colspan="3"></td>
</tr>
<tr bgcolor="#f6f6f6">
<th>이름</th>
<td><%=dto.getName() %></td>
</tr>
<tr>
<td height="2" bgcolor="#00ff00" colspan="3"></td>
</tr>
<tr bgcolor="#f6f6f6">
<th>주소</th>
<td><%=dto.getAddress() %></td>
</tr>
<tr>
<td height="2" bgcolor="#00ff00" colspan="3"></td>
</tr>
<tr>
<td colspan="2" align="center">
<button type="button" id="updateBtn">수정</button>
<%--
<form action="custuserupdate.jsp">
<input type="hidden" name="id" value="<%=dto.getId() %>">
<input type="submit" value="수정">
</form>
--%>
<button type="button" id="deleteBtn">삭제</button>
</td>
</tr>
<tr>
<td height="2" bgcolor="#00ff00" colspan="3"></td>
</tr>
</table>
<script type="text/javascript">
$(document).ready(function () {
$("#updateBtn").click(function () {
location.href = "update?work=updateView&id=" + $("#id").text();
// let id = $("#id").text();
// alert(id);
// let id = "<%=dto.getId() %>";
// alert(id);
});
$("#deleteBtn").click(function () {
location.href = "update?work=del&id=" + $("#id").text();
});
});
</script>
</body>
</html>
'Ajax' 카테고리의 다른 글
MVC model2 // .html <- servlet .java접근 // gson// 화면에 뿌리기 (0) | 2020.07.24 |
---|---|
MVC model2 // .html <- servlet .java접근 //list//map//obj (0) | 2020.07.24 |
MVC model1 // .html <- .jsp 접근 (0) | 2020.07.24 |
Html에서 $.ajax로 xml 파씽 (0) | 2020.07.24 |
Html 에서 $.ajax로 .json 호출 (0) | 2020.07.24 |