EasyUI Forum
November 04, 2025, 01:33:28 PM *
Welcome, Guest. Please login or register.

Login with username, password and session length
News:
 
   Home   Help Search Login Register  
Pages: [1]
  Print  
Author Topic: [SOLVED] enter in modal window, and page will refresh  (Read 10340 times)
LoreYun
Newbie
*
Posts: 4


View Profile
« 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>
« Last Edit: May 11, 2016, 07:21:46 PM by LoreYun » Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #1 on: May 11, 2016, 06:49:12 PM »

Please try this code to prevent from submitting your form.
Code:
$('#new_group_name').keydown(function (e) {
    if (e.which === 13) {
        $('#submit_group').click();
        e.preventDefault();
    }
})
Logged
LoreYun
Newbie
*
Posts: 4


View Profile
« Reply #2 on: May 11, 2016, 07:21:17 PM »

Hi stworthy,
It's worked! Thank you very much! Smiley
Logged
Pages: [1]
  Print  
 
Jump to:  

Powered by MySQL Powered by PHP Powered by SMF 1.1.18 | SMF © 2013, Simple Machines Valid XHTML 1.0! Valid CSS!