검색창(이름업무로 조회)
list.jsp
<!-- 업무, 이름 조회 -->
<form action="listSearch3">
<select name="search">
<option value="s_job">업무조회</option>
<option value="s_ename">이름조회</option>
</select>
<input type="text" name="keyword" placeholder="keyword을 입력하세요">
<button type="submit">keyword검색</button>
</form>
EmpController
/* 조회 및 검색 */
@RequestMapping(value = "listSearch3")
public String listSearch3(Emp emp, String currentPage, Model model) {
log.info("listSearch3 Start...");
// Emp 전체 count 25
int totalEmp = es.totalEmp();
log.info("listSearch3 totalEmp=>{}", totalEmp);
// Paging 작업
Paging page = new Paging(totalEmp, currentPage);
// Parameter emp --> page만 추가 Setting(페이징)
emp.setStart(page.getStart()); // 시작시 1
emp.setEnd(page.getEnd()); // 시작시 10
List<Emp> listSearchEmp = es.listSearchEmp(emp);
log.info("listSearchEmp.size()->{}",listSearchEmp.size());
model.addAttribute("totalEmp", totalEmp);
model.addAttribute("listEmp", listSearchEmp);
model.addAttribute("page", page);
return "list";
}
EmpServiceImpl
/* 검색기능 */
@Override
public List<Emp> listSearchEmp(Emp emp) {
List<Emp> empSearchList = null;
log.info("listSearchEmp Start...");
empSearchList = ed.empSearchList3(emp);
log.info("listSearchEmp empSearchList.size()->{}",empSearchList.size());
return empSearchList;
}
EmpDaoImpl
@Override
public List<Emp> empSearchList3(Emp emp) {
log.info("empSearchList3 Start...");
List<Emp> empSearchList3 = null;
try {
// keyword 검색
// Naming Rule
empSearchList3 = session.selectList("tkEmpSearchList3", emp);
} catch (Exception e) {
log.info("empSearchList3 Exception->{}",e.getMessage());
}
return empSearchList3;
}
Emp.xml
<!-- 직원리스트 검색 -->
<select id="tkEmpSearchList3" parameterType="Emp" resultType="Emp">
select *
from
(
select rownum rn, a.*
from
(select * from emp order by empno) a
)
where rn BETWEEN #{start} and #{end}
<choose>
<when test="search == 's_job'">
AND job like '%' || #{keyword} || '%'
</when>
<when test="search == 's_ename'">
AND ename like '%' || #{keyword} || '%'
</when>
<!-- 기본 선택 -->
<otherwise>
AND job like '%'
</otherwise>
</choose>
</select>
🔽 조회 완
listEmpAjaxForm
//RestController 이용
//Deptno -> deptName 조건 은 객체로 가져옴
function getDept(vDeptno) {
alert("vDeptno->" +vDeptno);
$.ajax(
{ url:"sample/sendVO2",
data:{deptno : vDeptno},
dataType: 'json',
success:function(data){ //성공하면 이데이타를 가져오겟다
ResultStr = data.firstName + " "+ data.lastName + " " + data.mno;
alert("ajax getDept ResultStr ->"+ResultStr );
$('#RestDept').val(ResultStr); //Input Tag라서 val
}
}
);
}
RestController sendVO02 : <Input type="text" id="RestDept" readonly="readonly" ><p>
RestController sendVO02 : sendVO02<Input type="button" id="btn_Dept" value="부서명" onclick="getDept(10)"><p>
aJax Jsp 객체리스트 가져오기
<a href="/listEmpAjaxForm2">/listEmpAjaxForm2(aJax Jsp 객체리스트 get)</a><p>
EmpController
@RequestMapping(value = "/listEmpAjaxForm2")
public String listEmpAjaxForm2(Model model) {
System.out.println(" /listEmpAjaxForm2 START . . . ");
//parameter emp --> 페이지만 추가 (setting)
Emp emp = new Emp();
emp.setStart(1); //시작시 1
emp.setEnd(15); //시작시 10
List<Emp> listEmp = es.listEmp(emp);
model.addAttribute( "listEmp" , listEmp);
return "listEmpAjaxForm2";
}
listEmpAjaxForm2.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ include file="header.jsp" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script src="http://code.jquery.com/jquery-latest.min.js"></script><!-- 최신버전 -->
<script type="text/javascript">
</script>
</head>
<body>
<h2>회원 정보</h2>
<table>
<tr><th>번호</th><th>사번</th><th>이름</th><th>업무</th><th>부서</th><th>근무지</th></tr>
<c:forEach var="emp" items="${listEmp}" varStatus="status"> <!-- 멀티로우 할때 이거 걸어주면 편함 -->
<tr id="emp${status.index}"><td>emp${status.index}</td>
<td><input type="text" id="empno${status.index}" value="${emp.empno }">${emp.empno }</td>
<td><input type="text" id="ename${status.index}" value="${emp.ename }">${empt.ename }</td>
<td>${emp.job }</td><td>${emp.deptno }
<input type="button" id="btn_idCheck2" value="부서Row Delete" onclick="getDeptDelete(${status.index})">
</td>
<%-- <td>${emp.loc }</td> --%>
</tr>
</c:forEach>
</table>
RestController LISTVO3: <input type="button" id="btn_Dept3" value="부서명 LIST" onclick="getListDept()"><p>
Dept_list: <div id="Dept_list"></div>
Dept_list3:
<div id="Dept_list3">
</div>
</body>
</html>
aJax Jsp ROW 부서명 리스트 + 콤보박스
row별로 작업할땐 varStatus="status" 필수 **
listEmpAjaxForm2.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ include file="header.jsp" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script src="http://code.jquery.com/jquery-latest.min.js"></script><!-- 최신버전 -->
<script type="text/javascript">
function getListDept(){
var str = "";
var str2 = "";
console.log("getListDept Run");
alert("getListDept run ... ");
$.ajax(
{
url: "/sendVO3",
dataType : 'json',
success:function(data){
//제이슨객체를 스트링으로 바꿔줌
var jsonStr = JSON.stringify(data);
alert("jsonStr->"+jsonStr);
$('#dept_list_str').append(jsonStr);
str += "<select name='dept' >";
$(data).each(
function(){
str2 = "<option value='"+this.deptno + "'>"+this.dname +"</option>";
str += str2;
}
)
str += "</select><p>"
$('#dept_list_combobox').append(str);
}
}
);
}
</script>
</head>
<body>
<h2>회원 정보</h2>
<table>
<tr><th>번호</th><th>사번</th><th>이름</th><th>업무</th><th>부서</th><th>근무지</th></tr>
<c:forEach var="emp" items="${listEmp}" varStatus="status"> <!-- 멀티로우 할때 이거 걸어주면 편함 -->
<tr id="emp${status.index}"><td>emp${status.index}</td>
<td><input type="text" id="empno${status.index}" value="${emp.empno }">${emp.empno }</td>
<td><input type="text" id="ename${status.index}" value="${emp.ename }">${empt.ename }</td>
<td>${emp.job }</td><td>${emp.deptno }
<input type="button" id="btn_idCheck2" value="부서Row Delete" onclick="getDeptDelete(${status.index})">
</td>
<%-- <td>${emp.loc }</td> --%>
</tr>
</c:forEach>
</table>
RestController LISTVO3: <input type="button" id="btn_Dept3" value="부서명 LIST" onclick="getListDept()"><p>
Dept_list: <div id="dept_list_str"></div>
Dept_list3:
<div id="dept_list_combobox">
</div>
</body>
</html>
Ajax 이용해 삭제하기
listEmpAjaxForm2.jsp
function getDeptDelete(vIndex){ //인덱스를 넘겨주면
var selEmpno = $("#empno"+vIndex).val(); //인덱스에 있는 사원번호를 가져옴
alert("getDeptDelete selEmpno->" +selEmpno);
// Server --> /empnoDelete(EmpRestController)
// service : deleteEmp
// Parameter --> empno : selEmpno , ename : selEname
// 성공 --> 해당 라인 삭제
$.ajax(
{
url:"/empnoDelete",
data:{empno : selEmpno},
dataType: 'json',
success:function(data){
alert("삭제성공")
if(data == '1'){
alert("삭제성공")
location.reload();
}
}
}
);
}
🔽위랑 같은데 다른방식
EmpRestController
//회원삭제
@GetMapping(value = "/empnoDelete")
public int empnoDelete(int empno , Model model) {
System.out.println("@RestController empno->"+empno);
int result =es.deleteEmp(empno);
return result ;
}🔽위랑 같은데 다른방식
.