2010-07-28 5 views
6

CodeIgniter를 처음 접하면서도 여전히 MVC 방식을 고수하고 있습니다. 난 그냥이 문제를 해결하는 가장 좋은 방법은 무엇 궁금하네요 : 내가 지금처럼 현재 활성화 된 링크를 강조 내 네비게이션 바있어 CodeIgniter : 사용자가 현재 접속중인 페이지의 링크를 '강조 표시'하는 방법은 무엇입니까?

: 내가 ID를 원하는 blog.html에 갈 때, 이제

<a href="index.hml" id="active">Index</a> 
<a href="blog.hml">Blog</a> 

을 = 그에 따라 이동하는 "활성". 보통 나는 각 링크에 변수를 할당하고 다음은 'ID = "활성'. 은 어떻게 든 내가 그 가장 좋은 방법은 생각하지 않습니다. 어떤 생각에 가치를의 설정 것?

업데이트 (12 년 9 월을 2012) 나는 Kohana로 이동하여이 목적으로 완전히 만들어진 모듈을 확장했다. 이제 메뉴 배열을 config 배열로 지정하고 강조 표시가 자동으로 수행되어야한다. 모듈은 here이다.

답변

5

우선이다 다음을 부여 할 수 있습니다 페이지의 각 DOM 요소에 대한 고유 한 식별 번호. 무엇을 위해서, 우리는 클래스를 사용하는 것이 가장 좋습니다.

코드 이그니 터 (Code Igniter)는 이전에 "URL 세그먼트"에 대해 들어봤을 때 많은 도구와 툴을 제공합니다.

$ this-> uri-> 세그먼트 (N)

허가 특정 세그먼트를 검색 할 수 있습니다. 여기서 n은 검색하려는 세그먼트 번호입니다. 세그먼트는 왼쪽에서 오른쪽으로 번호가 지정됩니다.

http://example.com/index.php/news/local/metro/crime_is_up

세그먼트 번호는이 될 것이다 : 예를 들어, 전체 URL이있는 경우

  1. 뉴스
  2. 지역
  3. 지하철
  4. crime_is_up

http://codeigniter.com/user_guide/libraries/uri.html

당신은 당신이 실제로 브라우저에 표시되는 활성 페이지를 나타내는 현재 URL 세그먼트를 검색하는 것을 사용할 수 있습니다.

+1

-1. 왜 서버 측 솔루션이 쉬운 지 JavaScript를 사용하는 이유는 무엇입니까 (Paul Dragoonis 응답 참조)? –

+0

localhost에서 Paul의 더 짧은 형식을 사용할 수 없기 때문에 작동합니다. 여전히 'old anroots

+1

내 방법이 여전히 적용됩니다. 앱 구성 방법에 따라 'uri'개체를 사용하여 CI에서 $ pageName을 가져와야합니다. –

7

CI와 관련이 없습니다. 이것은 논리적으로 현재 페이지 이름을 다시 검사합니다.

당신은

$pageName = 'blog.html'; 

로 CI에서 페이지 이름을 얻을 때 그런 다음

이, ID가 당신이 일의 종류에 대한 ID를 사용하지 않아야 모든
<a href="index.html" <?php echo $pageName == 'index.html' ? 'id="active"' : ''; ?>>Index</a> 
<a href="blog.html" <?php echo $pageName == 'blog.html' ? 'id="active"' : ''; ?>>Blog</a> 
+1

. 하지만, 현재'id = "active"가 아닌'class = "active"를 사용하는 것이 일반적인 관행 인 것 같습니다. –

0

나는 위에서 언급 한 내용을 보았을 때 조금 더 콤팩트 한 것을 찾고 있다고 생각했습니다. Codeigniter에는 기본적으로 이와 같은 기능이 없지만 쉽게 작성할 수 있습니다. 이것은 내가 지금 함께 맺은 것일 뿐이지 만, 당신이 갖고 싶어하는 것일 수도 있습니다.

먼저, 설명서의 URL 도우미를 살펴보십시오. http://codeigniter.com/user_guide/helpers/url_helper.html

앵커 기능을 자세히 살펴보고 사용법을 이해하십시오. 이 도우미, HTML 도우미 및 양식 도우미를 사용하는 습관이 있어야합니다. 그것은 당신의 견해를 향상시킬 것입니다. 모든 도우미는 시스템 폴더에서 사용할 수 있습니다. 내가 한 일은 URL 도우미를 열고 앵커 코드를 복사 한 다음 응용 프로그램의 도우미 폴더에 자체 헬퍼 파일을 만들었습니다. 매뉴얼에서 직접 헬퍼를 만들고 자동로드하는 방법에 대해 자세히 읽을 수 있습니다.

그런 다음 몇 가지 사항을 변경했습니다. 최종 결과는 다음과 같습니다 당신이 볼 수 있듯이

if (! function_exists('menu_anchor')) 
{ 
    function menu_anchor($uri = '', $title = '', $attributes = '') 
    { 
     $title = (string) $title; 

     if (! is_array($uri)) 
     { 
      $site_url = (! preg_match('!^\w+://! i', $uri)) ? site_url($uri) : $uri; 
     } 
     else 
     { 
      $site_url = site_url($uri); 
     } 

     if ($title == '') 
     { 
      $title = $site_url; 
     } 

     if ($attributes != '') 
     { 
      $attributes = _parse_attributes($attributes); 
     } 

    $attributes .= ($site_url == current_url()) ? ' selected' : ''; 

     return '<a href="'.$site_url.'"'.$attributes.'>'.$title.'</a>'; 
    } 
} 

, 그것은 단지 하나 개의 라인 변경은 다음과 같습니다. $ 속성 = ($의 SITE_URL == current_url을())? 'selected': '';

기본적으로 검색된 페이지의 URL이 앵커가 링크 된 papge와 일치하면 선택한 클래스를 추가합니다. 선택된 링크를 특정 위치에 링크하지 않으려면 $ site_url을 # 또는 다른 값으로 설정하여이 링크를 쉽게 수정할 수 있습니다.

3

@Calle 예제를 사용하여 실제로 잘 작동했습니다 ... .htaccess를 사용하여 index.php 파일을 무시하고 있기 때문에 CI current_url() 대신 사용자 지정 URL 그래버를 사용해야했습니다. 올바른 속성 태그도 추가했습니다. 내가 this->로드 -> 도우미 ('메뉴') 'menu_helper.php'라는 '도우미'에서이 파일을 상자에 포장 및 컨트롤러 $ 통해로드 초보자 에 대한

참고;

도우미/menu_helper.php

if (! function_exists('menu_anchor')) 
{ 
    function menu_anchor($uri = '', $title = '', $attributes = '') 
    { 
     $title = (string) $title; 

     if (! is_array($uri)) 
     { 
      $site_url = (! preg_match('!^\w+://! i', $uri)) ? site_url($uri) : $uri; 
     } 
     else 
     { 
      $site_url = site_url($uri); 
     } 

     if ($title == '') 
     { 
      $title = $site_url; 
     } 

     if ($attributes != '') 
     { 
      $attributes = _parse_attributes($attributes); 
     } 

     $current_url = (!empty($_SERVER['HTTPS'])) ? "https://".$_SERVER['SERVER_NAME'].$_SERVER['REQUEST_URI'] : "http://".$_SERVER['SERVER_NAME'].$_SERVER['REQUEST_URI']; 
     $attributes .= ($site_url == $current_url) ? 'class="active"' : 'class="normal"'; 


     return '<a href="'.$site_url.'"'.$attributes.'>'.$title.'</a>'; 
    } 
} 

뷰 파일 :

<ul class="topnav love"> 
    <li class="topnav-1"><?=menu_anchor(base_url()."path/to/something", "menu_item")?></li> 
    <li class="topnav-2"><?=menu_anchor(base_url()."path/to/something", "menu_item")?></li> 
    <li class="topnav-3"><?=menu_anchor(base_url()."path/to/something", "menu_item")?></li> 
    <li class="topnav-4"><?=menu_anchor(base_url()."path/to/something", "menu_item")?></li> 
    <li class="topnav-5"><?=menu_anchor(base_url()."path/to/something", "menu_item")?></li> 
</ul> 

는 CSS :

ul.topnav li.topnav-1. 활성 { 뭔가 똑똑한 }

+0

이것은 나를 위해 완벽하게 작동했습니다. 그냥 '[helpers']에서 자동로드 파일의 메뉴를 설정해야한다고 추가하고 싶었습니다. 고마워 친구 (ette)! –

3

나는 아래의 코드를 사용합니다 - 건배!

<?php echo ($this->uri->segment(1)=='dashboard' && $this->uri->segment(2)=='')? 'active' : ''; ?> 
관련 문제