码迷,mamicode.com
首页 > 其他好文 > 详细

easyui自定义工具栏

时间:2017-12-13 23:37:05      阅读:113      评论:0      收藏:0      [点我收藏+]

标签:mod   详细   一个   action   pat   result   ddl   封装   弹窗   

easyui自定义工具栏

easyui的弹出框上有工具栏(上方)和按钮栏(下方),
工具栏的按钮默认靠左,自己没找到调整位置的属性。
为了在右上角放一个关闭按钮,只能使用easyui的属性自定义一个工具栏,主要的实现为:

  1. 创建一个div作为工具栏,在div中放要显示的按钮,按钮在div中向右靠齐
  2. 在弹窗框div中添加属性

    data-options="toolbar:‘#tb‘"

我的代码如下:

 <div id="editDialog"  style="overflow: auto; overflow-x: auto;"  data-options="toolbar:‘#tb‘">
        <div id="box"  >
           <pre id="showMessage" style="font-size: 15px">
           </pre>
        </div>
 </div>

<div id="tb" class="dialog-button2" style="background:#f2f4f6; height: 30px">
    <a href="javascript:closeDialog()" class="l-btn" id="" style="float: right; margin-right: 2px ; vertical-align: middle"><span class="l-btn-left"><span class="l-btn-text">关闭</span></span></a>
</div>

js代码如下:

function editRemind(editId) {
        $(‘#editDialog‘).dialog({
            width: 1000,
            height: 700,
            title: ‘异常详细信息‘,
            modal: true,
           /* toolbar:[{
                text:‘关闭‘
            }],*/
          /* buttons: [{
                text: ‘关闭‘,
                handler: function () {
                    $(‘#editDialog‘).dialog(‘close‘);
                }
            }],*/
            onBeforeOpen:function(){
            },
            onOpen:function(){
                $(‘#showMessage‘).text(exceptionDetail);
                /*$.ajax({
                    url: ‘${applicationPath_}/servlet/MainServer?cmd=esbDbExceptionManageSingle&action=queryById&set_token_flag=N&_method=read‘,
                    type: ‘post‘,
                    data: {id: editId},
                    dataType: ‘JSON‘,
                    success: function (results) {
                        if (results.success) {
                            $(‘#showMessage‘).text(results.queryObj.exceptionDetail);
                        } else {
                            $.messager.alert(‘error‘, ‘\u67e5\u627e\u4fe1\u606f\u5931\u8d25!‘, ‘error‘);
                        }
                    }
                });*/
            },
            cache: false
        });

    }

为了工具栏好看点,样式都去easyui封装好的toolbar和buttons栏中扣去吧

easyui自定义工具栏

标签:mod   详细   一个   action   pat   result   ddl   封装   弹窗   

原文地址:http://www.cnblogs.com/jinxiuze/p/8034497.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!