CakePHP 控制器构建表单并将其作为 HTML 发送到 Jquery UI 对话框

Question

我在一个小项目中使用 cakePHP 和 Jquery UI。

我的项目 index.ctp 上有一个“添加项目”链接。

我想在论坛中显示一个 jQuery UI 对话框，以便在单击“添加项目”链接时添加项目。

这样我就可以使用 cakePHP 很棒的 FormHelper 我希望控制器的 add() 方法返回 FormHelper 创建的 html if($this->request->is('ajax')) 但这给了我内部服务器错误（当我在 Chrome 中检查元素时）。

我知道这不是非常 MVC，但我的理由是，如果用户启用了 Js，我希望我的应用程序能够工作，因此“添加项目”链接显示 add.ctp 视图如果他们没有jQuery，但如果他们这样做，我的 jQuery 脚本中有 preventDefault()。

jQuery 点击处理程序然后设置对话框的属性（jQueryUI 对话框），然后向表单的 add() 发出 ajax 请求。

我复制并粘贴了我在 add.ctp 上使用的 FormHelper 代码，但不是回显，而是将每一行添加到 $htmlString。然后我打电话给echo $htmlString; exit();，但在这里我得到了500 Internal Server Error。

如果我注释掉 add() 函数中的所有 FormHelper 行，一切正常（$htmlString 只是“”），所以这里出了点问题。

正如我所说，我知道这不是 MVC-y，但我想不出另一种方法来做到这一点。我可能会返回 add.ctp 而不是复制和粘贴的代码吗？这将使 MVC 模型保持正确，而且如果 $this->layout = 'ajax' 那么我只会得到正确的 add.ctp 文件代码吗？

提前感谢您的时间和帮助。

编辑 - 添加 jQuery ajax 请求和 cakephp 控制器 add() 函数

jQuery ajax 请求：

$('.add_project').click(function(event) {
        //Kill default
        event.preventDefault();

        $.ajax({
            url : $(this).attr('href'),
            type : 'post',
            data : 'ajax=1',
            dataType: 'html',
            success: function(response) {
                alert(response);

                //Check jquery loaded
                if(jQuery.ui) {
                    //Fill dialog with form
                    $("#dialog").html(response).show();

                    //Show dialog
                    $("#dialog").dialog("open");
                }
            }
        });
    });

CakePHP 控制器代码：

public function add()
{
    //If this has been requested with ajax then give the form that we create on add.ctp
    if($this->request->is('ajax'))
    {
        App::import('Helper', 'Form');

        $this->loadModel('Project');
        $html = '';

        $html += $this->Form->create('Project');
         $html += $this->Form->input('name');
         $html += $this->Form->input('colour', array(
             'options' => array('blue' => 'Blue', 'green' => 'Green', 'red' => 'Red', 'orange' => 'Orange', 'yellow' => 'Yellow')
         ));
        $html += $this->Form->end('Create Project');
        echo html;
        exit();
    } 

我很肯定这与 ajax 请求无关，而是 cakephp 中的一个问题，它不喜欢在控制器中使用 FormHelper。我知道这是不好的 MVC 做法，但我想不出另一种动态地执行此操作的方法（因为 cakephp 基于模型构建 html 标签）。

再次感谢。

Answer 1

您收到的 500 Internal Server 错误是因为您在 Controller 中使用了 Helper。

但是！您可以通过您的 ajax 请求传回视图。 在控制器中创建方法。使用表单助手创建视图

ajaxForm.ctp

$this->Form->create('Project');
$this->Form->input('name');
$this->Form->input('colour', array(
       'options' => array('blue' => 'Blue', 'green' => 'Green', 'red' => 'Red', 'orange' => 'Orange', 'yellow' => 'Yellow')
));
$this->Form->end('Create Project');

控制器

public function ajaxForm(){

if($this->request->is('ajax')){
    $this->layout = 'ajax';   // to avoid returning your full layout
    $this->render('ajaxForm');

}

}

Answer 2

将你的 html 和前端代码与 php 后端代码分开，如果你没有向视图传递任何数据，你的 add 函数可以为空，如果 add 函数没有被调用，你不需要检查 ajax非ajax请求。在您看来，它将专用于您的 ajax 请求。

//controller file
App::import('Helper', 'Form');
public function add()
{

} 


//App/Views/Projects/add.ctp file
        echo $this->Form->create('Project');
        echo $this->Form->input('name');
        echo $this->Form->input('colour', array(
             'options' => array('blue' => 'Blue', 'green' => 'Green', 'red' => 'Red', 'orange' => 'Orange', 'yellow' => 'Yellow')
         ));
        echo $this->Form->end('Create Project');