Question

我目前正在开发一个用户导航侧面板，它是一个链接列表，我想知道的是：是否可以突出显示/强调用户重定向后所单击的列表项为所有视图使用相同的默认布局文件？我对CakePHP和MVC设计都很陌生，所以任何帮助都会非常感激。

Answer 1

您可以使用JavaScript执行此操作。这是一个例子。这是2.x但是没有理由不能在3.x中使用它

为简洁起见，我只提供了一个小菜单摘录

<强> Menu.ctp

<script>
    var controllerLocation = '<?php echo $this->params['controller']; ?>';
</script>

<div id="menuWrapper">
    <ul id="menuBar" class="topmenu">
        <input type="checkbox" id="css3menu-switcher" class="switchbox">
        <label onclick="" class="switch" for="css3menu-switcher"></label>
        <li class="topfirst">
            <?php
                echo $this->Html->link(
                    $this->Html->image('menu/contact_32.png', array('width' => '20', 'line-height' => '20'))
                    . ' ' . __('Contacts'),
                    array('controller' => 'contacts', 'action' => 'index'),
                    array('escape' => false, 'id' => 'menu-contacts'));
            ?>

        </li>
        <li class="topmenu">
            <?php
                echo $this->Html->link(
                    $this->Html->image('menu/asset_32.png', array('width' => '20', 'line-height' => '20'))
                    . ' ' . __('Assets'),
                    array('controller' => 'assets', 'action' => 'index'),
                    array('escape' => false, 'id' => 'menu-assets'));
            ?>
        </li>
        <li class="topmenu"><?php
                echo $this->Html->link(
                    $this->Html->image('menu/tasks.png', array('width' => '20', 'line-height' => '20'))
                    . ' ' . __('Tasks'),
                    array('controller' => 'tasks', 'action' => 'index'),
                    array('escape' => false, 'id' => 'menu-tasks'));
            ?>
        </li>
        ......
    </ul>
</div>

正如您所看到的，每个菜单元素都附加了一个特定的id，我还在javascript中声明变量以定义当前控制器。

接下来，我有一个javascript文件，用于检查当前控制器和操作，并添加一个按下该元素的类。

脚本文件

$(document).ready(function () {
    switch (controllerLocation) {
        case 'contacts':
            $("#menu-contacts").addClass("pressed");
            break;
        case 'assets':
            $("#menu-assets").addClass("pressed");
            break;
        case 'activities':
            $("#"+controllerLocation).addClass("pressed");
            break;
        case 'tasks':
            if(action == 'calendar_view'){
                $("#menu-calendar").addClass("pressed");
            }
            else $("#menu-tasks").addClass("pressed");
            break;
        case 'mailshots':
            $("#"+controllerLocation).addClass("pressed");
            break;
        case 'webrequests':
            $("#menu-web-requests").addClass("pressed");
            break;
        case 'opportunities':
            $("#"+controllerLocation).addClass("pressed");
            break;
        default:
            $("#admin").addClass("pressed");
    }
});

css中的pressed类为元素添加一个样式，使其看起来与其他元素不同

CSS文件

ul#menuBar li a.pressed {
    background-color: #ff920a;
    border-color: #ff920a;
}

您可以使用这些原则来应用于您自己的解决方案。这也可以在纯PHP中完成，但这是我实现的一个例子

Answer 2

您可以在控制器中为方法添加一个参数，指示单击了哪个链接并进行设置。像这样：

public ControllerMethod($clickedLink = null) {
    // controller logic
    $this->set(compact('clickedLink'));
}

如果您使用Cakephp Helper在控制器中执行了链接：

echo $this->Html->link('LinkName', array(($clickedLink == $idOfThisLink) ? 'class' => 'link-clicked' : '', 'controller' => 'ControllerName', 'action' => 'ActionName', 'linkId');

//在ActionName之后的linkId是单击链接时传递给控制器的参数

使用您喜欢的样式添加链接到您的css链接的类。

有没有办法以编程方式更改布局文件？

2 个答案: