在Yii中的模态或引导框中呈现表单的正确方式


Correct way to render a form in a modal or bootbox in Yii

我在尝试如何在Yii中的模态框中呈现表单时遇到了一些问题。

目前,我有以下代码,其中我刚刚获得了一个显示模式框的链接。

CHtml::link(' Email this Gift', '#', array( 
        'id' => 'giftModal',
        'onclick'=>'js:bootbox.confirm("hello world")',
            )
        );

我真的需要在模态框中呈现一个表单。我该如何做到这一点,实际上我已经花了很长一段时间研究如何实现这一目标,但我显然一直在错误地搜索,所以如果有任何指导,我将不胜感激。

感谢

将您想要的内容放入隐藏的div中,在这种情况下,为了方便起见,我将表单放入其他视图中。

    <!-- dialog contents on hidden div -->   
   <div id="modal-content" class="hide">
    <div id="modal-body">
<!-- put whatever you want to show up on bootbox here -->
    <?php
        //example
        $model = Category::model()->findByPk(1);
        $this->renderPartial('//test/child-view', array('model'=>$model)) ?>
    </div>
</div>

然后将消息传递到具有以上内容的引导框

<script>
    $(function(){
        bootbox.confirm($('#modal-body').html());
</script>

当你使用表单时,模态框的按钮在你的表单之外,你必须自定义一点以使你的表单正常工作。

示例当点击bootbox的"OK"按钮时,您调用脚本提交表单

$('my-form-selector').submit();

重要:因为在这段代码中,我从隐藏的div获得了HTML,所以有两个表单(一个在bootbox上,一个在隐藏的div上)。您必须添加类bootbox作为表单元素的前缀,以指示您在引导框上操作的表单(在我的情况下,bootbox只是由其自身库生成的类,并且是模态框上内容的父类,my-form-selector可以是#form-id.form-class-name等)

 bootbox.confirm($('#modal-body').html(), function(result){
            if(result){
                console.log($('.bootbox my-form-selector').parent().parent()); //<--it should print the object of modal bootbox, it ensures the form is in modal box, not one on hidden div-->
                $('.bootbox my-form-selector').submit();
            }});

我认为您应该使用dialog而不是confirm,因为在那里您可以完全自定义模式框