Question

我现在正在使用easyui和bootstrap更新jsp。问题是，当文档确实存在时，easyui会立即检查所需的属性。因此，所有文本字段均显示为红色。原始解决方案是将表单设置为novalidate。但是，在用户输入之后，所有字段都无法验证。在这一点上，我完全是堆砌。我该怎么办？非常感谢。

这是我的标题

    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Insert title here</title>

    <link rel="stylesheet" href="/jslib/jquery-easyui-1.5.1/themes/icon.css">
    <script type="text/javascript" src="/js/jquery-3.2.1.min.js" /></script>
    <script type="text/javascript" src="/js/popper.js"/></script>
    <script type="text/javascript" src="/jslib/bootstrap-4.0.0/js/bootstrap.min.js" /></script>
    <link rel="stylesheet" href="/jslib/bootstrap-4.0.0/css/bootstrap.min.css" />
    <script type="text/javascript" src="/jslib/jquery-easyui-1.5.1/jquery.easyui.min.js" /></script>
    <link rel="stylesheet" href="/jslib/jquery-easyui-1.5.1/themes/bootstrap/easyui.css" />
        <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">  
    <style>
        .form-control{
            width: 97%;
        }
        label{
            font-size: 1.5em;
        }
        h4{
            font-size: 2.25em;
        }
        h5{
            font-size: 2em;
        }
        h6{
            font-size: 1.75em;
        }
        .sub-title{
            text-shadow: 0 0 3px #888888;
        }
        /*For easyUI modal mask*/
        .window-mask {
            position: fixed; /* Stay in place */
            left: 0;
            top: 0;
            width: 100%; /* Full width */
            height: 100%; /* Full height */
            overflow: hidden; /* Enable scroll if needed */
        }       
    </style>
</head>

这是我的输入字段

    <input id="engName" name="engName" class="form-control easyui-textbox" data-options="required:true,validType:'email'">

我的脚本

    $.fn.datebox.defaults.parser = function(s) {
                if (s) {
                    var ss = s.split('/');
                    var d = parseInt(ss[0],10);
                    var m = parseInt(ss[1],10);
                    var y = parseInt(ss[2],10);
                    if (!isNaN(y) && !isNaN(m) && !isNaN(d)){
                        return new Date(y,m-1,d);
                    } else {
                        return new Date();
                    }
                } else {
                    return new Date();
                }
            };          

            $('#panel').panel({
                width:'100%',
                height:'auto',
                noheader: true,
                border: false
            }); 
            $('#dob').datebox({
                required: true,
                editable: false
            }); 
    <c:if test="${not empty caseID}">
                $.post('/onlineform/pcfb-form/loadPatientData/' + "${caseID}", function(result) {
                    if(result){
                        var dob = result.dob;
                        result.dob = '';
                        $('#patient').form('load', result);
                        $('#chinName').textbox('setValue',result.chineseName);      
                        $('#engName').textbox('setValue',result.englishName);   
                        $('#sex').combobox('setValue',result.gender);
                        $('.datebox input').val(dob);
                        var opts = $('#dob').datebox('options');
                        $('#dob').textbox('setValue',opts.formatter(new Date(dob)) );
                    }
                });       
            </c:if>

            $('#patient').form({
                url:'/onlineform/pcfb-form/newpatientSubmit',
                novalidate:true,
                onSubmit: function(param){
                    var f = this;
                    var opts = $.data(this, 'form').options;
                    if($(this).form('enableValidation').form('validate')== false){
                        $.messager.alert('Warning','Please enter all the required field before submit','warning');
                        return false;
                    }
                    $.messager.confirm('Confirm to Sumbit?', displayForm() ,function(r){
                        if (r){
                            var onSubmit = opts.onSubmit;
                            opts.onSubmit = function(){};
                            $(f).form('submit');
                            opts.onSubmit = onSubmit;
                        }               
                    })
                    return false;
                },
                success:function(data){
                    alert('New Patient is created');
                    window.parent.closeTab2();
                }
            });

            resizePage();
            $('#patient').form('enableValidation')
        });

easyui在用户尝试输入之前验证文本字段

0 个答案: