CakePHP ajax表单更新复制页面

我的站点上有一个基本的ajax表单，它使用Js helper，工作正常，但是当出现验证错误时，更新回调会在我的success div中复制整个页面

成功组：

<div id="success"></div>

Javascript:

$(document).ready(function(){

    $('#postkey, #gender, #hair, #location, #message').blur(function(){
        $.post(
            '/Cake_ajax/Posts/validate_form',
            { field: $(this).attr('id'), value: $(this).val() }
            //handleNameValidation
        );
    });

});

验证我的控制器中的窗体函数：

public function validate_form(){
    if($this->RequestHandler->isAjax()){
        $this->request->data['Post'][$this->request['data']['field']] = $this->request['data']['value'];
        $this->Post->set($this->request->data);
        if($this->Post->validates()){
            $this->autorender = FALSE; // don't render a view
            $this->set('error','');
        }else{
          $this->layout ="ajax";
            $this->autoRender = FALSE;
            $error = $this->validateErrors($this->Post);
            $this->set('error',$this->Post->validationErrors[$this->request['data']['field']][0]);  
        }
    }
}

我不知道这些信息是否足够，如果我需要发布更多的代码，请告诉我

---

谢谢

在Ajax请求处理中，将布局设置为Ajax。因此，错误消息将使用ajax布局而不是默认布局呈现

已更新

public function validate_form(){
if($this->RequestHandler->isAjax()){
    $this->request->data['Post'][$this->request['data']['field']] = $this->request['data']['value'];
    $this->Post->set($this->request->data);
    if($this->Post->validates()){            
        $this->autoRender = FALSE; // don't render a view
        $this->set('error','');
    }else{
        $this->layout ="ajax";
        $this->autoRender = FALSE; 
        $error = $this->validateErrors($this->Post);
        $this->set('error',$this->Post->validationErrors[$this->request['data']['field']][0]);  
    }
}

---

}确保您：

使用RequestHandler组件（首选）：

或者在操作中手动将布局设置为“ajax”：

$this->layout = "ajax"

当请求处理程序检测到ajax请求时，它会自动将布局设置为ajax

---

ajax布局只返回渲染视图。

我刚刚使用zip文件测试了应用程序

我观察到，这不是放在

#success

div中的整个页面，而是

Posts/add.ctp

视图的内容。 因此，基本上这意味着RequestHandler正确地完成了它的工作，这意味着使用的布局是“ajax”布局。 若要删除表单中包含的任何其他内容，add.ctp页面不应包含表单中包含的任何其他内容。在您的例子中，

Posts/add.ctp

包含导航链接，这就是它们被复制的原因

也就是说，submit按钮当前所做的是获取

Posts/add.ctp

视图的内容，并将其插入到空的

#success

div中。但您从未删除页面上已有的表单。 您可以做的是更新包含第一个表单的div的内容，甚至更新整个

Posts/add.ctp

view的内容

在您的情况下，只需更新

#内容

而不是

#success

div就可以满足您的需要：

echo $this->Js->submit('Send', array(
  'before'=>$this->Js->get('#sending')->effect('fadeIn'),
  'success'=>$this->Js->get('#sending')->effect('fadeOut'),
  'update'=>'#content',
  'class'=>'btn btn-primary',
  'controller'=>'posts',
  'action'=>'add'
));

---

您好，首先，您似乎正在使用cake 2 lib和1.3代码，这些代码可能会正常工作，但在不推荐的部分中，可能是检查工作。console工具还可以将代码升级到2.0/2.1

第二，确实要渲染视图和空布局吗$错误在Views/Posts/validate_form.ctp中定义。您正在设置$errors，然后不渲染视图。删除将“自动渲染”设置为false并将其放置在控制器操作的顶部

$this->layout = 'ajax';
Configure::write("debug",0);

---

有什么好处吗？

我遇到了同样的问题。虽然nIcO似乎给出了解决方案，但在我的案例中，它没有起到任何作用，因为Drawrdesign想要的成功消息仍然没有被呈现出来

所以，我查看了你的zip文件，找到了解决方案。定义了两个ajax调用：1）blur和2）bind。1） 用于验证字段，并通过AJAX将数据提交给PostsController的validate_form（）函数。和2）用于观察submit按钮的click事件，并将数据发送到PostsController的add（）函数

此问题发生在2），因为您单击了“提交”按钮。因此，您应该看看PostsController的add（）函数。在1）函数的validate_form（）中添加了以下行：

$this->autoRender = FALSE; 

这就是解决办法。因为CakePHP自动呈现视图的地方，您不希望它发生，因为AJAX。因此，在案例1）完成后，应将其添加到案例2中的add（）函数中，如下所示：

public function add() {
// Ajax post
if(!empty($this->request->data)) {
    // ...
    $this->autoRender = FALSE; // ** NEW LINE **
        if($this->Post->save($this->request->data)) {
            // ...     
        } 
        // ...
    } 
    // ...
} 

因此，停止（自动）渲染div=“#success”中的add.ctp，您的其他消息“sending..”和“success.ctp”仍将开始显示

---

PS.@Drawrdesign，你有没有碰巧看了andrewperk的说明视频？

如果这是直接复制粘贴，你有没有尝试将行更改为

$this->autoRender=false

（大写R）？另外，使用哪种布局作为默认布局？我认为[CakePHP表单验证与Ajax使用jQuery][1]将有助于在CakePHP[1]中设置Ajax验证：干杯！！我一直在寻找同一个问题的解决方案，而你接受的答案解决了我的问题。当你在谷歌上搜索你遇到的问题，而有人遇到了同样的问题，并且问题已经解决时，这种感觉真是太棒了：）祝你的项目好运。嘿，谢谢你的回复。不幸的是，这并没有解决问题。它真的开始磨我的齿轮了，哈哈。@Drawrdesign:有一个错误，我应该在else部分添加布局设置。已立即更新代码。请立即重试。仍然没有：（我可以把整个应用程序压缩起来让你看一看吗？或者粘贴它，或者别的什么吗？谢谢，这里有一个指向.zip文件的链接：我的控制器中已经有了请求处理程序，并且尝试了ajax布局，但没有骰子。这很好，谢谢。刚才我怎么能在不将整个add.ctp页面替换为succes的情况下呈现成功消息呢s、 ctp？我自己不使用JsHelper，但更喜欢编写自己的jQuery脚本，以便更好地控制脚本的功能。但在您的情况下，我认为应该像您一样呈现与控制器不同的视图。如果问题是如何使菜单不消失，那么，您可以只更新表单（而不是#内容），但仅在视图中渲染所需的部分（如果有错误，则为表单或成功消息）。但在这种情况下，如果请求是Ajax调用，则不要呈现菜单。请注意，如果确实需要在add.ctp中包含操作菜单或其他内容，您也可以通过将Ajax请求发送到另一个操作来实现此目的，该操作将在出现错误或成功消息时呈现表单。您从未接受过我的回答。这不是您正在寻找的答案为什么？@nIcO:谢谢你，伙计。你是个救命恩人。

public function admin_edit_comment() {
    $this->layout = 'ajax';
    $this->autoRender = false;
    if ($this->request->is('ajax')) {
        if ($this->FaComment->save($this->request->data, false)) {
            $response['status'] = 'success';
            $response['action'] = 'edit_comment';
            $response['data'] = $this->request->data['FaComment'];
            $response['message'] = __d('vanderdeals', 'Comment saved successfully');


    } else {
            $response['status'] = 'error';
            $response['model'] = 'FaComment';
            $response['message'] = __d('vanderdeals', 'Internal server error occurred. Please try again later.');
        }

        echo json_encode($response);
    }
}

public function add() {
// Ajax post
if(!empty($this->request->data)) {
    // ...
    $this->autoRender = FALSE; // ** NEW LINE **
        if($this->Post->save($this->request->data)) {
            // ...     
        } 
        // ...
    } 
    // ...
} 

public function admin_edit_comment() {
    $this->layout = 'ajax';
    $this->autoRender = false;
    if ($this->request->is('ajax')) {
        if ($this->FaComment->save($this->request->data, false)) {
            $response['status'] = 'success';
            $response['action'] = 'edit_comment';
            $response['data'] = $this->request->data['FaComment'];
            $response['message'] = __d('vanderdeals', 'Comment saved successfully');


    } else {
            $response['status'] = 'error';
            $response['model'] = 'FaComment';
            $response['message'] = __d('vanderdeals', 'Internal server error occurred. Please try again later.');
        }

        echo json_encode($response);
    }
}