Code - yangart/sejongOn

<!DOCTYPE html> <html lang="ko"> <head> <title>온세종학교</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta name="Author" content="" /> <meta name="Keywords" content="" /> <meta name="Description" content="" /> <meta name="format-detection" content="telephone=no" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0" /> <link href="/resources/front/site/SITE_00000/css/style.css" rel="stylesheet" />  <script src="/resources/front/site/SITE_00000/js/common/jquery/jquery-3.6.0.min.js"></script> <script src="/resources/front/site/SITE_00000/js/common/jquery/jquery-ui.min.js"></script>     <script src="/resources/front/site/SITE_00000/js/_layout.js"></script>     <script src="/resources/front/site/SITE_00000/js/common.js"></script> <script src="/resources/front/site/SITE_00000/js/common-custom.js"></script>  </head> <body> <div class="accessibility"> <a href="#skipToContents" title="콘텐츠를 바로 볼 수 있도록 건너뛰기합니다.">콘텐츠 바로가기</a> </div>  <div class="container">  <header class="site-header"></header> <div class="site-body" id="skipToContents"> <div class="wrap"> <aside class="lnb"></aside> <div class="site-cont"> <div class="page-tit-area"> <div class="l-area"> <h2 class="title-xlg">설문만들기</h2> </div> </div> <section class="section"> <header class="section-tit-area"> <div class="l-area"> <h3 class="title-lg">기본 설정</h3> </div> <div class="r-area"> <p class="msg"><i class="required">*<span class="txt-hide">필수</span></i> 필수 입력</p> </div> </header> <div class="write-type"> <table> <colgroup> <col style="width:200px"> <col> </colgroup> <tbody> <tr> <th scope="row">제목 <i class="required">*<span class="txt-hide">필수</span></i></th> <td> <input type="text" title="인풋박스" class="q4" placeholder="제목을 입력하세요."> </td> </tr> <tr> <th scope="row">설문지 설명 <i class="required">*<span class="txt-hide">필수</span></i></th> <td> -에디터- </td> </tr> <tr> <th scope="row">설문 응답 기간 <i class="required">*<span class="txt-hide">필수</span></i></th> <td> <fieldset class="checkradio-area dir-col"> <legend>설문 응답 기간</legend> <div class="checkradio"> <input type="radio" name="radio1" id="r1-1" checked> <label for="r1-1">기한없음</label> </div> <div class="checkradio"> <input type="radio" name="radio1" id="r1-2"> <label for="r1-2">기한설정</label> <div class="time-set checkradio-option"> <input type="date"> <select title="선택"> <option value="00">00</option> </select> <span>:</span> <select title="선택"> <option value="00">00</option> </select> <span>-</span> <input type="date"> <select title="선택"> <option value="00">00</option> </select> <span>:</span> <select title="선택"> <option value="00">00</option> </select> </div> </div> </fieldset> </td> </tr> <tr> <th scope="row">개인정보 동의서<br>사용여부 <i class="required">*<span class="txt-hide">필수</span></i> </th> <td> <fieldset> <legend>개인정보 동의서 사용여부</legend> <div class="checkradio"> <input type="radio" name="r2" id="r2-1" checked> <label for="r2-1">사용안함</label> </div> <div class="checkradio"> <input type="radio" name="r2" id="r2-2"> <label for="r2-2">사용함</label> </div> <div class="checkradio-option block p10"> <textarea rows="5">개인정보 수집 및 이용에 동의해 주세요. 1. 수집 목적 : 2. 수집 항목 : 3. 보유 및 이용 기간 : </textarea> </div> </fieldset> </td> </tr> <tr> <th scope="row">설문대상</th> <td> <fieldset class="checkradio-area dir-col"> <legend>풀이대상 선택</legend> <div class="checkradio"> <input type="radio" name="r3" id="r3-1" checked> <label for="r3-1">전체</label> </div> <div class="checkradio"> <input type="radio" name="r3" id="r3-2"> <label for="r3-2">선택입력</label> <div class="checkradio-option"> <button class="btn sm secondary">멤버선택</button> <span>135명</span> </div> </div> <div class="checkradio"> <input type="radio" name="r3" id="r3-3"> <label for="r3-3">모둠 선택</label> <div class="checkradio-option"> <select title="그룹 선택1" class="sm"> <option>모둠 선택</option> </select> </div> </div> <div class="item-add-area"> <div class="chip-area"> <span class="chip-tag"> 추가된 모둠명1 <button type="button" class="ico-delete">삭제</button> </span> <span class="chip-tag"> 추가된 모둠명2 <button type="button" class="ico-delete">삭제</button> </span> </div> </div> </fieldset> </td> </tr> <tr> <th scope="row">무기명 여부 <i class="required">*<span class="txt-hide">필수</span></i></th> <td> <fieldset> <legend>무기명 여부</legend> <div class="checkradio"> <input type="radio" name="r4" id="r4-1" checked> <label for="r4-1">무기명아님</label> </div> <div class="checkradio"> <input type="radio" name="r4" id="r4-2"> <label for="r4-2">무기명(설문응답자 이름을 ****로 표시합니다.)</label> </div> </fieldset> </td> </tr> </tbody> </table> </div> </section> <section class="section"> <header class="section-tit-area"> <div class="l-area"><h3 class="title-lg">설문지 작성</h3></div> </header> <div class="form-write"> <div class="form-section bg-area"> <div class="form-section-body wrap-sm"> <div class="form-item-list"> <div class="form-item"> <div class="q-area"> <div class="q-tit"> <select title="설문 타입 선택"> <option selected>객관식 질문</option> <option>다중 체크박스</option> <option>드롭다운</option> <option>서술형</option> <option>단답형</option> <option>파일 업로드</option> </select> <input type="text" placeholder="질문을 입력하세요."> <div class="file-custom"> <input type="file" class="input-file"> <span class="btn circle ico-img"><span class="txt-hide">이미지 첨부</span></span> </div> </div> <div class="q-img lg"> <figure> <img src="/resources/front/site/SITE_00000/images/temp/img1.jpg" alt="이미지"> <div class="img-fnc-etc"> <button type="button" class="btn sm circle ico-delete overlay"></button> </div> </figure> </div> </div> <div class="a-area"> <ol class="a-write-list"> <li class="a-item"> <i class="ico-move"></i> <div class="a-info"> <div class="checkradio"> <input type="radio" id="a1_1" name="a1" class="icon-only" disabled> <label for="a1_1"></label> </div> </div> <div class="a-cont"> <div class="a-txt"> <input type="text" placeholder="질문을 입력하세요."> </div> </div> <div class="a-fnc"> <button class="btn sm circle danger ico-delete">삭제</button> </div> </li> <li class="a-item"> <i class="ico-move"></i> <div class="a-info"> <div class="checkradio"> <input type="radio" id="a1_2" name="a" class="icon-only" disabled> <label for="a1_2"></label> </div> </div> <div class="a-cont"> <div class="a-txt"> <input type="text" placeholder="질문을 입력하세요."> </div> </div> <div class="a-fnc"> <button class="btn sm circle danger ico-delete">삭제</button> </div> </li> <li class="a-item"> <i class="ico-move"></i> <div class="a-info"> <div class="checkradio"> <input type="radio" id="a1_3" name="a1" class="icon-only" disabled> <label for="a1_3"></label> </div> </div> <div class="a-cont"> <div class="a-txt"> <input type="text" placeholder="질문을 입력하세요."> </div> </div> <div class="a-fnc"> <button class="btn sm circle danger ico-delete">삭제</button> </div> </li> </ol> </div> <div class="form-item-fnc"> <div class="l-area"> <a href="#none" class="btn-text primary">옵션추가 <i class="ico-form-plus primary"></i></a> </div> <div class="r-area"> <label class="toggle"><input type="checkbox" checked=""><span>필수</span></label> <div class="btn-group"> <button class="btn sm circle ico-copy">복사</button> <button class="btn sm circle danger ico-delete">삭제</button> </div> </div> </div> </div> <div class="form-item"> <div class="q-area"> <div class="q-tit"> <select title="설문 타입 선택"> <option>객관식 질문</option> <option>다중 체크박스</option> <option>드롭다운</option> <option>서술형</option> <option>단답형</option> <option>파일 업로드</option> </select> <input type="text" placeholder="질문을 입력하세요."> <div class="file-custom"> <input type="file" class="input-file"> <span class="btn circle ico-img"><span class="txt-hide">이미지 첨부</span></span> </div> </div> </div> <div class="a-area"> <ol class="a-write-list"> <li class="a-item"> <i class="ico-move"></i> <div class="a-info"> <div class="checkradio"> <input type="checkbox" id="a2_1" name="a2" class="icon-only" disabled> <label for="a2_1"></label> </div> </div> <div class="a-cont"> <div class="a-txt"> <input type="text" placeholder="질문을 입력하세요."> </div> </div> <div class="a-fnc"> <button class="btn sm circle danger ico-delete">삭제</button> </div> </li> <li class="a-item"> <i class="ico-move"></i> <div class="a-info"> <div class="checkradio"> <input type="checkbox" id="a2_2" name="a2" class="icon-only" disabled> <label for="a2_2"></label> </div> </div> <div class="a-cont"> <div class="a-txt"> <input type="text" placeholder="질문을 입력하세요."> </div> </div> <div class="a-fnc"> <button class="btn sm circle danger ico-delete">삭제</button> </div> </li> </ol> </div> <div class="form-item-fnc"> <div class="l-area"> <a href="#none" class="btn-text primary">옵션추가 <i class="ico-form-plus primary"></i></a> </div> <div class="r-area"> <label class="toggle"><input type="checkbox" checked=""><span>필수</span></label> <div class="btn-group"> <button class="btn sm circle ico-copy">복사</button> <button class="btn sm circle danger ico-delete">삭제</button> </div> </div> </div> </div> <div class="form-item"> <div class="q-area"> <div class="q-tit"> <select title="설문 타입 선택"> <option>객관식 질문</option> <option>다중 체크박스</option> <option>드롭다운</option> <option>서술형</option> <option>단답형</option> <option>파일 업로드</option> </select> <input type="text" placeholder="질문을 입력하세요."> <div class="file-custom"> <input type="file" class="input-file"> <span class="btn circle ico-img"><span class="txt-hide">이미지 첨부</span></span> </div> </div> </div> <div class="a-area"> <ol class="a-write-list"> <li class="a-item"> <i class="ico-move"></i> <div class="a-info"> <span class="num">1</span> </div> <div class="a-cont"> <div class="a-txt"> <input type="text" placeholder="질문을 입력하세요."> </div> </div> <div class="a-fnc"> <button class="btn sm circle danger ico-delete">삭제</button> </div> </li> <li class="a-item"> <i class="ico-move"></i> <div class="a-info"> <span class="num">2</span> </div> <div class="a-cont"> <div class="a-txt"> <input type="text" placeholder="질문을 입력하세요."> </div> </div> <div class="a-fnc"> <button class="btn sm circle danger ico-delete">삭제</button> </div> </li> </ol> </div> <div class="form-item-fnc"> <div class="l-area"> <a href="#none" class="btn-text primary">옵션추가 <i class="ico-form-plus primary"></i></a> </div> <div class="r-area"> <label class="toggle"><input type="checkbox" checked=""><span>필수</span></label> <div class="btn-group"> <button class="btn sm circle ico-copy">복사</button> <button class="btn sm circle danger ico-delete">삭제</button> </div> </div> </div> </div> <div class="form-item"> <div class="q-area"> <div class="q-tit"> <select title="설문 타입 선택"> <option>객관식 질문</option> <option>다중 체크박스</option> <option>드롭다운</option> <option>서술형</option> <option>단답형</option> <option>파일 업로드</option> </select> <input type="text" placeholder="질문을 입력하세요."> <div class="file-custom"> <input type="file" class="input-file"> <span class="btn circle ico-img"><span class="txt-hide">이미지 첨부</span></span> </div> </div> </div> <div class="a-area"> <ol class="a-write-list"> <li class="a-item"> <div class="a-cont"> <div class="a-txt"> <input type="text" placeholder="단답형 입력" disabled> </div> </div> </li> </ol> </div> <div class="form-item-fnc"> <div class="r-area"> <label class="toggle"><input type="checkbox" checked=""><span>필수</span></label> <div class="btn-group"> <button class="btn sm circle ico-copy">복사</button> <button class="btn sm circle danger ico-delete">삭제</button> </div> </div> </div> </div> <div class="form-item"> <div class="q-area"> <div class="q-tit"> <select title="설문 타입 선택"> <option>객관식 질문</option> <option>다중 체크박스</option> <option>드롭다운</option> <option>서술형</option> <option>단답형</option> <option>파일 업로드</option> </select> <input type="text" placeholder="질문을 입력하세요."> <div class="file-custom"> <input type="file" class="input-file"> <span class="btn circle ico-img"><span class="txt-hide">이미지 첨부</span></span> </div> </div> </div> <div class="a-area"> <ol class="a-write-list"> <li class="a-item"> <div class="a-cont"> <div class="a-txt"> <textarea placeholder="서술형 입력" rows="5" disabled></textarea> </div> </div> </li> </ol> </div> <div class="form-item-fnc"> <div class="l-area"> <a href="#none" class="btn-text primary">옵션추가 <i class="ico-form-plus primary"></i></a> </div> <div class="r-area"> <label class="toggle"><input type="checkbox" checked=""><span>필수</span></label> <div class="btn-group"> <button class="btn sm circle ico-copy">복사</button> <button class="btn sm circle danger ico-delete">삭제</button> </div> </div> </div> </div> </div> </div> <div class="form-section-footer"> <div class="r-area"> <button type="button" class="btn ico-form-plus"> 질문 추가 </button> <button type="button" class="btn danger ico-delete"> 세션 삭제 </button> </div> </div> </div> <div class="form-section bg-area"> <div class="form-section-header"> <div class="form-tit"> <input type="text" placeholder="세션 내용을 입력하세요."> </div> </div> <div class="form-section-body wrap-sm"> <div class="form-item-list"> <div class="form-item"> <div class="q-area"> <div class="q-tit"> <select title="설문 타입 선택"> <option selected>객관식 질문</option> <option>다중 체크박스</option> <option>드롭다운</option> <option>서술형</option> <option>단답형</option> <option>파일 업로드</option> </select> <input type="text" placeholder="질문을 입력하세요."> <div class="file-custom"> <input type="file" class="input-file"> <span class="btn circle ico-img"><span class="txt-hide">이미지 첨부</span></span> </div> </div> <div class="q-img lg"> <figure> <img src="/resources/front/site/SITE_00000/images/temp/img1.jpg" alt="이미지"> <div class="img-fnc-etc"> <button type="button" class="btn sm circle ico-delete overlay"></button> </div> </figure> </div> </div> <div class="a-area"> <ol class="a-write-list"> <li class="a-item"> <i class="ico-move"></i> <div class="a-info"> <div class="checkradio"> <input type="radio" id="a1_1" name="a1" class="icon-only" disabled> <label for="a1_1"></label> </div> </div> <div class="a-cont"> <div class="a-txt"> <input type="text" placeholder="질문을 입력하세요."> </div> </div> <div class="a-fnc"> <button class="btn sm circle danger ico-delete">삭제</button> </div> </li> <li class="a-item"> <i class="ico-move"></i> <div class="a-info"> <div class="checkradio"> <input type="radio" id="a1_2" name="a" class="icon-only" disabled> <label for="a1_2"></label> </div> </div> <div class="a-cont"> <div class="a-txt"> <input type="text" placeholder="질문을 입력하세요."> </div> </div> <div class="a-fnc"> <button class="btn sm circle danger ico-delete">삭제</button> </div> </li> <li class="a-item"> <i class="ico-move"></i> <div class="a-info"> <div class="checkradio"> <input type="radio" id="a1_3" name="a1" class="icon-only" disabled> <label for="a1_3"></label> </div> </div> <div class="a-cont"> <div class="a-txt"> <input type="text" placeholder="질문을 입력하세요."> </div> </div> <div class="a-fnc"> <button class="btn sm circle danger ico-delete">삭제</button> </div> </li> </ol> </div> <div class="form-item-fnc"> <div class="l-area"> <a href="#none" class="btn-text primary">옵션추가 <i class="ico-form-plus primary"></i></a> </div> <div class="r-area"> <label class="toggle"><input type="checkbox" checked=""><span>필수</span></label> <div class="btn-group"> <button class="btn sm circle ico-copy">복사</button> <button class="btn sm circle danger ico-delete">삭제</button> </div> </div> </div> </div> <div class="form-item"> <div class="q-area"> <div class="q-tit"> <select title="설문 타입 선택"> <option>객관식 질문</option> <option>다중 체크박스</option> <option>드롭다운</option> <option>서술형</option> <option>단답형</option> <option>파일 업로드</option> </select> <input type="text" placeholder="질문을 입력하세요."> <div class="file-custom"> <input type="file" class="input-file"> <span class="btn circle ico-img"><span class="txt-hide">이미지 첨부</span></span> </div> </div> </div> <div class="a-area"> <ol class="a-write-list"> <li class="a-item"> <i class="ico-move"></i> <div class="a-info"> <div class="checkradio"> <input type="checkbox" id="a2_1" name="a2" class="icon-only" disabled> <label for="a2_1"></label> </div> </div> <div class="a-cont"> <div class="a-txt"> <input type="text" placeholder="질문을 입력하세요."> </div> </div> <div class="a-fnc"> <button class="btn sm circle danger ico-delete">삭제</button> </div> </li> <li class="a-item"> <i class="ico-move"></i> <div class="a-info"> <div class="checkradio"> <input type="checkbox" id="a2_2" name="a2" class="icon-only" disabled> <label for="a2_2"></label> </div> </div> <div class="a-cont"> <div class="a-txt"> <input type="text" placeholder="질문을 입력하세요."> </div> </div> <div class="a-fnc"> <button class="btn sm circle danger ico-delete">삭제</button> </div> </li> </ol> </div> <div class="form-item-fnc"> <div class="l-area"> <a href="#none" class="btn-text primary">옵션추가 <i class="ico-form-plus primary"></i></a> </div> <div class="r-area"> <label class="toggle"><input type="checkbox" checked=""><span>필수</span></label> <div class="btn-group"> <button class="btn sm circle ico-copy">복사</button> <button class="btn sm circle danger ico-delete">삭제</button> </div> </div> </div> </div> <div class="form-item"> <div class="q-area"> <div class="q-tit"> <select title="설문 타입 선택"> <option>객관식 질문</option> <option>다중 체크박스</option> <option>드롭다운</option> <option>서술형</option> <option>단답형</option> <option>파일 업로드</option> </select> <input type="text" placeholder="질문을 입력하세요."> <div class="file-custom"> <input type="file" class="input-file"> <span class="btn circle ico-img"><span class="txt-hide">이미지 첨부</span></span> </div> </div> </div> <div class="a-area"> <ol class="a-write-list"> <li class="a-item"> <i class="ico-move"></i> <div class="a-info"> <span class="num">1</span> </div> <div class="a-cont"> <div class="a-txt"> <input type="text" placeholder="질문을 입력하세요."> </div> </div> <div class="a-fnc"> <button class="btn sm circle danger ico-delete">삭제</button> </div> </li> <li class="a-item"> <i class="ico-move"></i> <div class="a-info"> <span class="num">2</span> </div> <div class="a-cont"> <div class="a-txt"> <input type="text" placeholder="질문을 입력하세요."> </div> </div> <div class="a-fnc"> <button class="btn sm circle danger ico-delete">삭제</button> </div> </li> </ol> </div> <div class="form-item-fnc"> <div class="l-area"> <a href="#none" class="btn-text primary">옵션추가 <i class="ico-form-plus primary"></i></a> </div> <div class="r-area"> <label class="toggle"><input type="checkbox" checked=""><span>필수</span></label> <div class="btn-group"> <button class="btn sm circle ico-copy">복사</button> <button class="btn sm circle danger ico-delete">삭제</button> </div> </div> </div> </div> <div class="form-item"> <div class="q-area"> <div class="q-tit"> <select title="설문 타입 선택"> <option>객관식 질문</option> <option>다중 체크박스</option> <option>드롭다운</option> <option>서술형</option> <option>단답형</option> <option>파일 업로드</option> </select> <input type="text" placeholder="질문을 입력하세요."> <div class="file-custom"> <input type="file" class="input-file"> <span class="btn circle ico-img"><span class="txt-hide">이미지 첨부</span></span> </div> </div> </div> <div class="a-area"> <ol class="a-write-list"> <li class="a-item"> <div class="a-cont"> <div class="a-txt"> <input type="text" placeholder="단답형 입력" disabled> </div> </div> </li> </ol> </div> <div class="form-item-fnc"> <div class="r-area"> <label class="toggle"><input type="checkbox" checked=""><span>필수</span></label> <div class="btn-group"> <button class="btn sm circle ico-copy">복사</button> <button class="btn sm circle danger ico-delete">삭제</button> </div> </div> </div> </div> <div class="form-item"> <div class="q-area"> <div class="q-tit"> <select title="설문 타입 선택"> <option>객관식 질문</option> <option>다중 체크박스</option> <option>드롭다운</option> <option>서술형</option> <option>단답형</option> <option>파일 업로드</option> </select> <input type="text" placeholder="질문을 입력하세요."> <div class="file-custom"> <input type="file" class="input-file"> <span class="btn circle ico-img"><span class="txt-hide">이미지 첨부</span></span> </div> </div> </div> <div class="a-area"> <ol class="a-write-list"> <li class="a-item"> <div class="a-cont"> <div class="a-txt"> <textarea placeholder="서술형 입력" rows="5" disabled></textarea> </div> </div> </li> </ol> </div> <div class="form-item-fnc"> <div class="l-area"> <a href="#none" class="btn-text primary">옵션추가 <i class="ico-form-plus primary"></i></a> </div> <div class="r-area"> <label class="toggle"><input type="checkbox" checked=""><span>필수</span></label> <div class="btn-group"> <button class="btn sm circle ico-copy">복사</button> <button class="btn sm circle danger ico-delete">삭제</button> </div> </div> </div> </div> </div> </div> <div class="form-section-footer"> <div class="r-area"> <button type="button" class="btn ico-form-plus"> 질문 추가 </button> <button type="button" class="btn danger ico-delete"> 세션 삭제 </button> </div> </div> </div> </div> <div class="form-write-fnc"> <button type="button" class="btn-add"> 세션 추가 </button> </div> </section> <div class="btn-cont"> <button class="btn lg secondary">미리보기</button> <button class="btn lg primary">등록</button> </div> </div> </div> </div> <footer class="site-footer"></footer> </div>  <div class="toast"></div>  <div class="dim"></div> <script> $(document).ready(function() { $('.form-item-list').sortable({ connectWith: '.form-item-list', items: '.form-item', revert: false, update: function(event, ui) { } }); $(".a-write-list").sortable({ handle: $(".a-write-list > li").find(".ico-move"), containment: "parent", update: function (event, ui) { var $list = $(this).children("li"); $list.each(function () { var $li = $(this); var newVal = $(this).index() + 1; $(this).find(".num").html(newVal); }); }, }); }); </script> </body> </html>