easyUI之表單驗證validate

文本框校驗,在easyUI的表單提交中,最常見的就是對文本框的校驗,不同類型的輸入項需要不同的校驗類型,用戶可以使用自帶的驗證類型也可以進行自定義。

1、普通文本框的非空校驗


<input id="vv" class="easyui-validatebox" data-options="required:true" />

其中class屬性爲必寫項,如果不寫驗證框架則會缺少警告樣式,required表示該文本框是否爲必填項,爲true時表示必填。

2、自定義驗證類型

有時在進行表單驗證時,有些文本框非必填但若輸入內容卻需要驗證內容的合法性,則需要用到validType屬性。easyUI提供了驗證類型的擴展實現方法如下,使用時與第一種區別不大,只是多了一個validType屬性,如

$.extend($.fn.validatebox.defaults.rules,{
    NotEmpty : { // 非空字符串驗證。 easyui 原裝required 不能驗證空格
                validator : function(value, param) {
                    return $.trim(value).length>0;
                }, 
                message : '該輸入項爲必輸項'
            },
    integer : {// 驗證整數
                validator : function(value) {
                    return /^[+]?[0-9]+\d*$/i.test(value);
                },
                message : '請輸入整數'
            },          
     english : {// 驗證英語
                validator : function(value) {
                    return /^[A-Za-z]+$/i.test(value);
                },
                message : '請輸入英文'
            },
});

文本框在應用驗證框架時,表示非必填,但是填入了以後判斷是否爲整數,使用方法如下。(常見的校驗還有如身份證號、電子郵件等,有需要的可以直接下載easyUI常用校驗)

<input id="vv" class="easyui-validatebox" data-options="validType:'integer'" />

3、自定義表單驗證函數
有時根據實際需要,當表單驗證未通過後需要將焦點定位到第一個未驗證通過的文本框,可以通過下列自定義函數實現:

其中id指的是提交的表單的id,因此必須要給提交的表單一個id值。

function validate(id){
    var validate = $("#"+id).form('validate')
    if (!validate) {
       $.messager.alert("確認", '請正確填寫表單!',"",function(){
       $("#"+id).find(".validatebox-invalid:first").focus();
                  });
                  return false
              }
              return true
           }

注:若希望查看未通過的文本框的id,則可以調用代碼

alert($("#"+id).find(".validatebox-invalid:first").attr("id"));

轉載自 https://blog.csdn.net/xiaoxiangshenjian/article/details/52813292

4.easyui給combobox賦值

$('#matchManipulator').combobox('setValue','${equipment.matchManipulator}');
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章