[G4] 스킨에서 여분(추가)필드를 검색범위로 하는 3단계 검색예시 > 기술자료

• 목록
• 게시판 리스트 옵션
  • 검색

config.list_select.php를 적용스킨의 list.skin.php에 인클루드하시면 됩니다...

이하 config.list_select.php의 내용
--------------------------------------------------------------------------------------------
<script language="JavaScript">
<!--
    var sojaeji = new Array();

    sojaeji['대분류'] = '테니스,축구,농구,스키,수영,탁구,골프,육상,요가,윈드서핑,인라인스케이팅,볼링';
    sojaeji['테니스'] = '남구,북구,해운대구';
    sojaeji['테니스->남구'] = '월,화,수,목,금,토,일';
    sojaeji['테니스->북구'] = '월,화,수,목,금,토,일';
    sojaeji['테니스->해운대구'] = '월,화,수,목,금,토,일';
    sojaeji['축구'] = '남구,북구,해운대구';
    sojaeji['축구->남구'] = '월,화,수,목,금,토,일';
    sojaeji['축구->북구'] = '월,화,수,목,금,토,일';
    sojaeji['축구->해운대구'] = '월,화,수,목,금,토,일';
    sojaeji['농구'] = '남구,북구,해운대구';
    sojaeji['농구->남구'] = '월,화,수,목,금,토,일';
    sojaeji['농구->북구'] = '월,화,수,목,금,토,일';
    sojaeji['농구->해운대구'] = '월,화,수,목,금,토,일';
    sojaeji['스키'] = '남구,북구,해운대구';
    sojaeji['스키->남구'] = '월,화,수,목,금,토,일';
    sojaeji['스키->북구'] = '월,화,수,목,금,토,일';
    sojaeji['스키->해운대구'] = '월,화,수,목,금,토,일';
    sojaeji['수영'] = '남구,북구,해운대구';
    sojaeji['수영->남구'] = '월,화,수,목,금,토,일';
    sojaeji['수영->북구'] = '월,화,수,목,금,토,일';
    sojaeji['수영->해운대구'] = '월,화,수,목,금,토,일';
    sojaeji['탁구'] = '남구,북구,해운대구';
    sojaeji['탁구->남구'] = '월,화,수,목,금,토,일';
    sojaeji['탁구->북구'] = '월,화,수,목,금,토,일';
    sojaeji['탁구->해운대구'] = '월,화,수,목,금,토,일';
    sojaeji['골프'] = '남구,북구,해운대구';
    sojaeji['골프->남구'] = '월,화,수,목,금,토,일';
    sojaeji['골프->북구'] = '월,화,수,목,금,토,일';
    sojaeji['골프->해운대구'] = '월,화,수,목,금,토,일';
    sojaeji['육상'] = '남구,북구,해운대구';
    sojaeji['육상->남구'] = '월,화,수,목,금,토,일';
    sojaeji['육상->북구'] = '월,화,수,목,금,토,일';
    sojaeji['육상->해운대구'] = '월,화,수,목,금,토,일';
    sojaeji['요가'] = '남구,북구,해운대구';
    sojaeji['요가->남구'] = '월,화,수,목,금,토,일';
    sojaeji['요가->북구'] = '월,화,수,목,금,토,일';
    sojaeji['요가->해운대구'] = '월,화,수,목,금,토,일';
    sojaeji['윈드서핑'] = '남구,북구,해운대구';
    sojaeji['윈드서핑->남구'] = '월,화,수,목,금,토,일';
    sojaeji['윈드서핑->북구'] = '월,화,수,목,금,토,일';
    sojaeji['윈드서핑->해운대구'] = '월,화,수,목,금,토,일';
    sojaeji['인라인스케이팅'] = '남구,북구,해운대구';
    sojaeji['인라인스케이팅->남구'] = '월,화,수,목,금,토,일';
    sojaeji['인라인스케이팅->북구'] = '월,화,수,목,금,토,일';
    sojaeji['인라인스케이팅->해운대구'] = '월,화,수,목,금,토,일';
    sojaeji['볼링'] = '남구,북구,해운대구';
    sojaeji['볼링->남구'] = '월,화,수,목,금,토,일';
    sojaeji['볼링->북구'] = '월,화,수,목,금,토,일';
    sojaeji['볼링->해운대구'] = '월,화,수,목,금,토,일';

    function sidochange()
    {
        var f = document.fsearch_area;

        gugunview(f.sido.value);
        dongview(f.sido.value, f.gugun.value);
    }

    function gugunchange()
    {
        var f = document.fsearch_area;

        dongview(f.sido.value, f.gugun.value);
    }

    function dongview(sido, gugun)
    {
        var f = document.fsearch_area;

        f.dong.options.length = 1;
        f.dong.options[0].text = "가능종목(전체)";
        f.dong.options[0].selected = true;
        if (!sido || !gugun) {
            return;
        }

        sojae = sojaeji[sido+"->"+gugun].explode(",");
        //sojae = sojaeji[sido+"->"+gugun].split(",");
        f.dong.options.length = sojae.length+1;
        for (i=0; i<sojae.length; i++) {
            f.dong.options[i+1].value = sojae[i];
            f.dong.options[i+1].text = sojae[i];
        }
    }

    function gugunview(sido)
    {
        var f = document.fsearch_area;

        f.gugun.options.length = 1;
        f.gugun.options[0].text = "희망지역(전체)";
        f.gugun.options[0].selected = true;
        if (!sido) {
            return;
        }

        sojae = sojaeji[sido].explode(",");
        //sojae = sojaeji[sido].split(",");
        f.gugun.options.length = sojae.length+1;
        for (i=0; i<sojae.length; i++) {
            f.gugun.options[i+1].value = sojae[i];
            f.gugun.options[i+1].text = sojae[i];
        }
    }

    function sidoview()
    {
        var f = document.fsearch_area;

        f.sido.options.length = 1;
        f.sido.options[0].text = "교육가능일(전체)";
        sojae = sojaeji["대분류"].explode(",");
        //sojae = sojaeji["대분류"].split(",");
        f.sido.options.length = sojae.length+1;
        for (i=0; i<sojae.length; i++) {
            f.sido.options[i+1].value = sojae[i];
            f.sido.options[i+1].text = sojae[i];
        }
    }
function onChangeKey() {
var sido = document.fsearch_area.sido.value;
var gugun = document.fsearch_area.gugun.value;
var dong = document.fsearch_area.dong.value;

if (sido == "" && gugun == ""&& dong == "") {
alert("유형을 선택하세요!!");
return false;
} else {
if (gugun == "전체")  {
document.fsearch_area.stx.value = sido;
} else {
  if (gugun == "전체"&& dong == "전체")  {
document.fsearch_area.stx.value = sido + " " + gugun;
}else {
document.fsearch_area.stx.value = sido + " " + gugun + " " + dong;
}
}
document.fsearch_area.submit();
}
}
//-->
</script>

<script language="JavaScript" src='./sojaeji.js'></script>
<table cellpadding=0 cellspacing=0 border=0>
<form name=fsearch_area method=get>
<input type=hidden name=bo_table value="<?=$bo_table?>">
<input type=hidden name=sca value="<?=$sca?>">
<input type=hidden name=sfl value="wr_6||wr_7">
<tr>
    <td>+ 분류검색 :

<select name=sido onchange="sidochange()"></select>

<select name=gugun onchange="gugunchange()"></select>

<select name=dong></select>
<input type=image src="<?=$board_skin_path?>/img/search_btn.gif" border=0 align=absmiddle onClick="onChangeKey();return false;">
<input type=hidden name=sop value='and'>
<input type=hidden name=stx value=''>
    </td>
</tr>
</form>
</table>
<?
 if ($srch_type != "") { $stx = ""; }
?>
<script language="JavaScript">
<!--
    sidoview();
    gugunview("");
    dongview("", "");
//-->
</script>
--------------------------------------------------------------------------------------------

관리자님의 우편번호를 이용한 소재지 셀렉트 박스..
http://www.sir.co.kr/bbs/board.php?bo_table=g4_tiptech&wr_id=5435
yesmoa님의 스킨에서 다중 셀렉트문 구현..
(3단계 검색이 적용되어 있으나 시도구군을 포함한 스크립트라서 우편번호가 아닌 다른 필드로의 커스터마이징이 용이하지 않음)
http://www.sir.co.kr/bbs/board.php?bo_table=g4_tiptech&wr_id=811
에서 힌트를 얻었습니다만 사실 짜깁기에 불과 합니다...

스킨의 목록(list.skin.php)에서
여분필드를 활용한 3단계 분류검색시의 예시이며...
수정을 가하면 카테고리 확장에 의한 3단계분류도 가능할것으로 보입니다...

위의 예에서 각각..
대분류는 해당종목(여분필드 wr_6 쪼갠값1)
중분류는 가능지역(여분필드 wr_7 쪼갠값)
소분류는 교육가능일(여분필드 wr_6 쪼갠값2)
에 대응되며...

검색범위는  wr_6,wr_7에만 한정해도 충분함으로
<input type=hidden name=sfl value="wr_6||wr_7">
로 검색범위를 한정..
만일 여분필드를 쪼개지 않고 입력값으로 wr_6, wr_7, wr_8을 그대로 사용하여 3단계로 나눈다면 검색범위는
<input type=hidden name=sfl value="wr_6||wr_7||wr_8">
로 잡아 주시면 됩니다...

분류 데이터명을 직접 일일이 다 써줘야 한다는 애로사항이 있긴합니다만 나름대로 쓸만하다고 봅니다...



출처 : 시그너스 님 ( http://sir.co.kr/bbs/board.php?bo_table=g4_tiptech&wr_id=7961 )