그누보드에 부트스트랩 적용 - (4)

상단 메뉴말고, 진짜 메뉴를 가지고 놀려고 관리자 페이지, 메뉴 설정에서 메뉴를 만들려고 보니, 페이지가 제대로 뜨지 않는다.

jquery 버전 문제인듯 싶어 최신버전으로 변경했던 jquery 버전을 다시 1.8.3 으로 돌려야했다.

head.sub.php에서...

<script src="<?php echo G5_JS_URL ?>/jquery-1.8.3.min.js"></script>

되돌려놓고 게시판을 몇개 만들고 메뉴도 만들었다.

그룹01

-게시판01

-게시판02

그룹02

-게시판03

요렇게 만들어놓고 테스트!

원래 소스에서 메뉴를 표시해주는 부분은 head.php 에 아래 부분이다.

<nav id="gnb">

        <h2>메인메뉴</h2>

        <ul id="gnb_1dul">

            <?php

            $sql = " select *

                        from {$g5['menu_table']}

                        where me_use = '1'

                          and length(me_code) = '2'

                        order by me_order, me_id ";

            $result = sql_query($sql, false);

            $gnb_zindex = 999; // gnb_1dli z-index 값 설정용

            for ($i=0; $row=sql_fetch_array($result); $i++) {

            ?>

            <li class="gnb_1dli" style="z-index:<?php echo $gnb_zindex--; ?>">

                <a href="<?php echo $row['me_link']; ?>" target="_<?php echo $row['me_target']; ?>" class="gnb_1da"><?php echo $row['me_name'] ?></a>

                <?php

                $sql2 = " select *

                            from {$g5['menu_table']}

                            where me_use = '1'

                              and length(me_code) = '4'

                              and substring(me_code, 1, 2) = '{$row['me_code']}'

                            order by me_order, me_id ";

                $result2 = sql_query($sql2);

                for ($k=0; $row2=sql_fetch_array($result2); $k++) {

                    if($k == 0)

                        echo '<ul class="gnb_2dul">'.PHP_EOL;

                ?>

                    <li class="gnb_2dli"><a href="<?php echo $row2['me_link']; ?>" target="_<?php echo $row2['me_target']; ?>" class="gnb_2da"><?php echo $row2['me_name'] ?></a></li>

                <?php

                }

                if($k > 0)

                    echo '</ul>'.PHP_EOL;

                ?>

            </li>

            <?php

            }

            if ($i == 0) {  ?>

                <li id="gnb_empty">메뉴 준비 중입니다.<?php if ($is_admin) { ?> <br><a href="<?php echo G5_ADMIN_URL; ?>/menu_list.php">관리자모드 &gt; 환경설정 &gt; 메뉴설정</a>에서 설정하실 수 있습니다.<?php } ?></li>

            <?php } ?>

        </ul>

    </nav>

gnb...

그누보드는 메뉴설정을 참고로 자동으로 드롭다운 메뉴를 만들어준다.

부트스트랩에 있는 nav 내에 드롭다운을 만드는 기능을 참고로 적용해주면 될거 같다.

아래는 부트스트랩 예제 코드다.

<ul class="nav navbar-nav">
        <li class="active"><a href="#">Link <span class="sr-only">(current)</span></a></li>
        <li><a href="#">Link</a></li>
        <li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Dropdown <span class="caret"></span></a>
          <ul class="dropdown-menu" role="menu">
            <li><a href="#">Action</a></li>
            <li><a href="#">Another action</a></li>
            <li><a href="#">Something else here</a></li>
            <li class="divider"></li>
            <li><a href="#">Separated link</a></li>
            <li class="divider"></li>
            <li><a href="#">One more separated link</a></li>
          </ul>
        </li>
      </ul>

ul 안에 li 를 class=dropdown 으로 해주고 그 아래에 주루루~ 넣어주는 형태다.

참고해서 수정한 소스는..

<nav class="navbar navbar-default">

<div class="container">

<ul class="nav navbar-nav">

<?php

$sql = " select *

from {$g5['menu_table']}

where me_use = '1'

 and length(me_code) = '2'

order by me_order, me_id ";

$result = sql_query($sql, false);

$gnb_zindex = 999; // gnb_1dli z-index 값 설정용

for ($i=0; $row=sql_fetch_array($result); $i++) {

$sql2 = " select *

from {$g5['menu_table']}

where me_use = '1'

 and length(me_code) = '4'

 and substring(me_code, 1, 2) = '{$row['me_code']}'

order by me_order, me_id ";

$result2 = sql_query($sql2);

$result2_cnt = mysql_num_rows($result2);

if ($result2_cnt == 0) { ?>

<li><a href="<?php echo $row['me_link']; ?>" target="_<?php echo $row['me_target']; ?>" ><?php echo $row['me_name'] ?></a></li>

<?php

} else { ?>

<li class="dropdown">

<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><?php echo $row['me_name'] ?></a>

<ul class="dropdown-menu" role="menu">

<?php

for ($k=0; $row2=sql_fetch_array($result2); $k++) { ?>

<li><a href="<?php echo $row2['me_link']; ?>" target="_<?php echo $row2['me_target']; ?>" ><?php echo $row2['me_name'] ?></a></li>

<?php

}

echo '</ul>'.PHP_EOL;

} ?>

</li>

<?php

}

if ($i == 0) {  ?>

<li id="gnb_empty">메뉴 준비 중입니다.<?php if ($is_admin) { ?> <br><a href="<?php echo G5_ADMIN_URL; ?>/menu_list.php">관리자모드 &gt; 환경설정 &gt; 메뉴설정</a>에서 설정하실 수 있습니다.<?php } ?></li>

<?php } ?>

</ul>

</div><!-- /.container -->

</nav><!-- /.navbar -->

흠..

jquery를 다시 2.1.3으로 변경해줘야 잘 동작을 한다.

게시판01 클릭하면 아래처럼 나오는데...그때부터 드롭다운이 동작하지 않는다.. 흑...

왜 바보가 되지???? 더 살펴봐야겠네..