다중(2중) 셀렉트 박스 질문 드립니다.

다중(2중) 셀렉트 박스 질문 드립니다.

QA

다중(2중) 셀렉트 박스 질문 드립니다.

본문

구글링 하다 얻어건진 2단 셀렉트박스 입니다. html 에서는 잘 되는데 보시면 아시겠지만

2단 셀렉트박스는 저장하는 부분이 없습니다.;;

 

어떻게 처리를 해야될까요? 많은 도움이 필요합니다.ㅠㅠ

 

 

1단 셀렉트 박스(wr_4에 저장됨)


<div class="write_div">
            <label for="wr_4" class="sound_only">참가부문</label>
            <select id="wr_4" name="wr_4" class="frm_input full_input required" onchange="categoryChange(this)">
                <option value="">참가부문</option>
                <option value="어린이" <?php echo get_selected($wr_4, '어린이') ?>>어린이(잔여팀 - <?php echo $remain; ?>팀)</option>
                <option value="청소년" <?php echo get_selected($wr_4, '청소년') ?>>청소년(잔여팀 - <?php echo $remain2; ?>팀)</option>
                <option value="성인" <?php echo get_selected($wr_4, '성인') ?>>성인(잔여팀 - <?php echo $remain3; ?>팀)</option>
            </select>
        </div>

 

2단 셀텍트박스(wr_5에 저장할 예정....)


<div class="write_div">
            <label for="wr_3" class="sound_only">신청 도서명</label>
            <select name="SDIV" id="book" class="frm_input full_input required">
                <option>신청할 도서를 선택하세요</option>
            </select>
            
            <script>
            function categoryChange(e) {
                var book_a = ["신청할 도서를 선택하세요", "최숙희_네 기분은 어떤 색깔이니?", "권영세_동백나무가 웃다", "김상삼_약밤나무의 백 년 이야기"];
                var book_b = ["신청할 도서를 선택하세요", "김수빈_고요한 우연", "김선미_비스킷", "지혜_읽고 쓰고 내가 됩니다"];
                var book_c = ["신청할 도서를 선택하세요", "이슬아_가녀장의 시대", "김익한_거인의 노트", "박창원_오늘 보는 그제 뉴-쓰", "김혜진_툭복을 비는 마음"];
                var target = document.getElementById("book");
                if(e.value == "어린이") var d = book_a;
                else if(e.value == "청소년") var d = book_b;
                else if(e.value == "성인") var d = book_c;
                target.options.length = 0;
                for (x in d) {
                    var opt = document.createElement("option");
                    opt.value = d[x];
                    opt.innerHTML = d[x];
                    target.appendChild(opt);
                }
            }
            </script>
        </div>

이 질문에 댓글 쓰기 :

답변 1

아래의 코드를 한번 참고를 해보시겠어요..

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Multi-select box example</title>
</head>
<body>
    <form method="post" action="your_save_script.php">
        <div class="write_div">
            <label for="wr_4" class="sound_only">참가부문</label>
            <select id="wr_4" name="wr_4" class="frm_input full_input required" onchange="categoryChange(this)">
                <option value="">참가부문</option>
                <option value="어린이">어린이(잔여팀 - 5팀)</option>
                <option value="청소년">청소년(잔여팀 - 3팀)</option>
                <option value="성인">성인(잔여팀 - 2팀)</option>
            </select>
        </div>

        <div class="write_div">
            <label for="wr_5" class="sound_only">신청 도서명</label>
            <select name="wr_5" id="book" class="frm_input full_input required">
                <option>신청할 도서를 선택하세요</option>
            </select>
        </div>
        
        <button type="submit">저장하기</button>
    </form>
    
    <script>
        function categoryChange(e) {
            var book_a = ["신청할 도서를 선택하세요", "최숙희_네 기분은 어떤 색깔이니?", "권영세_동백나무가 웃다", "김상삼_약밤나무의 백 년 이야기"];
            var book_b = ["신청할 도서를 선택하세요", "김수빈_고요한 우연", "김선미_비스킷", "지혜_읽고 쓰고 내가 됩니다"];
            var book_c = ["신청할 도서를 선택하세요", "이슬아_가녀장의 시대", "김익한_거인의 노트", "박창원_오늘 보는 그제 뉴-쓰", "김혜진_툭복을 비는 마음"];
            var target = document.getElementById("book");
            var d = [];

            if(e.value == "어린이") d = book_a;
            else if(e.value == "청소년") d = book_b;
            else if(e.value == "성인") d = book_c;

            target.options.length = 0;
            for (var i = 0; i < d.length; i++) {
                var opt = document.createElement("option");
                opt.value = d[i];
                opt.innerHTML = d[i];
                target.appendChild(opt);
            }
        }
    </script>
</body>
</html>

 

 

 

 

 

답변을 작성하시기 전에 로그인 해주세요.
전체 1

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT