Question

我在这里看到了一些关于我试图做的事情的好消息，但没有解决所有问题。有没有人有任何代码示例或建议来帮助我做我想做的事情？

首先，我将使用一组数据构建我的MVC视图，例如（org name，id，status），其中status是布尔值，可以是选中也可以是未选中。但是，我不想显示纯粹的复选框，而是根据数据库值的状态显示特定的绿色（选中）或红色（未选中）按钮。 CSS不是问题。

然后，如果用户单击该按钮，我想将div值从红色更改为绿色（反之亦然），还可以通过AJAX调用更新数据库字段中的布尔值。在可能的情况下利用JQuery会更好。

最后，我需要知道如何使用CodeIgniter完成所有这些操作。我精通CI，但Javascript / JQuery新手 - 鹿头灯在这一点上。任何人都可以指出我正确的方向或建议一个网站，其中一些示例代码接近我正在尝试做的事情或者除了显而易见的好资源之外？谢谢你。

Answer 1

好的，所以CodeIgniter是一个PHP框架 - 这意味着它在服务器端工作。（我知道，那里有一个ajax库，但我没有使用它。）我们必须了解服务器端和客户端之间的区别。你的javascript是客户端的。我通常在codeigniter中开发没有javascript的所有内容，然后返回并添加javascript位。这有助于我确保系统适用于那些没有打开javascript或无法以任何理由执行javascript的系统。（顺便说一句，这称为progressive enhancement）。

所以，首先，让我们来处理非JavaScript版本：您只需要在点击时为您的红色/绿色按钮指定一个URL，该按钮指向将更新数据库记录的控制器方法，并将您重定向回您之前所在的页面（具有红色/绿色按钮）。

/controller/method.html是我们的控制器方法，它将保存到数据库并重定向回此页面。 - ＆GT;

<a href="/controller/method.html" class="red my-button">Check</a>

现在，让我们来处理js版本：

在您的视图中，您只需要劫持点击，发送ajax请求，并根据控制器方法的结果更改红色/绿色按钮。因此，我们所做的是保持链接不会将页面重定向到href属性（e.prevendDefault（））。然后，我们得到href的值并对该控制器方法进行ajax调用。该方法将确定这是否是ajax请求并保存到数据库，然后回显“成功”消息。在success，我们可以在客户端更新可视组件。

$('.my-button').live('click', function(e) {
    e.preventDefault();
    $.ajax({
        // $(this).attr('href') gets the value of the links href attribute 
        // which is "/controller/method.html" in this case
        url: $(this).attr('href'), 
        success: function(data) {
           // update your button with whatever html to write the new button
           $('.my-button').replaceWith('<a href="/controller/method.html" class="red my-button">Check</a>');
        }
    });
});

您的控制器方法只是检查它是否是ajax请求。如果是这样，只返回成功，如果没有重定向页面。

function my_controller_method()
{
    if (isset($_SERVER['HTTP_X_REQUESTED_WITH']) && 
        $_SERVER['HTTP_X_REQUESTED_WITH']=="XMLHttpRequest") {

        // update your database
        echo "success";
    }else{
        // redirect back to page
        redirect($_SERVER[‘HTTP_REFERER’]);
    } 
}

Answer 2

你想要的是一种赞美/喜欢的东西...链接http://www.geertdedeckere.be/lab/themeforest/thumbsup/demo/

中包含一个演示

使用Codeigniter更改CSS按钮颜色的AJAX数据库更新

2 个答案: