Twitter Bootstrap 模式中的 Cakephp 表单答案

【问题标题】：Cakephp form in Twitter Bootstrap modalTwitter Bootstrap 模式中的 Cakephp 表单
【发布时间】：2013-11-29 11:56:46
【问题描述】：

在使用带有 Cakephp 2.4.2 表单的 Twitter Bootstrap 模式时需要帮助吗？

我在视图中尝试了以下操作：

<div class="modal" id="myModal" tabindex="-1" role="dialog" data-backdrop="static">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h3 class="modal-title" id="myModalLabel"><?php echo __('Form title'); ?></h3>
            </div>
            <div class="modal-body">
            <?php
                echo $this->Form->create('Person');
                echo $this->Form->input('First name');
                echo $this->Form->input('Last name');
                echo $this->Form->end('Save');
            ?>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
            </div>
        </div>
    </div>
</div>

<script>
    $(function(){
        $('#myModal').modal('show');
    });
</script>

表单会在加载时自动显示，这很好。

我在关闭表单/模式时遇到问题。当用户单击保存时，模式保持打开状态，但根据需要将控制权传递给 PeopleController 中的操作。当用户使用 Cancel 关闭 modal 时，modal 关闭，但 PeopleController 中的操作根本没有被调用。

我需要将控制权传递给 PeopleController 并关闭模式。

最好的方法是什么？

如何在模态页脚中单击按钮时将表单数据发布到控制器？

【问题讨论】：

你应该总是提到你正在使用的确切的 cakephp 版本。从您的代码来看，它看起来像 1.2。即使在 1.3 中，您也已经使用 $this->Form。
你是对的。我使用 cakephp 2.4.2，但忘记在代码中包含 $form=$this->Form 行。这里我只写了与问题相关的一段代码。
不，你没有将它映射到 $form，你只是总是使用 $this->Form。对于 CakePHP 中的 Twitter Bootstrap，请参阅 slywalker.github.io/cakephp-plugin-boost_cake
在 Boost 上没有任何关于模态的...

标签： jquery cakephp twitter-bootstrap

【解决方案1】：

您的模式没有关闭的原因是因为您将其设为静态。改变这个

<div class="modal" id="myModal" tabindex="-1" role="dialog" data-backdrop="static">

为此

<div class="modal" id="myModal" tabindex="-1" role="dialog">

换句话说，data-backdrop="static" 使您的模态不会在表单提交后关闭。更多info here

【讨论】：

你很亲密。我使用 data-backdrop="static" 来防止在模态外部单击时关闭模态，但我使用 data-backdrop="false" 得到的结果相同，而这稍后会在表单关闭时关闭，这正是我想要的。
你的意思是我很接近？我完全按照你的要求回答了。

【解决方案2】：

您可以使用 jquery 隐藏引导模式。

例子：

$('#myModal').modal('hide');

【讨论】：

【解决方案3】：

我会尝试：

        <?php
            echo $this->Form->create('Person', array('action' => 'add'));
            echo $this->Form->input('First name');
            echo $this->Form->input('Last name');
            echo $this->Form->button('Save');
            echo $this->Form->end();
        ?>

否则我认为您的提交可能无法正确呈现

【讨论】：