테스트 사이트 - 개발 중인 베타 버전입니다

2단 선택

ablue 2년 전 조회 1,807

</p>

<p> <tr>

    <th scope="row"><label for="mb_1">지역</label></th>

    <td colspan="3">

        <select name="mb_1" id="mb_1" onchange="categoryChange(this)">

            <option value="">선택해주세요</option>

            <option value="수도권"<?php echo ($mb['mb_1'] == "수도권본부") ? " selected" : "";?>>수도권</option>

            <option value="강원"<?php echo ($mb['mb_1'] == "강원본부") ? " selected" : "";?>>강원</option>

            <option value="충북"<?php echo ($mb['mb_1'] == "충북본부") ? " selected" : "";?>>충북</option>

            <option value="대전충남"<?php echo ($mb['mb_1'] == "대전충남본부") ? " selected" : "";?>>대전충남</option>

        </select>

    </td>     

</tr>

<tr>

    <th scope="row"><label for="mb_2">상세지역</label></th>

    <td colspan="3">    

        <select name="mb_2" id="mb_2">

        <option value="">선택해주세요</option>

        </select>

    </td>    

</tr></p>

<p>

<script>

function categoryChange(e) {

    var target = document.getElementById("mb_2");

    

    var mb_2_a = [ "인천", "시흥", "동서울", "수원", "군포"];

    var mb_2_b = [ "원주", "홍천", "대관령", "강릉", "양양"];

    var mb_2_c = [ "진천", "충주", "엄정", "제천", "보은", "상주"];

    var mb_2_d = [ "천안", "대전", "영동", "당진", "공주"];

        

    if(e.value == "수도권") var d = mb_2_a;

    else if(e.value == "강원") var d = mb_2_b;

    else if(e.value == "충북") var d = mb_2_c;

    else if(e.value == "대전충남") var d = mb_2_d;

        

    target.options.length = 0;</p>

<p>    for (x in d) {

        var opt = document.createElement("option");

        opt.value = d[x];

        opt.innerHTML = d[x];

        target.appendChild(opt);

    }    

}

</script>

 

여기서 찾아보고 2단 선택을 만들었습니다.
회원가입을 받고 db에 저장도 되는데 회원관리에서 저 부분을 수정을 하려고 하는데 1단은 가입받은 내용이 잘 나오는데, 2번째 선택사항이 회원 가입을 받았을때 내용이 안나오고 '선택해주세요'라고만 나옵니다.
어느 부분이 잘 못 되었는지 조언좀 부탁드리겠습니다.
감사합니다.
 

댓글을 작성하려면 로그인이 필요합니다.

답변 4개

 

 

var isFirst = true;

function categoryChange(e) {

    var target = document.getElementById("mb_2");

   

    var mb_2_a = [ "인천", "시흥", "동서울", "수원", "군포"];

    var mb_2_b = [ "원주", "홍천", "대관령", "강릉", "양양"];

    var mb_2_c = [ "진천", "충주", "엄정", "제천", "보은", "상주"];

    var mb_2_d = [ "천안", "대전", "영동", "당진", "공주"];

       

    if(e.value == "수도권") var d = mb_2_a;

    else if(e.value == "강원") var d = mb_2_b;

    else if(e.value == "충북") var d = mb_2_c;

    else if(e.value == "대전충남") var d = mb_2_d;

       

    target.options.length = 0;

    for (x in d) {

        var opt = document.createElement("option");

        opt.value = d[x];

        opt.innerHTML = d[x];

        target.appendChild(opt);

 

        if( isFirst == true &&  d[x] == "<?=echo $mb['mb_2']?>"  ){

            isFirst = false;

            opt.selected = true;

        }

 

    }

}

 

이렇게 한번 해보세요~

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

<script>

 

window.onload = function(){

    var e = document.getElementById('mb_1');

    var text = e.options[e.selectedIndex].value;

    var event = new Event('change', { bubbles: true });

    e.dispatchEvent(event);

}

 

function categoryChange(e) {

    var target = document.getElementById("mb_2");

   

    var mb_2_a = [ "인천", "시흥", "동서울", "수원", "군포"];

    var mb_2_b = [ "원주", "홍천", "대관령", "강릉", "양양"];

    var mb_2_c = [ "진천", "충주", "엄정", "제천", "보은", "상주"];

    var mb_2_d = [ "천안", "대전", "영동", "당진", "공주"];

       

    if(e.value == "수도권") var d = mb_2_a;

    else if(e.value == "강원") var d = mb_2_b;

    else if(e.value == "충북") var d = mb_2_c;

    else if(e.value == "대전충남") var d = mb_2_d;

       

    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>

 

이렇게 한번 해보세요~

로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

a
ablue
2년 전
답변 감사합니다.!!

'선택해주세요'는 나오지 않지만
수도권-시흥으로 가입했는데 수도권-인천
강원-대관령으로 가입했는데 강원-원주
식으로 상세지역의 첫 번째 지역으로만 나옵니다.

댓글을 작성하려면 로그인이 필요합니다.

두 번째 선택 사항이 회원 가입을 받았을 때 내용이 나오지 않고 "선택해주세요"로 나오는 이유는, 회원 가입 시 선택한 2단계 지역 정보가 해당 페이지로 전달되지 않아서입니다.

따라서 회원 가입 시 선택한 2단계 지역 정보를 해당 페이지로 전달하는 코드를 추가해야 합니다.

  1. 회원 가입 시 선택한 2단계 지역 정보를 세션에 저장합니다.
    // 회원 가입 페이지에서 선택한 2단계 지역 정보를 세션에 저장
    
    	session_start(); // 세션 시작
    
    	$_SESSION['mb_2'] = $_POST['mb_2']; // 2단계 지역 정보 저장
  2. 회원 관리 페이지에서 세션에 저장된 2단계 지역 정보를 가져와서 해당 select 태그에 적용합니다.

</p>

<p><!-- 상세지역 select 태그 -->

<select name="mb_2" id="mb_2">

    <option value="">선택해주세요</option>

    <?php

    // 세션에서 2단계 지역 정보를 가져와서 선택한 옵션으로 표시

    session_start();

    $selected_mb_2 = $_SESSION['mb_2'];

    $mb_2_list = array();

    if ($mb_1_selected == "수도권") $mb_2_list = array("인천", "시흥", "동서울", "수원", "군포");

    elseif ($mb_1_selected == "강원") $mb_2_list = array("원주", "홍천", "대관령", "강릉", "양양");

    elseif ($mb_1_selected == "충북") $mb_2_list = array("진천", "충주", "엄정", "제천", "보은", "상주");

    elseif ($mb_1_selected == "대전충남") $mb_2_list = array("천안", "대전", "영동", "당진", "공주");

    foreach ($mb_2_list as $mb_2) {

        $selected = ($mb_2 == $selected_mb_2) ? " selected" : "";

        echo "<option value=\"$mb_2\"$selected>$mb_2</option>";

    }

    ?>

</select></p>

<p>

위와 같이 수정하면 회원 가입 시 선택한 2단계 지역 정보가 세션에 저장되고, 해당 페이지에서 세션에 저장된 정보를 가져와서 select 태그에 적용할 수 있습니다.

참고 : 챗GPT

로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

a
ablue
2년 전
답변 감사합니다.
적용해 보았는데 증상이 같네요.
저도 챗GPT를 이용해 봐야겠어요.

댓글을 작성하려면 로그인이 필요합니다.

작성하신것을 보면요 첫 select에 onchange 명령어로 - 바뀌면 categortChange를 실행시켜라 라고 하셨습니다. 두번째 select는 빈값이고요.

작성자님이 작성한데로 잘못된거 없이 나오는겁니다.

 

회원가입 후 내용을 보이고 싶으시다면 php로 추가 작성하셔야 합니다.

mb_1 값을 토대로 mb_2에 해당되는 도시를 나열 하시고 mb_2값과 같은것을 셀렉트 해둬라 라는

php를 추가 작성하셔야 합니다.

 

로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

a
ablue
2년 전
답변 감사합니다.
php로 추가 작성하라고 하셨는데 제가 잘 몰라서요 ㅠㅠ

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인