JQuery EasyUI(40)

最新推荐文章于 2023-03-31 09:46:14 发布
最新推荐文章于 2023-03-31 09:46:14 发布
阅读量301 收藏
点赞数
分类专栏： WEB - jQuery EasyUI
原文链接：https://study.163.com/course/courseMain.htm?courseId=943002
版权

                     第三十二章： DataGrid（数据表格）组件[9]

学习要点：

  1. 剩下的方法和事件

 一、剩下的方法和事件

DataGrid列事件
事件名参数说明
onLoadSuccessdata在数据加载成功的时候触发。
onLoadErrornone在载入远程数据产生错误的时候触发。
onBeforeLoadparam在载入请求数据之前触发，如果返回false可终止载入数据。
onClickRowrowIndex,rowData在用户点击一行的时候触发，参数包括：rowIndex：点击的行的索引值，该索引值从0开始。rowData：对应于点击行的记录。
onDblClickRowrowIndex,rowData在用户双击一行的时候触发，参数包括：rowIndex：点击的行的索引值，该索引值从0开始。rowData：对应于点击行的记录。
onClickCellrowIndex,field,value在用户点击一个单元格的时候触发。
onDblClickCellrowIndex,filed,value在用户双击一个单元格的时候触发。
onSortColumnsort,order在用户排序一列的时候触发，参数包括：sort：排序列字段名称。order：排序列的顺序（ ASC或DESC）。
onResizeColumnfield,width在用户调整大小的时候触发。
onSelectrowIndex,rowData在用户选择一行的时候触发，参数包括：rowIndex：选择的行的索引值，索引从0开始。rowData：对应于所选行的记录。
onUnselectrowIndex,rowData在用户取消选择一行的时候出发，参数包括：rowIndex：选择的行的索引，索引从0开始。rowData：对应于所选行的记录。
onSelectAllrows在用户选择所有行的时候触发。
onUnSelectAllrows在用户选择取消所有行的时候触发。
onBeforeEditrowIndex,rowData在用户开始编辑一行的时候触发。参数包括：rowIndex：编辑行的索引，索引从0开始。rowData：对应于编辑行的记录。
onAfterEditrowIndex,rowData,changes在用户完成编辑一行的时候触发。参数包括：rowIndex：编辑行的索引，索引从0开始。rowData：对应于完成编辑的行的记录。changes：更改后的字段（键）/值对。
onCancelEditrowIndex,rowData在用户取消编辑行的时候触发。参数包括：rowIndex：编辑行的索引。索引从0开始。rowData：对应于编辑行的记录。
DataGrid方法
事件名参数说明
optionsnone返回属性对象
getPagenone返回页面对象
getPanelnone返回面板对象
getColumnFieldsfrozen返回列字段，如果设置了frozen属性为true，将返回列的字段名。var opts = $(‘#dg’).datagrid('getColumnFields');//获得解冻列。var opts = $(‘#dg’).datagrid('getColumnFields',true);//获得冻结列。
getColumnOptionfield返回指定列属性。
resizeparam做调整和布局。
loadparam加载和显示第一页的所有行。如果指定了‘param’，它将取代‘queryParams’属性。通常可以通过传递一些参数执行一次查询。通过调用这个方法从服务器加载新数据。
reloadparam重载行，等同于‘load’方法。但是它将保存在当前页。
reloadFooterfooter重载页脚行。
loadingnone显示载入状态。
loadednone隐藏载入状态。
fitColumnnone使列自动展开/收缩到合适的DataGrid宽度。
fitColumnSizefield固定列大小。如果‘field’参数未配置，所有列大小将都是固定的。
fitRowHeightindex固定列指定高度。如果‘index’参数为配置，所有行高度都是固定的。
freezeRowindex冻结指定行，当DataDrid表格向下滚动的时候始终保持被冻结的行显示在顶部。
autoSizeClumnfield自动调整列宽度以适应内容。
loadDatadata加载本地数据，旧的行将被移除。
getDatanone返回加载完毕后的数据。
getRowsnone返回当前页的所有行。
getFooterRowsnone返回页脚行。
getRowIndexrow返回指定行的索引号，改行的参数可以是一行记录或一个ID字段值。
getCheckednone在复选框被选中的时候返回所有行。
getSelectednone返回第一个被选中的行或没有别选中的行则返回null。
getSelectionsnone返回所有被选中的行，当没有记录被选中的时候将返回一个空数组。
clearSelectionsnone清除所有选择的行。
clearCheckednone清除所勾选的行。
scrollToindex滚动到指定的行。
heighlightRowindex高亮一行。
selectAllnone选择当前页中所有的行。
unselectAllnone取消选择所有当前页中所有的行。
selectRowindex 选择一行， 行索引从0开始。
selectRecordidValue通过ID值参数选择一行。
unselectRowindex取消选择一行。
checkAllnone勾选当前页中的所有行。
uncheckAllnone取消勾选当前页中的所有行。
checkRowindex勾选一行，行索引从0开始。
 uncheckRowindex取消勾选一行，行索引从0开始。
beginEditindex开始编辑行。
editEditindex结束编辑行。
cancelEditindex取消编辑行。
getEditorsindex

获取指定行的编辑器。每个编辑器都有以下属性：actions：编辑器可以执行的动作。同编辑器定义。target：目标编辑器的JQuery对象。field：字段名称。type：编辑器类型，比如：‘text’，‘combobox’,‘databox’等。

getEditoroptions获取指定编辑器，options包含两个属性：index：行索引。field：字段名称。
refreshRowindex刷新行。
validateRowindex验证指定的行，当验证有效的时候返回true。
updateRowparam更新指定行，参数包含下列属性：index：执行更新操作的行索引。row：更新行的新数据。
appendRowrow追加一个新行，新行将被添加到最后的位置。
insertRowparam插入一个新行，参数包括以下属性：index：要插入的行索引，如果该索引值未定义，则追加新行。row：行数据。
deleteRowindex删除行。
getChangestype从上一次的提交获取改变的所有行。类型参数指明用哪些类型改变的行，可以使用的值有：inserted，deleted，updated等。当类型参数未配置的时候，返回所有改变的行。
acceptChangesnone提交所有从加载或者上一次调用acceptChange函数后更改的数据。
rejectChangesnone回滚所有从创建或者上一次调用acceptChange函数后更改的数据。
mergeCellsoptions合并单元格，options包含以下属性：index：行索引。field：字段名称。rowspan：合并的行数。colspan：合并的列数。
showColumnfield显示指定的列。
hideColumnfield隐藏指定的列。
<!DOCTYPE html>
<html>
  <head>
    <title>JQuery Easy UI</title>
    <meta charset="utf-8"/>
    <script type="text/javascript" src="easyui/jquery.min.js"></script>
    <script type="text/javascript" src="easyui/jquery.easyui.min.js"></script>     
    <script type="text/javascript" src="easyui/locale/easyui-lang-zh_CN.js"></script>     
    <script type="text/javascript" src="js/index.js"></script> 
    <link rel="stylesheet" type="text/css" href="easyui/themes/default/easyui.css"/>
    <link rel="stylesheet" type="text/css" href="easyui/themes/icon.css"/>  
    <style>
        .textbox{
            height:200px;
            margin:0;
            padding:0 2px;
            box-sizing:content-box;
       }
    </style>            
</head>
  <body>
       <table id="box"></table>
     <div id="tb" style="padding:5px;">
      <div style="margin-buttom:5px;">
        <a href="#" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="obj.add();">添加</a>
        <a href="#" class="easyui-linkbutton" iconCls="icon-deit" plain="true" onclick="obj.edit();">修改</a>
        <a href="#" class="easyui-linkbutton" iconCls="icon-remove" plain="true"
onclick="obj.remove();">删除</a>
        <a href="#" class="easyui-linkbutton" iconCls="icon-save" plain="true" style="display:none" id="save">保存</a>
        <a href="#" class="easyui-linkbutton" iconCls="icon-redo" plain="true" style="display:none" id="redo">取消编辑</a>
      </div>
        <div style="padding:0 0 0 7px;color='#ccc'">
           查询账号：<input type="text" name="user" class="textbox" style="width:100px">
           创建时间从：<input type="text" name="date_from" class="easyui-datebox" 
 editable="false" style="width:100px"> 到：<input type="text" name="date_to" class="easyui-datebox" editable="false" style="width:100px">
           <a href="#" class="easyui-linkbutton" iconCls="icon-search" onclick="obj.search();">查询</a>
        </div>
     </div>

     <div id="menu" class="easyui-menu" style="width:120px;display:none;">
       <div onclick="" iconCls="icon-add">增加</div>
       <div onclick="" iconCls="icon-remove">删除</div>
       <div onclick="" iconCls="icon-edit">修改</div>
     </div>

     <input type="button" value="按钮" onclick="abc()">
  </body>
</html>

 

//扩展dateTimeBox
$.extend($.fn.datagrid.defaults.editors,{
    datetimebox:{
        init:function(container,options){
           var input = $('<input type="text">').appendTo(container);
           options.editable = false;
           input.datetimebox(options);
           return input;
         },
        getValue:function(target){
            return $(target).datetimebox('getValue');
         },
        setValue:function(target){
           $(target).datetimebox('setValue',value);
         },
        resize:function(target){
           $(target).datetimebox('reSize',width);
         },
        destory:function(target){
           $(target).datetimebox('destory');           
         },
    }
});

$(function(){
      
      obj = {
       editRow:undefined,
       search:function(){
            $('#box').datagrid('load',{
            user:$.trim($('input[name="user"]').val()),
            date_from:$('input[name="date_from"]').val(),
            date_to:$('input[name="date_to"]').val();
       });
      },
       add:function(){
        $('#save,#redo').show();

       /*
         //当前页行结尾添加
        $('#box').datagrid('appendRow',{
               user:'bnbbs',
               email:'bnbbs@163.com',
               data:'2014-11-11',
     });
      */

         if(this.editRow == undefined){

        //添加一行
        $('#box').datagrid('insertRow',{
            index:0,
            row:{
               /*
               user:'bnbbs',
               email:'bnbbs@163.com',
               data:'2014-11-11', 
               */       
          }
      });

         //将第一行设置为可编辑状态。
         $('#box').datagrid('beginEdit',0);
         this.editRow = 0;     
       }
    },

     save:function(){
        //这两句不应该放这里，应该是保存成功之后在执行。
        //$('#save,#redo').hidden();
        //$('#box').dategrid('rejectChanges');
        //将第一行设置为结束编辑状态。
         $('#box').datagrid('endEdit',this.editRow);        
     },

     redo:function(){
        $('#save,#redo').hidden();
        $('#box').dategrid('rejectChanges');
        this.editRow = undefined;
     },

     edit:function(){
        var rows = $('#box').datagrid('getSelections');
        if(rows.length == 1){

          if(this.editRow != undefined){
             $('#box').datagrid('endEdit',this.editRow);
           }

          if(this.editRow == undefined){
             var index = $('#box').datagrid('getRowIndex',rows[0]);
             $('#save,#redo').show();
             $('#box').datagrid('beginEdit',index);
             this.editRow = index;
             $('#box').datagrid('unselectRow',index);             
           } 

         }else{
           $.messager.alert('警告','修改必须或只能选择一行','warning');
         }    
     },

     remove:function(){
        var rows = $('#box').datagrid('getSelections');
        if(rows.length > 0){
          $.messager.infirm('确定操作','你正在要删除所选的记录吗？',function(flag){
             if(flag){
               var ids = [];
               for(var i= 0;i<rows.length;i++){
                   ids.push(rows[i].id);
                }
                 console.log(ids.join(','));

                $.ajax({
                     type:'POST',
                     url:'delete.php',
                     data:{
                       ids:ids.join(','),
                    },
                     beforeSend:function(){
                         $('#box').datagrid('loading');
                    },
                     success:function(data){
                        if(data){
                         $('#box').datagrid('loaded');
                         $('#box').datagrid('load');  
                         $('#box').datagrid('unselectAll'); 
                         $.messager.show({
                           title:'提示',
                           msg:data + '个用户被删除！',
                          });                         
                        }
                    },
                 });
              }
           });  
        }else{
          $.messager.alert('提示','请选择要删除的记录！','info');
       }
     },     
   };

     $('#box').datagrid({
        width:600,
        //url:'content.json',
        url:'user.php',
        title:'用户列表',
        iconCls:'icon-search',
        striped:true,
        nowrap:true,
        rownumbers:true,
        //singleSelect:true, 
        
        /*
        fitColumns:true,
        frozenColumns:[[
         {
               field:'id',
               title:'编号',
               sortable:true,
               width：100,
               checkbox:true,
             },
             {
               field:'user',
               title:'账号',
               sortable:true,
               width：100, 
               editor:{
                 type:'validatebox',
                 options:{
                      required:true,
                  },
                },             
             },
         ]],
         */
        fitColumns:false,
        columns:[[
             {
               field:'id',
               title:'编号',
               sortable:true,
               width：100,
               checkbox:true,
             },
             {
               field:'user',
               title:'账号',
               sortable:true,
               width：100, 
               editor:{
                 type:'validatebox',
                 options:{
                      required:true,
                  },
                }, 
              formatter:function(value,rowData,rowIndex){
                  return '[' + value + ']';
               },            
             },
             {
               field:'email',
               title:'邮箱',
               sortable:true, 
               width：100,
               editor:{
                 type:'validatebox',
                 options:{
                      required:true,
                      validType:'email',
                  },
                },                
             },
             {
               field:'date',
               title:'注册时间',
               sortable:true,
               width：100,
               editor:{
                 type:'datebox',
                 options:{
                      required:true,
                  },
                }, 
  
             },
      ]],
        toolbar:'#tb',        
        pagination:true,
        pageSize:10,
        pageList:[10,20,30],
        pageNumber:1,
        pagePosition:'top',
        pagePosition:'both',
        pagePosition:'bottom',
        sortName:'date',
        sortOrder:'DESC',

        onDblClickRow:function(rowIdex,rowData){

         if(obj.editRow != undefined){
          $('#box').datagrid('endEdit',obj.editRow);
        }

         if(obj.editRow == undefined){
          $('#save,#redo').show();
          $('#box').datagrid('beginEdit',rowIndex);
          obj.editRow = rowIndex;
  }         
},
        onAfterEdit:function(rowIndex,rowData,changes){
         $('#save,#redo').hidden();

         var inserted = $('#box').datagrid('getChanges','inserted');
         var updated = $('#box').datagrid('getChanger','updated');

         var url = info ='';
         
         //新增用户
         if(inserted.length > 0){
           url:'add.php',
           info:'新增', 
        }

        //修改用户
         if(updated.length > 0){
            url:'update.php',
           info:'修改',                 
       }

           $.ajax({
                     type:'POST',
                     url:url,
                     data:{
                       row:rowData,
                    },
                     beforeSend:function(){
                         $('#box').datagrid('loading');
                    },
                     success:function(data){
                        if(data){
                         $('#box').datagrid('loaded');
                         $('#box').datagrid('load');  
                         $('#box').datagrid('unselectAll'); 
                         $.messager.show({
                           title:'提示',
                           msg:data + '个用户被'+info+'成功！',
                          });
                          obj.editRow = undefined;                         
                        }
                    },
                 });
          //console.log(rowDate);
   },

   onHeadContextMenu:function(e,filed){
      //alert("右击标题");
      console.log(filed);
  }

  onRowContextMenu:function(e,rowIndex,rowData){
     e.preventDefault(),
     //console.log(rowIdex),
      console.log(rowData),

    $('#menu').menu('show',function(){
           left:e.pageX,
           top:e.pageY,
    });
  }

  onClickRow:function(){
    alert('单击一行的时候触发！');
  },

  onClickCell:function(rowIndex,field,rowdata){
    alert('单击一个单元格的时候触发！'+field);
 },

  onUnselect:function(){
  alert('取消时触发！');
 },

 onCheck:function(){
   alert('勾选时触发！');
},
 
onCancelEdit:function(){
  alert('取消编辑时触发！');
 }, 

onSortColumn:function(sort,order){
  alert('选择排序时触发！'+sort+order);
},
 
});

function abc(){
   //$('#box').datagrid('deleteRow',0);
   //$('#box').datagrid('checkAll');
   //$('#box').datagrid('highlightRow',0);
   //$('#box').datagrid('mergeCells',{
       index:0,
       field:'user',
       //rowspan:5,
       //colspan:3,
    });
   
}
[
  {
   "user":"蜡笔小新",
   "emial":"xiaoxin@163.com",
   "date":"2014-10-01",
  },
  {
   "user":"樱桃小丸子",
   "emial":"xiaowanzi@163.com",
   "date":"2014-10-02",
  },
  {
   "user":"黑崎一护",
   "emial":"yihu@163.com",
   "date":"2014-10-03",
  },
]
<?php
   header('Content-Type:text/html;chartset=utf-8');
   define('DB_HOST','localhost');
   define('DB_USER','root');
   define('DB_PWD','123456');
   define('DB_NAME','thinkphp');    

  $conn = @mysql_connect(DB_HOST,DB_USER,DB_PWD)or die('数据库连接失败：'.mysql_error());

  @mysql_select_db(DB_NAME)or die('数据库错误：'.mysql_error());

  @mysql_query('SET NMAES UTF8')or die('字符集错误：'.mysql_error());
?>

<?php

   //记得是：user.php

   require 'config.hph';

   $page = $_POST['page'];
   $pageSize = $_POST['row'];
   $first = $pageSize * ($page - 1);

   $order = $_POST['order'];
   $sort = $_POST['sort'];
   
   $sql = '';
   $user = '';

   $datefrom = '';
   $dateto = '';

   if(isset($_POST['user']) && !empty($_POST['user'])){
    $user = "user LINK '%{$_POST['user']}%' AND ";
    $sql .= $user;
  }

   if(isset($_POST['$datefrom']) && !empty($_POST['$datefrom'])){
    $datefrom = "date >='{$_POST['$datefrom']}' AND ";
    $sql .= $datefrom;
  }


   if(isset($_POST['$dateto']) && !empty($_POST['$dateto'])){
    $dateto = "date <='{$_POST['$dateto']}' AND ";
    $sql .= $dateto;
  }


   if(!empty($sql)){
     sql = 'WHERE '.substr($sql,0,-4);
   }


   $query = mysql_query("SELECT id,user,email,data FROM think_user $sql ORDER BY $order $sort LIMIT $first,$pageSize") or die('SQL 错误！');
   $total = mysql_num_rows(mysql_query("SELECT id,user,email,data FROM think_user $sql"));
   
   $json ='';

   while (!!$row = mysql_fetch_array($query,MYSQL_ASSOC)){
      $json .= json_encode($row).',';
    }
     
   
   echo '{"total":'.$total.',"rows":['.$json.'],"footer":[{"user":"统计","email":"统计","date":"统计"}]}'; 

   $json  = substr($json,0,-1);


   mysql_close();
?>
<?php

   //记得是：delete.php

   require 'config.hph';

   $ids = $_POST['ids'];

   mysql_query("DELETE FROM think_user WHERE id IN ($ids)") or die('SQL 错误！');

   echo mysql_affected_rows();

   mysql_close();
?>
<?php

   //记得是：add.php

    require 'config.hph';

    $row = $_POST['row'];
    $user = $_row['user'];
    $email = $_row['email'];
    $date = $_row['date'];

   mysql_query("INSERT INTO think_user (user,email,date) VALUE ('$user','$email','$date') ") or die('SQL 错误！');

   echo mysql_affected_rows();

   mysql_close();

?>
<?php

   //记得是：update.php

    require 'config.hph';

    $row = $_POST['row'];
    $id = $_row['id'];
    $user = $_row['user'];
    $email = $_row['email'];
    $date = $_row['date'];

   mysql_query("UPDATE think_user SET user ='$user',email ='$email',date ='$date' where id='$id'") or die('SQL 错误！');

   echo mysql_affected_rows();

   mysql_close();

?>

 

 

作者：Roger_CoderLife

链接：https://blog.csdn.net/Roger_CoderLife/article/details/103507367

本文根据网易云课堂JQuery EasyUI视频教程翻译成文档，转载请注明原文出处，欢迎转载

jQuery EasyUI 1.9.4 中文帮助文档　离线chm
04-19
这是一套关于jQuery EasyUI的中文帮助文档，在线帮助文档 进行整理，生成chm文件，便于开发时或者离线对jquery easyi控 件的属性、文法、事件等内容的查看。 jQuery EasyUI 版本1.9.4。文档为chm格式，方便开发...
jqueryEasyUI
07-16
**jQuery EasyUI 知识点详解** jQuery EasyUI 是一个基于 jQuery 的前端框架，它提供了一系列的 UI 组件，使得开发者能够快速构建出美观且功能丰富的 Web 应用程序。这个框架大大简化了网页界面的设计工作，使得...
easyUI表格高亮显示
weixin_43626452的博客
03-31 266
easyUI表格高亮显示。
easyui datagrid表格点击行高亮
qq_42750608的博客
04-29 1792
$('#dg').datagrid({ rownumbers : true, singleSelect : true,//多选 autoRowHeight : false, //自动行高 pagination : false, //显示表格下面的分页插件 fitColumns : true, //字段自动分配 striped : false,//显示斑马线背景 collapsibl...
Easyui中datagrid自定义rowStyler，鼠标选中高亮及滑过高亮背景色失效
weixin_30613343的博客
01-29 1167
解决办法：设置.datagrid-row-selected .datagrid-row-over,.datagrid-header td .datagrid-header-over样式优先级即可。 .datagrid-row-selected{ background: #fced89 !important; /*调整优先级,否则会被自定义rowStyler覆盖*/ ...
easyui DataGrid行根据状态高亮显示
书中自有妍如玉的博客
11-05 437
【代码】easyui DataGrid行根据状态高亮显示。
使用easyui的可编辑数据表格(editable datagrid)
BoringError的博客
07-18 1万+
相关的参考属性、方法和事件： 1、列属性： 2、datagrid事件： 3、datagrid方法： 4、示范代码： &lt;table id="myTable"&gt;&lt;/table&gt; &lt;script type="text/javascript"&gt; $(function(){ //定义被编辑的行号 var rowNu...
jQuery EasyUI的api
05-09
- **EasyUI 组件**: EasyUI 将jQuery的功能进一步扩展，提供了如`datagrid`（数据网格）、`panel`（面板）、`dialog`（对话框）等丰富的UI组件。 2. **组件的使用**： - **初始化组件**: 使用`$(selector)....
jQuery EasyUI 1.3.6 离线简体中文API文档
04-12
最新版本的jQuery EasyUI 1.3.6版全中文API汉化文档火热出炉，由于很多人和我要chm格式的，所以本次API我提供了2种版本的API，一个还是以前的EXE格式，另外一个就是人气颇高的chm格式。本次还将EasyUI 1.3.6版直接...
jQuery EasyUI 1.9.4 chm文档
03-07
针对jQuery EasyUI的1.9.0的在线帮助文档进行整理，生成chm文件，便于开发时或者离线对easyi控件的属性、文法、事件等内容的查看。
easyui validatebox 验证类型
热门推荐
LYBWWP
06-05 7万+
required: "必选字段",         remote: "请修正该字段",         email: "请输入正确格式的电子邮件",         url: "请输入合法的网址",         date: "请输入合法的日期",         dateISO: "请输入合法的日期 (ISO).",         number: "请输入合法的数字",
EasyUI中Validatebox验证框的简单使用
BADAO_LIUMANG_QIZHI的博客
06-21 732
场景 效果 属性 名称 类型 描述 默认值 required boolean 定义是否字段应被输入。 false validType string,array 定义字段的验证类型，比如 email、url，等等。可能的值： 1、验证类型字符串，应用单个验证规则。 2、验证类型数组，应用多个验证规则。单个字段上的多个验证规...
easyUI validate函数【总结篇-部分转】
weixin_30577801的博客
10-03 307
以下是自己总结和修改别人的帖子和资源整理出来的一些常用验证函数，备用，交流。 <body>邮箱验证：<input type="text" validtype="email" required="true" missingMessage="不能为空" invalidMessage="邮箱格式不正确" /><br />网址验证：<input type="te...
玩转EasyUI之ValidateBox
不忘初心
08-31 3093
需求背景 在如下界面中，要求客户端能自动验证用户输入的内容是否符合要求。其效果就是图中邮箱地址的效果，如果不符合要求，则用easyUI本身的样式来提示。这里邮箱的验证已经完成，可手机号码的验证却没有成功。 邮箱地址的代码：       手机号:                          邮箱地址:       
EasyUi Datagrid的基础使用
hongweideng的专栏
12-15 1259
Datagride的初始化方式 方式1 ：class类型创建，这个创建方式比较简单，如果在已知表格内容的情况下可以使用，还是挺漂亮的 [html] view plaincopy table class="easyui-datagrid">         thead>             tr>                 th 
EasyUI之验证框validatebox
sunpy
04-09 720
1.样式 validatebox(验证框)的设计目的是为了验证输入的表单字段是否有效。如果用户输入了无效的值，它将会更改输入框的背景颜色，并且显示警告图标和提示信息。该验证框可以结合form(表单)插件并防止表单重复提交。 2.练习1：验证输入字符长度及非空 validatebox 姓名：     $("#validateb
easyui ValidateBox validType字段设置多个校验规则
javaloveiphone的专栏
12-09 2万+
easyui ValidateBox validType字段设置多个校验规则1、单个校验无参数： <input id="vv" class="easyui-validatebox" data-options="required:true,validType:'email'" />2、单个校验有参数： <input id="pwd" name="pwd" type="password" c
JQuery DataGrid 中文文档
LEE_ZCF
04-05 4883
数据表格 继承$.fn.panel.defaults，使用$.fn.datagrid.defaults重载默认值。 依赖关系 控制面板缩放链接按钮分页 使用方法 table id="tt">table>   $('#tt').datagrid({       url:'datagrid_data.js
datagrid的合并单元格（合并行、并列）
hulufeng1203的专栏
03-03 8101
并列很简单： columns:[[         {field:'examId',title:'批次',width:150,align:'center',rowspan:2,         //添加超级链          formatter:function(value,rowData,rowIndex){             //function里面的三个参数代表当前
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值