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

这是我 View 中的表单代码:

<?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> 

这是 Controller 操作:
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';到 Controller (见上文),但它没有效果。这是 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; 
    }); 
}); 

请您参考如下方法:

发生的事情是它加载了 default布局。您必须将布局更改为 ajax与以下行:

$this->layout = 'ajax'; 

您在 isAjax() 中插入该行健康)状况。

还有您的 options数组格式错误。 action key 应该在 url 内 key 。
$this->Js->submit('Post Your Message', array( 
        'url' => array( 
            'action' => 'add' 
        ), 
        'update' => '#message_board' 
    ) 
); 


评论关闭
IT干货网

微信公众号号:IT虾米 (左侧二维码扫一扫)欢迎添加!