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

Question

这个项目实际上让我失眠.我整天想着它,我在晚上梦见它,当我躺着醒来时,我会考虑更多.哈哈,这真让我到了哭泣的地步.我不知道如何构建我的应用程序,我不知道如何执行我的想法.

首先,简要介绍一下.我学习交互式多媒体设计,我有一门名为"项目"的课程.顾名思义,我们必须使用PHP,HTML/CSS,MySQL,AJAX,以及我们想要使用的任何技术来思考和创建项目,更具体地说是Web应用程序.由于我们还必须在一定程度上挑战自己,所以我决定学习并使用CodeIgniter框架来完成这个项目.我们必须向教授们展示我们能够取得的成就.(但是这个应用程序不会被部署或使用.它只是一个展示.)

我将为学生创建一个Web应用程序,一个日历/计划器.他们可以跟踪他们的课程和家庭作业,空闲时间等.这是我想要实现的截图:

我已经抛出了滑块,并通过使用下一个/上一个按钮的AJAX请求来修复它.您可以在此处查看最新版本的网站.

但是,我对我的代码不满意.我对我正在做的事情不满意.说实话,我很困惑.我绝望地感到困惑.

我读过关于CodeIgniter的博客,书籍,网站,关于MVC模型; 我对PHP有相当不错的知识,我很快就选择了这个框架.但仍然如此困惑.

我开始编写登录表单.都好.我有一个登录控制器,带有一个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:这个问题是我上一个问题的后续问题.从那时起我已经采取了很多步骤,但我仍然感到非常不开心和困惑.我感谢任何帮助.

Answer 1

好吧,让我看看我是否可以把它分解成碎片并帮助你.

首先,你的术语是否一致尚不清楚,所以我将在这里建立一个小词汇表,所以我确信你理解我的意思:

• 请求生命周期通过您的应用程序的整个HTTP请求.Ajax调用是生命周期,页面加载是生命周期,一旦文档被发送并且连接关闭,生命周期就结束了.
• 控制器代码负责通过您的网站控制请求生命周期的执行.
• 查看任何页面/请求的实际输出代码.这是代码application/views,实际上每次都有一个请求生命周期(可能重定向和ajax除外).
• 客户端代码加载页面后发生的Javascript逻辑.Ajax调用由客户端代码完成.

我会稍微回答你的问题,所以请耐心等待:

这提出了我的第一个,一个荒谬简单的问题.这个可以吗？我主要担心的当然是没有启用javascript的用户; 应用程序根本不起作用.我已经阅读过关于优雅降级和渐进增强的内容,但我不确定这个应用程序是否可以在没有JS的情况下使用.

在这件事的事实是,JavaScript是的我们称之为"Web应用程序"现在相当固有的一部分.Web应用程序和Web站点之间的区别在于前者是智能的.大多数站点通常只处理请求并显示相关数据,但应用程序通常会做出决策,更新系统状态并根据输入修改输出.

您似乎正在构建的内容我将归类为Web应用程序.

我不相信HTML5(有点)的这个时代,今天的facebook和youtubes,要求使用javascript来使用Web应用程序是不合理的.

如今,禁用这些javascript的人通过AdBlock和NoScript这样的插件来执行此操作,这些插件通常允许您有选择地禁用内容.解决这个问题的最佳方法是将您的javascript分成易于识别的组件,以便用户知道允许哪些脚本.

例

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

如果您尝试通常不会使用您的服务,则无法阻止他人屏蔽您的广告.(假设你计划广告)

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

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

要记住的关键是: MVC是指导而非规则.虽然最好坚持使用您的系统,但您必须将其应用于相关的位置.您可能不应该从视图中提取数据库记录,但是当出现一些开箱即用的情况时,它会为您提供两个选项:

1. 在有意义的地方略微打破范式(有充分理由)
2. 重构你的系统以适应范式

一个很好的例子:可重用的小部件块,如标签云或最近的帖子块

最重要的是,您可能不希望在每个控制器功能中不断提供数据,$this->load->vars(...)甚至更糟$this->load->view.

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

另一种方法是设计一个具有简单作业的特殊视图,使用模型加载相关数据(如果可以,则加载)并显示它.像小部件或自包含的东西.这打破了MVC,但你需要检查我们使用MVC的原因.关键是视图不应该对实现负责,这样你可以换出视图,控制器逻辑保持不变.这适用吗？这可能是一个高度视图实现的特定组件,控制器可能不知道它需要这些信息.因此,如果你对它进行操作并对其进行标记以便记住它对自己负责,那么你应该能够很好地适应它.

另一件我不确定的事情(AJAX明智)是我在$(document).ready上有两个不同的AJAX调用,然后当用户点击不同的元素时又有四个.令我困扰的是jQuery .html()实际上并没有将内容放在我的html标签内(当我查看源代码时).

这听起来像是在尝试在客户端代码中做太多.可以通过视图提供任何ajax调用@开头吗？

当用户点击东西时,有四个ajax调用？大多数点击代表单个操作,通常只有一个ajax应该足够,如果你需要处理响应并请求更多信息,可能是两个,但很少超过这个.

$.fn.html(...)在jQuery中将第一个参数放在所选元素中.如果你想要替换整个页面的HTML (不推荐,永远......应该是页面加载).你会这样称呼:

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

我现在被困住的主要问题是这些日子之下的部分.我有那些"祸好,4月20日"的表格标题,但在那之下,我需要得到我的实际事件.我不确定创建此功能的最佳方法是什么.我应该把它放在桌子上吗？但那我怎么把某些事件放在正确的地方呢？目前,我所有的功能都是将某一天的所有事件输出到数组中的函数,如下所示:

有很多方法可以解决这个问题.你可以将整个事物构建为时间块的大表,但这可能会让人感到困惑.另外,表是肮脏的,还有有很多精心撰写的文章何时及何地使用表.

您可以使用CSS Divs将视觉效果设置为统一网格,position: absolute并使用客户端代码(javascript)控制浮动约会.

这是你项目的一个相当复杂的部分,有很多答案,我没有时间在这里深入探讨任何解决方案,你只需要进行原型和实验.

我愿意提供一个链接到我的源代码(github),如果有人想看看我的混乱,也许试着让我再次走上正确的轨道.也许我在正确的轨道上,仍然; 我只是觉得那样.我被困在显示事件部分,我只是觉得很可怕,因为我对我写的内容不满意(尽管大部分内容都适用于此时).

我愿意看一下并提出建议,因为我相信其他人也会这样.

因为我现在正处于复活节假期,我不能再联系我的老师一周,所以我愿意提供100-150代表奖金,以便为这个巨大的咆哮/问题提供一个好的,有用的答案.

一般来说赏金应该被用作激励因素来正确回答你的问题.让人们深入了解的事情(也许这个答案,现在已经变得很长).

欢迎您提供赏金,这是您的代表,但不要觉得您必须提供赏金.如果这个答案令人满意(或者其他人可能发布的任何其他答案,那么简单地接受答案就应该绰绰有余).

总结和最后的想法

好吧,所以在写这个怪物的答案的过程中(它算作中篇小说了吗？)我想我可能已经推断出你可能出错的地方.它可能是设计的,但可能是偶然的.

我想你可能会误认为客户端代码的视图.当我们讨论MVC时,我们并不一定意味着,它应该全部通过ajax加载,并且视图是在客户端浏览器上运行的javascript和dom.

如果情况并非如此,那么请忽略最后一段.

听起来你的责任权重得恰到好处.看起来你的任务太多了javascript.页面加载不是魔鬼,ajax很时髦,但往往可能太多了.你必须找到适合你的应用程序.看起来您可以通过对视图而不是客户端代码承担更多责任来简化您的问题.

我希望这个答案对你有所帮助,对不起,我花了很长时间才发布这个帖子,当你发布它时我看到了你的问题,但没有时间像这样深入探讨.