Latest posts of: LoreYun

EasyUI Forum

September 15, 2025, 07:52:32 AM

Welcome, Guest. Please login or register.

News:

Home

Help

Show Posts
Pages: [1]

1	General Category / EasyUI for jQuery / Re: enter in modal window, and page will refresh	on: May 11, 2016, 07:21:17 PM
Hi stworthy, It's worked! Thank you very much!

General Category / EasyUI for jQuery / [SOLVED] enter in modal window, and page will refresh

on: May 11, 2016, 02:15:40 AM

Hello every
I have a toolbar for a panel, and I use a toolbutton to open a modal window.
There is a validatebox and two linkbuttons in that window.
If you press enter in that window, the browser will be refreshed.

Point out my mistakes, please.
Thanks.

Code:

<!DOCTYPE html>
<html>
<head lang="zh">
    <meta charset="UTF-8">
    <title>enter</title>
    <link rel="stylesheet" type="text/css" href="../components/easyui_1.4/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="../components/easyui_1.4/themes/icon.css">
    <script type='text/javascript' src='../components/easyui_1.4/jquery.min.js'></script>
    <script type='text/javascript' src='../components/easyui_1.4/jquery.easyui.min.js'></script>
</head>
<body>
<script type='text/javascript'>
    function op_w_create_group() {
        var $w_group = $('#w_maintain_group');
        $w_group.window({title: 'Create group', iconCls: 'icon-add'});
        $('#submit_group').linkbutton({text: 'add'}).unbind('click').removeAttr('onclick').click(function () {
            do_create_group()
        });
        $('#from_maintain_group').form('clear');

        $w_group.window('open');
        $('#new_group_name').focus();
    }
    function do_create_group() {
        $('#from_maintain_group input.easyui-validatebox').validatebox('enableValidation');
        alert('create group');
    }
    $(function () {
        console.log('init');

        $('input.easyui-validatebox').validatebox('disableValidation')
                .focus(function () {
                    $(this).validatebox('enableValidation');
                })
                .blur(function () {
                    $(this).validatebox('validate')
                });

        $('#new_group_name').keydown(function (e) {
            console.log('keydown');
            if (e.which === 13) {
                $('submit_group').click();
            }
        })
    });
</script>
<div id="w_maintain_group" class="easyui-window" data-options="modal:true"
     closed="true" collapsible="false" minimizable="false" maximizable="false" class="easyui-layout"
     style="width:500px;height:200px;padding:5px;">
    <form id="from_maintain_group" method="post" novalidate>
        <div data-options="region:'North'" style="padding:10px;">
        </div>
        <div data-options="region:'center'" style="padding:10px;">
            <input id="maintain_group_id" type="hidden"/>
            <table>
                <tr>
                    <td>group name：</td>
                    <td>
                        <input id="new_group_name" class="easyui-validatebox"
                               data-options="required:true,missingMessage:'is null'">
                    </td>
                </tr>
            </table>
        </div>
        <div data-options="region:'south',border:false" style="text-align:right;padding:5px 0 0;">
            <a id="submit_group" class="easyui-linkbutton" data-options="iconCls:'icon-ok'"
               href="javascript:void(0)"
               onclick="" style="width:80px"></a>
            <a class="easyui-linkbutton" data-options="iconCls:'icon-cancel'" href="javascript:void(0)"
               onclick="closeWindow('w_maintain_group',true);" style="width:80px">cancel</a>
        </div>
    </form>
</div>
<table>
    <tr valign="top">
        <td>
            <div class="easyui-panel" title="My Group" style="width:175px;height:400px;padding:10px;"
                 data-options="tools:'#tb_myGroup'">
            </div>
            <div id="tb_myGroup">
                <a href="javascript:void(0)" class="icon-add" onclick="op_w_create_group();"></a>
            </div>
        </td>
    </tr>
</table>
</body>
</html>

3	General Category / Bug Report / Re: the rownumbers display bug in datagrid	on: May 10, 2016, 12:24:50 AM
Hi stworthy, Thank a lot! 'fixRowHeight' is worked! In fact, I use "data-options:url" to load data. Only static HTML has this problem. fixed code: Code: $('#tab').tabs({ onSelect: function (title, index) { if (index === 0) { $('#list_tab1').datagrid('fixRowHeight'); } else if (index === 1) { $('#list_tab2').datagrid('fixRowHeight'); } }}); Thanks again.

General Category / Bug Report / [SOLVED] the rownumbers display bug in datagrid

on: May 09, 2016, 10:43:05 PM

I have only one tabs in a static HTML, and two panels in the tabs. Each panel has a datagrid which show the rownumbers.
If I init the "onSelect" event for two datagrids, then one rownumber is normal who is default selected panel in tabs, but the other datagrid is abnormal.

I tried "resize" datagrid when select panel, but doesn't work.
If I comment the init of "onSelect" event, it will be ok.
test code:

Code:

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <script type='text/javascript' src='../components/easyui_1.4/easyui-include.js'></script>
</head>
<body>
<div class="easyui-tabs" id="tab" style="width:810px;height: 500px" data-options="selected:1">
    <div id="tab1" title="tab1" style="padding:10px">
        <table id="list_tab1" class="easyui-datagrid" style="width:358px;height: 434px"
               data-options="rownumbers:true">
            <thead>
            <tr>
                <th data-options="field:'info',width:85,align:'left',resizable:false">
                    info
                </th>
                <th data-options="field:'content',width:130,align:'left',resizable:false">
                    content
                </th>
                <th data-options="field:'retrievePerson',width:85,align:'left',resizable:false">
                    retrievePerson
                </th>
            </tr>
            </thead>
            <tbody>
            <tr>
                <td>1<br>2<br>3<br>4</td>
                <td>content 1234567890, 1234567890,, 12345678910,, ,</td>
                <td>123123,......<br><a>See All</a></td>
            </tr>
            <tr>
                <td>1<br>2<br>3<br>4</td>
                <td>content 1234567890, 1234567890,, 12345678910,, ,</td>
                <td>123123,......<br><a>See All</a></td>
            </tr>
            </tbody>
        </table>
    </div>
    <div id="tab2" title="tab2" style="padding:10px">
        <table id="list_tab2" class="easyui-datagrid" style="width:358px;height: 434px"
               data-options="rownumbers:true">
            <thead>
            <tr>
                <th data-options="field:'info',width:85,align:'left',resizable:false">
                    info
                </th>
                <th data-options="field:'content',width:130,align:'left',resizable:false">
                    content
                </th>
                <th data-options="field:'retrievePerson',width:85,align:'left',resizable:false">
                    retrievePerson
                </th>
            </tr>
            </thead>
            <tbody>
            <tr>
                <td>1<br>2<br>3<br>4</td>
                <td>content 1234567890, 1234567890,, 12345678910,, ,</td>
                <td>223311,......<br><a>See All</a></td>
            </tr>
            </tbody>
        </table>
    </div>
</div>

</body>

<script type='text/javascript'>
    $(function () {
        $('#list_tab1').datagrid({
            onSelect: function (index, data) {
            }
        });
        $('#list_tab2').datagrid({
            onSelect: function (index, data) {
            }
        });
//        $('#tab').tabs({
//            onSelect: function (title, index) {
//                if (index === 0) {
//                    $('#list_tab1').datagrid('resize');
//                    console.log("list_tab1");
//                } else if (index === 1) {
//                    $('#list_tab2').datagrid('resize');
//                    console.log("list_tab2");
//                }
//            }});
    });
</script>
</html>

Pages: [1]