必要なものを非表示の 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>
フォームで作業している場合、モーダル ボックスのボタンはフォームの外にあります。フォームを適切に機能させるには、少しカスタマイズする必要があります。
ブートボックスの「OK」ボタンをクリックして、スクリプトでフォームを送信する例
$('my-form-selector').submit();
重要: このコードでは非表示の div から HTML を取得したため、2 つのフォーム (ブートボックスに 1 つ、非表示の div に 1 つ) が存在することになります。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