在这个例子中，让 jQuery/Ajax 与 CodeIgniter 一起工作的最佳方法是什么？

Question

我在尝试让 CodeIgniter 和 jQuery 生成 ajax 功能时遇到问题。我整天都在编码，学习 jQuery，并且通常会被踢。让我分解一下情况，希望有人有勇气帮助我。

我有一个故障单系统，它在一个页面上显示许多故障单...每个故障单都嵌套在多个 div 中，如下所示：

<div class="eachticketwrapper" id="ticket-362">
   <div class="actionlog">
        <form action="<?= base_url();?>admin/updateticket/362" method="post" id="362" name="362">
           <ul class="displayinline">
           <p>Action Log:
           <span class="actionlog-362">
                <?php echo $actionlog; ?>
            </span>
            </p>
   </div> <!--actionlog-->
            <p>
        <textarea name="actionlogbox362" cols="100" rows="2" id="actionlogbox362" style="" ></textarea>
        </p>
            <div class="finalbuttons">
                <?php echo form_open('admin/updateticket/'.'362'); ?>
            <li><?php 
                            $attrib = "class='updatebutton-362' id='updatebutton-362'";
                            echo form_submit("RapidTask",'Update',$attrib); //setup the button, and set permissions. ?></li>
                <?php echo form_close(); // close the form. ?>
             </div> <!--finalbuttons-->
</div> <!--eachticketwrapper-->

运行时，$actionlog 应该类似于以下内容：

worker - 2009-06-25 18:15:23 - Received and Acknowledges Ticket.
worker - 2009-06-25 18:15:23 - Changed Status to In Progress
worker - 2009-06-25 18:15:46 - Changed Priority to High
worker - 2009-06-25 18:15:46 - Changed Category to Network Connection Problem
worker - 2009-06-25 18:17:16 - did something

然后是一个文本区域和一个更新按钮。

这是我的补充 jQuery 文件的内容：

$(document).ready(function() {
    $('.updatebutton-362').click(function()
        {
            var id = $(this).attr("id").split("-"); // Split the id value at the hyphen, and grab the ticketnum.
            $('.actionlog-'+id[1]).load('http://localhost/ci/index.php/ajaxtestc/');  // do something...
            return false; // return false so default click behavior is not followed.
        });
});

ajaxtestc 控制器如下所示：

function index()
    {
        $data['actionlog'] = $this->m_tickets->actionLogPull(362);
        $this->load->vars($data);
        $this->load->view('content/ajaxtestform');
    }

m_tickets 模型如下所示：

function actionLogPull($requestedNum=NULL)
    {
        $this->db->where('ticketnum', $requestedNum); // Grab only the status for the ticket requested $requestednum=NULL
        $requestedTicket = $this->db->get('tickets'); // set the initial ticket info to a variable
        $returnvalue = $requestedTicket->row('actionlog');
        return $returnvalue;
    }

现在...这就是我想要的。我想单击更新按钮，让它获取工作人员在文本区域中输入的任何内容，将其添加到数据库中现有日志的末尾，然后刷新屏幕上的操作日志。

我想不出一个明确的方法来做到这一点。谁能阐明我如何开始这个过程？

非常感谢任何帮助，并在此先感谢。

Answer 1

在$('.updatebutton-362').click 中，将.load() 行更改为（将名称、ID 替换为您要发送的任何参数）：

$.post('http://localhost/ci/index.php/ajaxtestc/', 
    {name: "John Doe", id: "anything"},
    function(data) {
      $('.actionlog-'+id[1]).html(data);
    }
});

然后在ajaxtestc 控制器中index() 中的所有内容之上，解析_POST 变量并调用模型中的任何函数来更新操作日志。

index() 操作显示的任何内容都将加载到 actionlog 范围中。

Answer 2

首先，您的代码看起来很乱。第一个标签似乎未闭合，而 form_open 嵌套在其中。 我开发网络的经验法则是，首先让它在没有任何 javascript 的情况下工作。然后添加 javascript 作为更好的体验。 在上述情况下，尝试使用旧方式构建表单，提交后，重定向到您想要的页面。之后运行良好，一次添加一个 jquery。使用 jquery 表单插件提交表单。在控制器中添加一个简单的检查来处理 ajax 请求。 我一般使用json提交表单，所以在controller中，我会返回一个json_encode数组给ajax提交的表单请求。

希望对您有所帮助。