如何在CakePHP中使用Js-> submit()?

时间:2010-10-10 19:42:18

标签: ajax cakephp forms helper

我试图在CakePHP应用程序中为留言板创建一个简单的Ajax表单,但我不能在我的生活中弄清楚如何正确使用Js-> submit()函数来提交表单Ajax的。

在我的视图中显示表单代码:

<?php

 echo $this->Form->create('Message',array(
  'type' => 'post', 
  'action' => 'add',
  'onSubmit' => 'return false;'
 ));

 echo $this->Form->input('name', array('label' => 'From:'));
 echo $this->Form->input('text', array('label' => 'Message:'));

 echo $this->Js->submit('Post Your Message', array(
  'action' => 'add',
  'update' => '#message_board'
 ));

 echo $this->Form->end();

?>

<div id="message_board">
    ...
</div>

这是控制器动作:

function add() {
 $this->autoRender = false; 
 if($this->RequestHandler->isAjax()) {
     $this->layout = 'ajax'; //THIS LINE NEWLY ADDED
     if(!empty($this->data)) {
         if($this->Message->save($this->data)) {
             $this->Session->setFlash('Your Message has been posted');
         }
     }
 }
}

奇怪的是,当我提交表单时发生的是表单的精确副本,其包含的div在message_board div中重复。奇怪的。

显然我错过了某些东西(或几件事)。如果有人有任何想法,或者知道如何使用它的良好信息来源,将非常感激。

感谢。

更新:我尝试将新行$this->layout = 'ajax';添加到控制器(见上文),但它没有效果。这是CakePHP的jquery输出,可能会告诉某人最新情况。

$(document).ready(function () {
    $("#submit-707957402").bind("click", function (event) {
        $.ajax({
            action:"add", 
            data:$("#submit-707957402").closest("form").serialize(), 
            dataType:"html", 
            success:function (data, textStatus) {
                $("#message_board").html(data);
            }, 
            type:"post", 
            url:"\/messages"
        });
        return false;
    });
});

2 个答案:

答案 0 :(得分:5)

它会加载default布局。您必须使用以下行将布局更改为ajax

$this->layout = 'ajax';

您在isAjax()条件中插入该行。

您的options数组的格式也是错误的。 action密钥应位于url密钥内。

$this->Js->submit('Post Your Message', array(
        'url' => array(
            'action' => 'add'
        ),
        'update' => '#message_board'
    )
);

答案 1 :(得分:0)

我参加晚会很晚!但不久前,大约3个月前我遇到了这个问题。结果是我没有授权用户访问该操作。解决方案是在AppController beforeFilter()中添加一些代码,如:

function beforeFilter(){
    $this->Auth->allow('my_actions_name');
}

但是我不确定为什么它重新渲染父div,或者有时整个页面,但我的猜测是,设置蛋糕,以便每当动作无法访问/允许时,就会发生一些路由,也许执行索引或其他默认操作,这会导致在ajax视图中呈现。

如果您在浏览器的网络选项卡(在chrome中)检查请求响应,则很明显返回的响应与呈现的内容相同。但是,我是一个完整的新手,答案是基于猜测。

如果有人能给出更好的解释(请教我们),我将是第一个提出投票的人:)

直到那时,快乐编码