Question

我在cakephp中有以下表格：

<div class="quickcontactDisplay">
<?php
    echo $form->create('Enquiry',array('action'=>'add','class'=>'quickcontact'));
    echo $form->hidden('visitor_id', array('value' => $visitor));       
    echo $form->input('name');
    echo $form->input('emailAddress',array('size' => 30));
    echo $form->input('enquiry');
    echo $form->end('Ok, I\'m done'); 
?>
</div>

正如你所看到的，它包含在一个带有.quickcontactDisplay类的div中。

在提交时，它转到我的查询控制器的添加操作，它通过ajax，使用jQuery表单插件执行此操作。继承人我的jQuery：

$(document).ready(function(){                          

    // bind 'quickcontact' and provide a simple callback function 
   $('form.quickcontact').ajaxForm(function(html) { 
        //updates the .quickcontactDisplay div with the action output.
        $('.quickcontactDisplay').html(html);
    }); 
});

此时查询控制器的实际操作并没有做很多事情，除了丢弃我模型中设置的内置验证消息。无论如何，仍然是代码：

function add() {
        $this->set('visitor', $this->Session->read("visitor"));
        if (!empty($this->data)) 
            {
                $this->Enquiry->create();
                if ($this->Enquiry->save($this->data)) 
                {
                    //echo 'success';
                    $this->layout = 'ajax';
                } 
                else 
                {
                    //echo 'fail';
                    $this->layout = 'ajax';
                }
            }
    }

我的问题：

当我提交表单时，它会使用错误消息更新我的div，一切似乎都很好。但是，当我提交它时，它不会触发ajax调用，只是直接提交给操作，从而导致一个页面只包含动作输出html。

继承操作返回的内容：只是空表单和验证消息：（我认为现在是时候让它变得有点啰嗦了）

http://pastebin.com/m57401b13

似乎当.quickcontactDisplay div中包含的表单通过ajax更新时，它会破坏ajax绑定，并且不会再次启动。谁能看到这里会发生什么？感谢。

Answer 1

你是对的。通过将div替换为其中的表单，任何绑定到旧内容的处理程序都将丢失。

查看jQuery的新live（）函数，该函数将当前和将来的匹配绑定到事件。

或者，只要将新HTML插入DOM，就重新应用绑定。例如

$(document).ready(function(){                                              

    function handleStuff(html)
    {
        //updates the .quickcontactDisplay div with the action output.
        $('.quickcontactDisplay').html(html);

        // re-do the form, as it has just been replaced
        $('form.quickcontact').ajaxForm(handleStuff);
    }

    // bind 'quickcontact' and provide a simple callback function 
    $('form.quickcontact').ajaxForm(handleStuff);
});

未对此进行测试，但希望它会有所帮助。

为什么jQuery ajax请求在初始请求后中断？

1 个答案: