묻고답하기

This commit is contained in:
KNKIM 2021-07-26 10:48:08 +09:00
parent 5d6ebdf1cc
commit b9dde1b3bc
6 changed files with 806 additions and 716 deletions

View File

@ -47,79 +47,41 @@
<body onload="fn_init()">
<h1>묻고답하기</h1>
<h1>${pageTitle }</h1>
<form name="articleForm"
<form name="articleForm" id="articleForm"
action="${pageContext.request.contextPath}/board/listQnAs.do"
method="post"
onSubmit="fn_search_article(); return false;">
method="post">
<!-- 검색조건 -->
<select name="pageRows" id="pageRows" title="목록에 보여줄 글 개수">
<!-- 검색조건 -->
<select name="pageRows" id="pageRows" title="목록에 보여줄 글 개수">
<option value="10">10개씩 보기</option>
<option value="50">50개씩 보기</option>
<option value="100">100개씩 보기</option>
</select>
</select>
<input type="text" name="pageNo" id="pageNo" title="페이지번호" value="1" size="5" maxlength="5" />
<input type="text" name="pageNo" id="pageNo" title="페이지번호" value="1" size="5" maxlength="5" />
<input type="text" name="searchKeyword" id="searchKeyword" title="검색어" value="${searchKeyword }" size="35" maxlength="50" />
<input type="button" name="btnSearch" id="btnSearch" value="검색" />
<input type="text" name="searchKeyword" id="searchKeyword" title="검색어" value="" size="35" maxlength="50" />
<div id="jsGrid" name="jsGrid" style="height: 100%"></div>
<input type="submit" name="btnSearch" id="btnSearch" value="검색" />
<input type="button" name="btnNew" id="btnNew" value="글쓰기"
onclick="javascript:location.href='${pageContext.request.contextPath}/board/insertQnAForm.do';" />
<button type="button" name="btnNew" id="btnNew" class="float"
onclick="javascript:location.href='${pageContext.request.contextPath}/board/insertQnAForm.do';">글쓰기</button>
<div id="jsGrid" name="jsGrid" ></div>
<input type="text" name="articleNo" id="articleNo" value="" title="선택글번호" readonly />
</form>
<script type="text/javaScript" language="javascript">
// 그리드 데이터
var clients = [
{ "noticeNo": 1, "noticeType": "01", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 2, "noticeType": "02", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 3, "noticeType": "03", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 4, "noticeType": "04", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 5, "noticeType": "05", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 6, "noticeType": "06", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 7, "noticeType": "06", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 8, "noticeType": "05", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 8, "noticeType": "05", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 8, "noticeType": "05", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 8, "noticeType": "05", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 8, "noticeType": "05", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 8, "noticeType": "05", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 8, "noticeType": "05", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 8, "noticeType": "05", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 8, "noticeType": "05", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 8, "noticeType": "05", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 8, "noticeType": "05", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 8, "noticeType": "05", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 8, "noticeType": "05", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 8, "noticeType": "05", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 8, "noticeType": "05", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 8, "noticeType": "05", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 8, "noticeType": "05", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 8, "noticeType": "05", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 8, "noticeType": "05", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 8, "noticeType": "05", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 8, "noticeType": "05", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 8, "noticeType": "05", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 8, "noticeType": "05", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 8, "noticeType": "05", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 8, "noticeType": "05", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 8, "noticeType": "05", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 8, "noticeType": "05", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 8, "noticeType": "05", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 8, "noticeType": "05", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 8, "noticeType": "05", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 8, "noticeType": "05", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" },
{ "noticeNo": 9, "noticeType": "01", "title": "공지사항 제목입니다.", "readCount": 7, "regDate": "2021-07-11" }
];
// 그리드내 콤보박스 값
var noticeTypes = [
<script type="text/javaScript" language="javascript">
//=======================================================
// 그리드내 선택옵션 코드값 설정 : 공지사항 유형 코드 (각 요청에 맞게 조정)
//=======================================================
var articleTypes = [
{ Name: "공지" , Id: "01" },
{ Name: "자료" , Id: "02" },
{ Name: "모집" , Id: "03" },
@ -128,72 +90,126 @@ var noticeTypes = [
{ Name: "이벤트", Id: "06" }
];
// 그리드 생성
//=======================================================
// 그리드 생성 환경설정
//=======================================================
$("#jsGrid").jsGrid({
width: "100%",
height: "100%",
inserting: false,
editing: false,
sorting: true,
paging: true,
pageSize: 10,
pageButtonCount: 10,
pageIndex: 1,
pageFirstText: " << ",
pagePrevText: " < ",
pageLastText: " >> ",
pageNextText: " > ",
pagerFormat: "{first} {prev} {pages} {next} {last}",
autoload: true, /* 화면로드된 후, 자동 loadData 처리 여부 */
controller: {
loadData: function (filter) {
/* 이하만 설정 */
/*
data: clients,
*/
var data = $.Deferred();
fields: [
{ title:"번호", name: "noticeNo" , type: "number" , width: 50, align: "center"},
{ title:"유형", name: "noticeType", type: "select", width: 80, align: "center", items: noticeTypes, valueField: "Id", textField: "Name" },
{ title:"제목", name: "title", type: "text" , width: 200, align: "left" },
{ title:"조회수", name: "readCount", type: "number", width: 50, align: "center" },
{ title:"등록일", name: "regDate", type: "text", width: 100, align: "center"}
]
});
//======================================
// 요청 정보 구성 : 시작 (각 요청에 맞게 조정)
//======================================
var reqUrl = "${pageContext.request.contextPath}/board/listQnAsAjax.do";
function fn_search_article() {
var searchKeyword = document.articleForm.searchKeyword.value;
var pageNo = document.articleForm.pageNo.value;
var pageRows = document.articleForm.pageRows.value;
//var pageNo = document.articleForm.pageNo.value;
var pageNo = filter.pageIndex;
//var pageRows = document.articleForm.pageRows.value;
var pageRows = filter.pageSize;
var inputData = {
"searchKeyword" : searchKeyword /*encodeURIComponent(searchKeyword)*/
, "pageNo" : pageNo
, "pageRows": pageRows};
console.log(JSON.stringify(inputData));
//--------------------------------------
// 요청 처리
//--------------------------------------
$.ajax({
type: "post",
contentType: "application/json; charset=utf-8",
url: reqUrl,
dataType: "json",
data: JSON.stringify(inputData),
}).done(function(response){
// 그리드 데이터 예시 : [{ "articleNo": 1, "articleType": "01" }, { "articleNo": 2, "articleType": "02" }]
data.resolve(JSON.parse(response));
});
return data.promise();
} // loadData
},
rowClick: function(args) {
// 클릭된 행의 자료 객체
var getData = args.item;
// 추출할 컬럼의 데이터 가져오기
var articleNo = getData["articleNo"];
// 상세 내용 보기
fn_view_detail(articleNo);
},
//======================================
// 그리드 컬럼 정의 (각 요청에 맞게 조정)
//======================================
fields: [
{ title:"번호", name: "articleNo" , type: "number" , width: 50, align: "center"},
{ title:"유형", name: "articleType", type: "select", width: 80, align: "center", items: articleTypes, valueField: "Id", textField: "Name" },
{ title:"제목", name: "title", type: "text" , width: 200, align: "left" },
{ title:"조회수", name: "readCount", type: "number", width: 50, align: "center" },
{ title:"등록일", name: "regDate", type: "text", width: 100, align: "center"}
]
});
// 선택한 게시글 상세 보기로 이동
function fn_view_detail(articleNo) {
$("#articleNo").val(articleNo);
$("#articleForm").attr("action", "${pageContext.request.contextPath}/board/selectQnA.do");
$("#articleForm").submit();
}
function fn_search_article() {
var searchKeyword = document.articleForm.searchKeyword.value;
var pageNo = document.articleForm.pageNo.value;
var pageRows = document.articleForm.pageRows.value;
var inputData = {
"searchKeyword" : searchKeyword /*encodeURIComponent(searchKeyword)*/
,
"pageNo" : pageNo,
"pageRows" : pageRows
};
//lert(JSON.stringify(inputData));
$.ajax({
url:"${pageContext.request.contextPath}/board/listQnAsAjax.do",
contentType: "application/json; charset=utf-8", /* */
type: "post",
data: JSON.stringify(inputData),
dataType:'json', /* Server Response Data Type */
success: function(returnData, status){
url : "${pageContext.request.contextPath}/board/listQnAsAjax.do",
contentType : "application/json; charset=utf-8", /* */
type : "post",
data : JSON.stringify(inputData),
dataType : 'json', /* Server Response Data Type */
async : true,
success : function(returnData, status) {
var jsonObj = JSON.parse(returnData);
alert("record=" + JSON.stringify(jsonObj.info.record));
$("#jsGrid").jsGrid("loadData", jsonObj.info.record)
alert("record=" + JSON.stringify(jsonObj));
$("#jsGrid").jsGrid("data") = jsonObj;
},
error: function(data){
error : function(data) {
alert("조회에 실패하였습니다.\n" + data.code + " : " + data.message);
}
});
}
}
function fn_init() {
fn_search_article();
function fn_init() {
//fn_search_article();
document.articleForm.searchKeyword.focus();
}
//$("#jsGrid").jsGrid("loadData");
//$("#jsGrid").jsGrid("data") = client2;
}
</script>
</body>

View File

@ -1,9 +1,9 @@
<%
/**
* <pre>
* @Class Name : getSampleInfo.jsp
* @Class Name : selectQnA.jsp
*
* @Description : RESTful API 호출 샘플
* @Description : 묻고답하기 상세내용을 조회한다.
*
*
* @프로젝트명: 지방문화원 통합자료관리시스템 구축사업 (2021)
@ -13,11 +13,11 @@
* @ ------------ -------- ---------------------------
* @ 수정일 수정자 수정내용
* @ ------------ -------- ---------------------------
* @ 2021. 6. 15. KNKIM 최초 생성
* @ 2021. 7. 22. KNKIM 최초 생성
*
*
* @author 이씨플라자 * DIGITALSHIP KNKIM
* @since 2021. 6. 15.
* @since 2021. 7. 22.
* @version 1.0
*
*/
@ -30,53 +30,127 @@
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@ taglib prefix="validator" uri="http://www.springmodules.org/tags/commons-validator" %>
<c:set var="pageTitle">QRCode 회원정보</c:set>
<c:set var="pageTitle">묻고답하기 - 상세조회</c:set>
<!DOCTYPE html>
<html>
<head>
<title>${pageTitle}</title>
<!-- W2UI -->
<link rel="stylesheet" type="text/css" href="/nlib/js/w2ui/w2ui-nlib.css" />
<script type="text/javascript" src="/nlib/js/w2ui/w2ui-1.5.min.js"></script>
<!-- GRID -->
<link type="text/css" rel="stylesheet" href="/nlib/js/jsgrid/nlib-jsgrid.css" />
<link type="text/css" rel="stylesheet" href="/nlib/js/jsgrid/nlib-jsgrid-theme.css" />
<script src="/nlib/js/jsgrid/nlib-jsgrid.js"></script>
</head>
<body>
<!-- javascript warning tag -->
<noscript class="noScriptTitle"><spring:message code="common.noScriptTitle.msg" /></noscript>
<form:form commandName="reqInfo"
action="${pageContext.request.contextPath}/sample/barcode/getMemberQRCode.do" method="post"
target="_blank"
onSubmit="fncAuthorInsert(document.forms[0]); return false;">
<div id="grid" style="width: 100%; height: 250px;"></div>
<h1>${pageTitle }</h1>
</form:form>
<span style="color:red;">${message }</span>
<br />
<form name="articleForm" id="articleForm"
action="${pageContext.request.contextPath}/board/listQnAs.do"
method="post">
<input type="text" name="pageNo" id="pageNo" title="페이지번호" value="${pageNo}" size="5" maxlength="5" readonly />
<input type="text" name="pageRows" id="pageRows" title="목록에 보여줄 글 개" value="${pageRows}" size="5" maxlength="5" readonly />
<input type="text" name="searchKeyword" id="searchKeyword" title="검색어" value="${searchKeyword}" size="35" maxlength="50" readonly />
<input type="text" name="articleNo" id="articleNo" value="${articleNo}" title="선택글번호" readonly />
<input type="text" name="articlePassword" id="articlePassword" value="${articlePassword}" title="글비밀번호" readonly />
<table class="table_content" style="width:100% !important;">
<tr>
<td>유형</td>
<td>Q & A</td>
<td>작성자 : ${article.regUserName }</td>
<td>작성일 : ${article.regDate }</td>
<td>상태 : ${article.repStatus }</td>
</tr>
<tr>
<td rowspan="2">질문내용</td>
<td colspan="4">${article.contentQeust}</td>
</tr>
<tr>
<td colspan="4">${article.contentQeustFile}</td>
</tr>
<tr>
<td rowspan="2">답변내용</td>
<td colspan="4">${article.contentReply}</td>
</tr>
<tr>
<td colspan="4">${article.contentReplyFile}</td>
</tr>
</table>
<br/>
<table class="table_content" style="width:100% !important;">
<tr>
<td>이전글</td>
<td>Q&A</td>
<td><a href=#" onclick="fn_view_detail('${preArticle.articleNo }')">${preArticle.title }</a></td>
<td>작성자 : ${preArticle.regUserName }</td>
<td>작성일 : ${preArticle.regDate }</td>
<td>상태 : ${preArticle.repStatus }</td>
</tr>
<tr>
<td>다음글</td>
<td>Q&A</td>
<td><a href=#" onclick="fn_view_detail('${nextArticle.articleNo }')">${nextArticle.title }</a></td>
<td>작성자 : ${nextArticle.regUserName }</td>
<td>작성일 : ${nextArticle.regDate }</td>
<td>상태 : ${nextArticle.repStatus }</td>
</tr>
</table>
<button type="button" name="btnNew" id="btnNew" class="float"
onclick="fn_list()">목록</button>
<button type="button" name="btnNew" id="btnNew" class="float"
onclick="fn_updatePassword()">수정</button>
</form>
<script type="text/javaScript" language="javascript">
$(function () {
$('#grid').w2grid({
name: 'grid',
header: 'List of Names',
columns: [
{ field: 'fname', text: '이름', size: '30%' },
{ field: 'lname', text: '성명', size: '30%' },
{ field: 'email', text: '이메일', size: '40%' },
{ field: 'sdate', text: '시작일자', size: '120px' }
],
records: [
{ recid: 1, fname: "Peter", lname: "Jeremia", email: 'peter@mail.com', sdate: '2/1/2010' },
{ recid: 2, fname: "Bruce", lname: "Wilkerson", email: 'bruce@mail.com', sdate: '6/1/2010' },
{ recid: 3, fname: "John", lname: "McAlister", email: 'john@mail.com', sdate: '1/16/2010' },
{ recid: 4, fname: "Ravi", lname: "Zacharies", email: 'ravi@mail.com', sdate: '3/13/2007' },
{ recid: 5, fname: "William", lname: "Dembski", email: 'will@mail.com', sdate: '9/30/2011' },
{ recid: 6, fname: "David", lname: "Peterson", email: 'david@mail.com', sdate: '4/5/2010' }
]
});
});
//선택한 게시글 상세 보기로 이동
function fn_view_detail(articleNo) {
$("#articleNo").val(articleNo);
$("#articleForm").attr("action", "${pageContext.request.contextPath}/board/selectQnA.do");
$("#articleForm").submit();
}
// 선택한 게시글 상세 보기로 이동
function fn_list() {
$("#articleForm").attr("action", "${pageContext.request.contextPath}/board/listQnAs.do");
$("#articleForm").submit();
}
// 수정을 위한 비밀번호 입력
function fn_updateForm(passwd) {
if(passwd == null || passwd == "") {
alert("수정을 위한 게시물의 비밀번호를 입력하여 주시기 바랍니다.");
return;
}
$("#articlePassword").val(passwd);
$("#articleForm").attr("action", "${pageContext.request.contextPath}/board/updateQnAForm.do");
$("#articleForm").submit();
}
// 게시글 수정 화면으로 이동
function fn_updatePassword() {
fn_prompt_password("비밀번호를 입력하여 주시기 바랍니다.", "fn_updateForm")
}
</script>
</body>