123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124 |
- <!DOCTYPE html>
- <html lang="zh">
- <head>
- <th:block th:include="include :: header('弹层表格')" />
- </head>
- <body class="gray-bg">
- <div class="wrapper wrapper-content fadeInRight">
- <div class="row">
- <div class="col-sm-12">
- <div class="ibox">
- <div class="ibox-title">
- <h5>弹层框</h5>
- </div>
- <div class="ibox-content" id="test">
- <p>弹出复选框表格及单选框表格(点击提交后得到数据)。 </p>
- <button type="button" class="btn btn-primary" onclick="selectCheckUser()">弹出表格(复选框)</button>
- <button type="button" class="btn btn-success" onclick="selectRadioUser()">弹出表格(单选框)</button>
- </div>
- </div>
- </div>
- <div class="col-sm-12">
- <div class="ibox">
- <div class="ibox-title">
- <h5>弹层框</h5>
- </div>
- <div class="ibox-content" id="test">
- <p>弹出层,点击提交后得到数据并回显到父窗体。 </p>
- <button type="button" class="btn btn-primary" onclick="selectUsersToParent()">弹出表格(方式一)</button>
- <button type="button" class="btn btn-success" onclick="selectUsersToParentCallBack2()">弹出表格(方式二)</button>
- <button type="button" class="btn btn-info" onclick="selectUsersToParentCallBack3()">弹出表格(方式三)</button>
- <p id="userids"> </p>
- </div>
- </div>
- </div>
- <div class="col-sm-12">
- <div class="ibox">
- <div class="ibox-title">
- <h5>弹层框</h5>
- </div>
- <div class="ibox-content" id="test">
- <p>多层弹出,点击提交后得到数据并回显到父窗体。 </p>
- <button type="button" class="btn btn-primary" onclick="selectUsersToParent4()">弹出窗口(方式四)</button>
- <p id="username"> </p>
- </div>
- </div>
- </div>
- </div>
- </div>
- <th:block th:include="include :: footer" />
- <script type="text/javascript">
- var prefix = ctx + "demo/modal";
- function selectCheckUser(){
- $.modal.open("选择用户", prefix + "/check");
- }
- function selectRadioUser(){
- $.modal.open("选择用户", prefix + "/radio");
- }
- // 根据当前激活的选项卡获取(方式一)
- function selectUsersToParent(){
- $.modal.open("选择用户", prefix + "/parent");
- }
- // callBack获取父窗口方法(方式二)
- function selectUsersToParentCallBack2(){
- var options = {
- title: '选择用户',
- url: prefix + "/parent",
- callBack: doSubmit2
- };
- $.modal.openOptions(options);
- }
- // callBack获取父窗口值(方式三)
- function selectUsersToParentCallBack3(){
- var options = {
- title: '选择用户',
- url: prefix + "/parent",
- callBack: doSubmit3
- };
- $.modal.openOptions(options);
- }
- // callBack获取父窗口值(方式四)
- function selectUsersToParent4(){
- var prefix = ctx + "demo/modal";
- var options = {
- title: '多层窗口A',
- url: prefix + "/frame1",
- callBack: doSubmit4
- };
- $.modal.openOptions(options);
- }
- function doSubmit2(index, layero){
- var rows = layero.find("iframe")[0].contentWindow.getSelections();
- if (rows.length == 0) {
- $.modal.alertWarning("请至少选择一条记录");
- return;
- }
- $('#userids').html('我是通过方式二来的:' + rows.join())
- $.modal.close(index);
- }
- function doSubmit3(index, layero){
- var body = $.modal.getChildFrame(index);
- $("#userids").html('我是通过方式三来的:' + body.find('#rowIds').val());
- $.modal.close(index);
- }
- function doSubmit4(index, layero){
- var body = $.modal.getChildFrame(index);
- $("#username").html('我是通过方式四来的:' + body.find('#name').val());
- $.modal.close(index);
- }
- function selectUsers(){
- alert(1);
- }
- </script>
- </body>
- </html>
|