CodeIgniter 日历/计划应用程序、结构化和执行

Question

这个项目真的让我失眠了。我整天都在想它，我在晚上做梦，当我睡着的时候我会再想它。真的让我快哭了，哈哈。我不知道如何构建我的应用程序，也不知道如何执行我的想法。

首先，简单介绍一下。我学习交互式多媒体设计，我有一门课程叫做“项目”。顾名思义，我们必须考虑并创建一个项目，更具体地说是一个 Web 应用程序，使用 PHP、HTML/CSS、MySQL、AJAX ......无论我们想使用什么技术。由于我们也需要在一定程度上挑战自己，所以我决定为这个项目学习和使用 CodeIgniter 框架。我们必须向我们的教授展示我们能够取得的成就。 （不过，不会部署或使用此应用程序。它只是一个展示。）

我将创建一个网络应用程序，一个学生日历/计划器。他们可以跟踪他们的课程和家庭作业、空闲时间等。这是我想要实现的目标的屏幕截图：

我已经扔掉了滑块并通过对下一个/上一个按钮使用 AJAX 请求来解决此问题。可以看到最新版的网站here。

但是，我对我的代码不满意。我对我正在做的事情不满意。老实说，我很困惑。我完全糊涂了。

我读过关于 CodeIgniter 和 MVC 模型的博客、书籍、网站；我对 PHP 有相当的了解，并且很快就掌握了这个框架。但是还是很迷茫。

我首先编写了我的login form。都好。我有一个登录控制器，带有一个 index() 函数，一个 go() 函数，它专注于表单验证（使用 form_validation 库）和设置会话。它通过 AJAX 处理错误消息并通过我的登录模型与数据库通信。我想这很好地遵循了 MVC 模式。

不过，实际的“计划者”页面是完全不同的故事。我想知道的第一件事是我是否可以从视图中使用/调用函数。如果我遵循 MVC 指南，我会说我不能。所以我现在正在做的是将所有数据堆叠在我的控制器中的 $data 数组中，然后通过 jQuery AJAX 调用将这些数据直接回显到我的网页中。

这提出了我的第一个非常简单的问题。这个可以吗？我主要关心的一个问题当然是没有启用 javascript 的用户。该应用程序根本不起作用。我读过关于优雅降级和渐进增强的文章，但我只是不确定这个应用程序是否可以在没有 JS 的情况下使用。

我不确定（AJAX 方面）的另一件事是，我在 $(document).ready 上有两个不同的 AJAX 调用，然后当用户单击不同的元素时又像另外四个一样。 jQuery .html() 实际上并没有将内容放在我的 html 标签中（当我查看源代码时），这也让我感到困扰。

顶部的日期列表由名为init_days() 的函数生成。我使用 $(document).ready() AJAX 调用之一填充列表。它工作正常，但功能非常混乱。在控制器中，我创建了一个数组 $data 并将整个列表（带有 html 标签）回显到 $data['calendar']；然后我将其直接输出到<ul> 标签中：

    // populate initial calendar
    $.ajax(
    {
        type: "POST",
        url: "/planner/init_days",
        success: function(data){
            $("#days_loader").hide();
            $(".month").prepend(data['month_name'] + " " + current_year);
            $("#day_list").html(data['calendar']).fadeIn();
        }
    });

但是，当使用下一个和上一个按钮时，我会调用相同的函数，只是使用data: 选项来提交新的月份（如果需要，还可以提交年份）。这对我来说似乎有点多余；将（几乎）相同的代码放置三遍。不知道如何解决这个问题。

我的主要问题是我现在陷入困境的部分。我有那些“糟糕，4 月 20 日”的表格标题，但在下面我需要获取我的实际事件。我不确定创建此功能的最佳方法是什么。我应该把它放在桌子上吗？但是，我如何将某些事件放在正确的位置？目前，我所实现的只是一个函数，它将某一天的所有事件输出到一个数组中，如下所示：

Array ( [0] => Array ( [id] => 1 [title] => Test Event [description] => Dit is een test event. [day_start] => 2011-04-20 [day_end] => 2011-04-20 [user_id] => 1 [time_start] => 11 [time_end] => 12 ) [1] => Array ( [id] => 2 [title] => Test Event 2 [description] => Dit is een tweede event. [day_start] => 2011-04-20 [day_end] => 2011-04-20 [user_id] => 1 [time_start] => 12 [time_end] => 13 ) )

我不确定桌子是否是最好的选择。困扰我的主要事情是我的工作时间和所有这些不同的时间在页面上都有自己的位置，如果这有意义的话。 （就像上午 9 点会在列的顶部，晚上 11 点会在底部，duh）。

如果有人想看看我的烂摊子，也许想再次让我走上正轨，我愿意提供一个指向我的源代码 (github) 的链接。也许我在正确的轨道上，仍然；我只是不这么觉得。我被困在显示事件部分，我只是觉得很可怕，因为我对我写的东西不满意（尽管此时大部分内容都有效）。

由于我现在在复活节假期，我无法再联系我的老师一周，所以我愿意提供 100-150 代表的赏金，以获得对这个巨大的咆哮/问题的良好、有用的回答.

如果有任何我应该阅读的关于设计模式、MVC、CodeIgniter 和 PHP 最佳实践的书籍、网站、博客，也请提供。非常感谢。

如果您到了这一点，感谢您一路阅读。我很感激。

编辑：我的源代码在这里：https://github.com/cabaret/Studieplanner

PS：这个问题是my previous question. 的后续问题，从那以后我已经向前迈出了很多步，但我仍然不开心并且非常困惑，主要是。感谢您的帮助。

Answer 1

好吧，让我看看我能不能把它分解成碎片来帮助你。

首先不清楚你的术语的一致性，所以我将在这里建立一个小词汇表，所以我确定你明白我的意思：

• 请求生命周期 通过您的应用程序的整个 HTTP 请求。 Ajax 调用是生命周期，页面加载是生命周期，一旦发送文档并关闭连接，生命周期就结束了。
• 控制器负责控制请求生命周期通过您的网站执行的代码。
• 查看任何页面/请求的实际输出代码。这是application/views 中的代码，几乎在每次有请求生命周期时都会用到（可能除了重定向和ajax）。
• 客户端代码 页面加载后发生的 Javascript 逻辑。 Ajax 调用由客户端代码进行。

我会有点乱七八糟地回答你的问题，所以请耐心等待：

---

这提出了我的第一个非常简单的问题。这个可以吗？我主要关心的一个问题当然是没有启用 javascript 的用户。该应用程序根本不起作用。我读过关于优雅降级和渐进增强的文章，但我只是不确定这个应用程序在没有 JS 的情况下是否可行。

事实是，Javascript 是我们现在所说的“Web 应用程序”的一个非常内在的部分。 Web 应用程序和网站之间的区别在于前者是智能的。大多数站点通常只处理请求并显示相关数据，应用程序通常会根据输入做出决策、更新系统状态并修改输出。

您似乎正在构建的东西我会归类为网络应用程序。

我不相信今天的 HTML5（有点）时代和今天的 Facebook 和 youtube 要求使用 javascript 来使用 Web 应用程序是不合理的。

现在禁用 javascript 的人通过 AdBlock 和 NoScript 之类的插件来执行此操作，这些插件通常允许您有选择地禁用某些东西。解决此问题的最佳方法是将您的 javascript 分成易于识别的组件，以便用户知道允许哪些脚本。

示例

• Site.js - 负责网站的功能和运营。
• Ads.js - 负责您的广告

您无法阻止人们屏蔽您的广告，如果您尝试，他们通常不会使用您的服务。 （假设您计划投放广告）

因此，构建您的优雅降级以通知您的用户您的应用程序需要 JavaScript 才能运行，您甚至可以让他们知道需要哪些文件来帮助简化流程。

---

不过，实际的“计划者”页面是完全不同的故事。我想知道的第一件事是我是否可以从视图中使用/调用函数。如果我遵循 MVC 指南，我会说我不能。所以我现在正在做的是将所有数据堆叠在我的控制器中的 $data 数组中，然后通过 jQuery AJAX 调用将这些数据直接回显到我的网页中。

要记住的关键是：MVC 是指南，而不是规则。虽然最好坚持您的系统，但您必须在相关的地方应用它。您可能不应该从 视图 中提取数据库记录，但是当出现一些开箱即用的情况时，它会给您留下两个选择：

1. 在有意义的地方稍微打破范式（有充分的理由）
2. 重构您的系统以适应范例

一个很好的例子：可重复使用的小部件块，例如标签云或最近的帖子块

底线是您可能不希望在每个控制器函数的每个$this->load->view 中继续向$this->load->vars(...) 提供数据，甚至更糟。

一种方法是重新设计你的系统，这样你就有一个公共主题库负责收集公共信息并提供它，然后传递你的视图数据 ($this->load->view("someview", array(),true ) 会将您的视图呈现为字符串而不是页面）。

另一种方法是设计一个具有简单工作的特殊视图，使用模型加载相关数据（如果可以缓存）并显示它。就像一个小部件，或者自包含的东西。 这会破坏 MVC，但您需要检查我们使用 MVC 的原因。关键是视图不应该负责实现，这样你可以换出视图并且控制器逻辑保持不变。这适用吗？这可能是一个高度视图实现特定的组件，控制器可能不知道它需要此信息。因此，如果您保留一个句柄并标记它，以便记住它对自己负责，您应该能够很好地适应它。

---

我不确定的另一件事（AJAX 方面）是我在 $(document).ready 上有两个不同的 AJAX 调用，然后当用户单击不同的元素时又像另外四个一样。 jQuery .html() 实际上并没有将内容放在我的 html 标记中（当我查看源代码时），这也让我感到困扰。

这听起来像是您试图在客户端代码中做太多事情。 view 可以提供任何这些 ajax 调用@start 吗？

当用户点击内容时有四个 ajax 调用？大多数点击代表一个动作，通常只需要一个 ajax 就足够了，如果您需要处理响应并请求更多信息，可能需要两个，但很少有更多。

$.fn.html(...) 在 jQuery 中将第一个参数放在所选元素中。如果您要替换 整个页面 的 HTML（不推荐，永远......这应该是页面加载）。你可以这样称呼：

var theHtmlToPutInPage = "... whatever ...";
$("body").html(theHtmlToPutInPage);

---

我现在陷入困境的主要问题是天底下的部分。我有那些“糟糕，4 月 20 日”的表格标题，但在下面我需要获取我的实际事件。我不确定创建此功能的最佳方法是什么。我应该把它放在桌子上吗？但是，我如何将某些事件放在正确的位置？目前，我所实现的只是一个函数，它将某一天的所有事件输出到一个数组中，如下所示：

有很多方法可以解决这个问题。您可以将整个事情构建为一个时间块的大表，但这可能会变得相当混乱。 此外，表格很讨厌，There 写得很好 many articles 何时何地使用表格。

您可以使用 CSS Div 将视觉效果设置为统一的网格，并使用 position: absolute 将约会浮动到顶部并通过您的 客户端代码 (javascript) 进行控制。

这是您项目中相当复杂的部分，有很多答案，我没有时间在这里深入探讨任何解决方案，您只需要原型和实验即可。

---

如果有人想看看我的烂摊子，也许想再次让我走上正轨，我愿意提供一个指向我的源代码 (github) 的链接。也许我在正确的轨道上，仍然；我只是不这么觉得。我被困在显示事件部分，我只是觉得很可怕，因为我对我写的东西不满意（尽管目前大部分内容都有效）。

我愿意查看并提供建议，我相信这里的其他人也会这样做。

由于我现在在复活节假期，我无法再联系我的老师一周，所以我愿意提供 100-150 代表的赏金，以获得对这个巨大的咆哮/问题的良好、有用的回答.

通常应使用赏金作为激励因素，以正确回答您的问题。那种让人们深入了解的东西（也许像这个答案，它现在变得很长了）。

欢迎您提供赏金，这是您的代表，但不要觉得您必须提供赏金。如果这个答案令人满意（或者其他人可能发布的任何其他答案，只需接受一个答案就足够了）。

---

总结和最终想法

好的，所以在写这个可怕的答案的过程中（它还算作中篇小说吗？）我想我可能已经推断出你可能出错的地方。这可能是设计使然，但也可能是偶然的。

我认为您可能会将视图误认为客户端代码。当我们谈论 MVC 时，我们并不一定意味着它应该都是通过 ajax 加载的，并且视图是运行在客户端浏览器上的 javascript 和 dom。

如果不是这样，请忽略最后一段。

听起来你的职责权重有误。看起来您将过多的应用程序任务分配给 javascript。页面加载不是魔鬼，ajax 很流行，但通常可以是Too Much。你必须找到最适合你的应用程序。通过将更多责任分配给视图而不是客户端代码，您似乎可以从简化问题中受益。

我希望这个答案对你有所帮助，抱歉我花了这么长时间才发布这个问题，我在你发布它时看到了你的问题，但当时没有时间深入探讨。