CodeIgniter 3.x - 使用用户输入重新加载具有不同 CSS 文件的视图答案

【问题标题】：CodeIgniter 3.x - Reload View with Different CSS File Using User InputCodeIgniter 3.x - 使用用户输入重新加载具有不同 CSS 文件的视图
【发布时间】：2017-05-23 01:26:13
【问题描述】：

问题：

我创建了一个静态页面视图（在它自己的视图文件夹中）来演示新的 Sakura.css 框架。该框架带有四个 CSS 主题。我希望能够从链接列表中选择一个主题，并通过控制器使用关联的 CSS 主题文件重新加载相同的视图。 我还需要将视图默认为“standard.css”主题。最后，我想避免使用 JavaScript/jQuery 解决方案。

我很难掌握控制器函数名称、自定义路由和 URI 之间的关系。我想我正处于“啊哈”时刻的边缘，找到解决这个问题的方法肯定会有所帮助。

当前代码：

注意：我还设置了 .htaccess 以从 URL 中删除 index.php。

views/sakura/index.php

<!DOCTYPE html>

<html lang="en-us">
<head>
    <meta charset="utf-8">
    <title>Sakura Demo</title>

    <link rel="stylesheet" href="<?php echo asset_url() ;?>css/<?php echo $theme; ?>.css" media="screen" />
</head>
<body>
<header>
    <nav>
        <ul>
            <li><a <?php if (isset($theme) && ($theme = 'standard')) { echo 'class="current"'; } ?>href="<?php echo base_url('sakura/standard'); ?>">Standard</a></li>
            <li><a <?php if (isset($theme) && ($theme = 'dark')) { echo 'class="current"'; } ?>href="<?php echo base_url('sakura/dark'); ?>">Dark</a></li>
            <li><a <?php if (isset($theme) && ($theme = 'earthly')) { echo 'class="current"'; } ?>href="<?php echo base_url('sakura/earthly'); ?>">Earthly</a></li>
            <li><a <?php if (isset($theme) && ($theme = 'vader')) { echo 'class="current"'; } ?>href="<?php echo base_url('sakura/vader'); ?>">Vader</a></li>
        </ul>
    </nav>
</header>

<main>
    <h1>Sakura.css Demo</h1>
    <p>Sakura.css is a minimal css framework/theme that can be dropped into any project for an instantaneous modern-looking website.</p>
</main>

<footer>
    <p>Footer Text</p>
</footer>
</body>
</html>

控制器/Sakura.php

<?php
class Sakura extends CI_Controller {

    public function theme($theme)
    {
        $data['theme'] = array(
            'standard' => "standard",
            'dark' => "dark",
            'earthly' => "earthly",
            'vader' => "vader"
        );

        $this->load->view('sakura/theme', $data);
    }
}

config/routes.php

<?php
$route['sakura/(:any)'] = 'sakura/$1';
$route['sakura'] = 'sakura';
$route['default_controller'] = 'pages/view';
$route['404_override'] = '';
$route['translate_uri_dashes'] = FALSE;

我能够加载视图的唯一方法是在 Sakura.php 控制器中使用这个函数：

public function index()
{
    $data['theme'] = "standard";

    $this->load->view('sakura/index', $data);
}

所需的 URL 结构：

默认视图：mywebsite.com/sakura/ -或- mywebsite.com/sakura/standard

主题视图：mywebsite.com/sakura/selected-theme

最后的想法：

在此先感谢大家对此问题的任何帮助。我经常依赖 StackOverflow 社区，我非常感谢为解决我的问题所花费的时间和考虑。

【问题讨论】：

标签： php codeigniter codeigniter-3

【解决方案1】：

只是一个猜测，但尝试类似...？

控制器

$css = $this->uri->segment(2);
$allowed_input = array('standard', 'dark', 'earthly', 'vader');
if ((isset($css)) && (!in_array($css, $allowed_input))) {
    echo 'Filthy human!';
}

$data['css'] = $css; // You can probably just do this above, it's just harder to type.

查看

<link rel="stylesheet" href="<?php echo asset_url() ;?>css/<?php echo (!isset($css) ? 'standard' : $css);?>.css" media="screen" />

路线

将第一行改为：

$route['sakura/(:any)'] = 'sakura/index/$1';

然后 mywebsite.com/sakura/standard 应该可以工作，但如果“标准”位不存在，它将默认加载标准。加入 in_array() 位作为一个小的健全性检查，但您可能希望在验证中更加彻底。

【讨论】：

它不起作用，但我也不知道我是否应该将它放在 index() 方法中。页面加载，但 $css 变量未设置，也不默认为标准。
控制器代码将进入 index() 方法。此外，由于您隐藏了索引，URI 段可能是 1 而不是 2？如果直接从控制器回显 $css，它会提供任何其他信息吗？
回显 $css 变量对加载的视图没有影响。当我单击任何主题链接时，我得到一个 404。URI 结构读取 sakura/theme ，因此它似乎工作正常。
我并不是说它应该对加载的视图产生影响，我只是好奇它是否被设置在控制器中。你在加载 uri 助手吗？ ($this->load->helper('uri'))
不，我以为我自动加载了它。我现在让它自动加载，但是除了 vader 之外的所有主题链接都返回 404，并且 css 没有加载。你第一次是对的，段必须是 2。现在回显 $css 回显主题名称。多么奇怪。

【解决方案2】：

我认为你不需要处理路由来实现它。这就是我将如何解决它：

控制器（Sakura.php）

class Sakura extends CI_Controller {

    public function index()
    {
        $this->load->view('welcome_message');
    }

    public function theme($theme='standard') {
        $data['theme']=$theme;
        $data['main_content'] = 'sakura/sakura_view';
        $this -> load -> view('sakura/sakura_view', $data);
    }
}

请注意，我使用了public function theme($theme='standard')，因此如果在第三个 URI 段上没有定义参数，则默认为标准。

查看（views/sakura/sakura_view.php）

<!DOCTYPE html>

<html lang="en-us">
<head>
    <meta charset="utf-8">
    <title>Sakura Demo</title>

    <link rel="stylesheet" href="<?php echo asset_url() ;?>css/<?php echo $theme; ?>.css" media="screen" />
</head>
<body>
<header>
    <nav>
        <ul>
            <li><a <?php if (isset($theme) && ($theme = 'standard')) { echo 'class="current"'; } ?>href="<?php echo base_url('sakura/standard'); ?>">Standard</a></li>
            <li><a <?php if (isset($theme) && ($theme = 'dark')) { echo 'class="current"'; } ?>href="<?php echo base_url('sakura/dark'); ?>">Dark</a></li>
            <li><a <?php if (isset($theme) && ($theme = 'earthly')) { echo 'class="current"'; } ?>href="<?php echo base_url('sakura/earthly'); ?>">Earthly</a></li>
            <li><a <?php if (isset($theme) && ($theme = 'vader')) { echo 'class="current"'; } ?>href="<?php echo base_url('sakura/vader'); ?>">Vader</a></li>
        </ul>
    </nav>
</header>

<main>
    <h1>Sakura.css Demo</h1>
    <p>Sakura.css is a minimal css framework/theme that can be dropped into any project for an instantaneous modern-looking website.</p>
</main>

<footer>
    <p>Footer Text</p>
</footer>
</body>
</html>

【讨论】：