jquery easyui常用form控件的使用

阅读更多

easyui为我们提供的简单的验证功能，验证方法包括：数据格式的验证，长度的验证，是否为必输项的验证，将需要验证的属性配置到data-options中即可。

1 数据格式验证：

（1）：必输项：

          

 (2)格式的验证：

         



（3）长度范围的验证：

      

（4）numerbox：

      

      method：$('#mm').numberbox(setValue,getValue)

（5）numberspinner：

     
     

(6)combo

 

  
Select a language
  Java

  C#

  Ruby

  Basic

  Fortran
 

js：  $(function(){
   $('#cc').combo({
    required:true,
    editable:false
   });
   $('#sp').appendTo($('#cc').combo('panel'));
   $('#sp input').click(function(){
    var v = $(this).val();
    var s = $(this).next('span').text();
    $('#cc').combo('setValue', v).combo('setText', s).combo('hidePanel');
   });
  });

(7)combobox：

I: 
  Alabama
  Alaska
  Arizona
 

II： 

method：  function loadData(){
   $('#cc').combobox({
    url:'combobox_data.json',
    valueField:'id',
    textField:'text'
   });
  }
  function setValue(){
   $('#cc').combobox('setValue','CO');
  }
  function getValue(){
   var val = $('#cc').combobox('getValue');//如果是多选，则调用方法：getValues，return：val1,val2,val3
   alert(val);
  }
  function disable(){
   $('#cc').combobox('disable');
  }
  function enable(){
   $('#cc').combobox('enable');
  }

 

(8)datepicker

    

    js:function formatterDate(data){

     var year = date.getFullYear();

     var month = date.getMonth + 1;

     var date = date.getDate();

    if(month < 10){

      month = '0' + month;

 }

   return year + '-' + month + '-' + date;

 }