如何在laravel中显示bootstrap popup模式?

时间:2017-11-29 07:07:08

标签: javascript php laravel

我想在laravel中使用java-script或预定义函数在资源页面上弹出模型。

1 个答案:

答案 0 :(得分:1)

可能是,

您想要在刀片模板中使用js打开弹出窗口,以便

在刀片文件中添加按钮,然后在其中添加bootstrap.css文件。

<button type="submit"  class="donate_now btn btn-default-border-blk generalDonation" data-toggle="modal"  data-backdrop="static" data-keyboard="false" data-target="#myModalHorizontal">donate now</button>

根据同一页面中的设计模式

<!-- Modal -->
<div class="modal fade" id="myModalHorizontal" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog modal-lg">
    <div class="modal-content">
        <!-- Modal Header -->
        <div class="modal-header" style="background: orange">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true" class="ion-android-close"></span></button>
            <h4 class="modal-title" id="myModalLabel" style="color: whitesmoke;">Donation For Siddhyog Sadhan Mandal</h4>
        </div>            <!-- Modal Body -->
        <div class="modal-body">
            <div>
                Payment Option
            </div>
            <form id="frm-donation" name="frm-donation">
                <div class="header-btn">
                    <div id="div-physical">
                        <label>
                            <input id="rdb_physical" name="rdb_donation" value="0" type="radio" checked="" class="validate[required]" data-errormessage-value-missing="Donation Type is required!">
                            Physical Entity Donation
                        </label>
                    </div>
            </form>
            <div class="modal-body">
                <div class="modal-footer" id="modal_footer">
                    <!--<input id="btnSubmit" name="btnSubmit" value="Donate" class="btn btn-default-border-blk" type="submit">-->
                    <a id="btnDonate" class="btn btn-default-border-blk">Donate</a>
                </div>
            </div>
        </div>
    </div>
</div>

你可以看到页面上的模态工作,但为此确保data-target =“#myModalHorizo​​ntal”上的ID和modal的id id =“myModalHorizo​​ntal”