JQuery EasyUI的常用组件

2021-06-28 09:06

阅读:614

标签:cti   轻量级   input   validate   开发人员   页脚   创建   datebox   box   

jQuery EasyUI 是一个基于 jQuery 的框架,集成了各种用户界面插件,该框架提供了创建网页所需的一切,帮助您轻松建立站点。

注:本次介绍的JQuery EasyUI版本为1.5版。

一.表单

form提供了各种方法来操作执行表单字段,比如:ajax提交, load, clear等等。当提交表单的时候可以调用validate方法检查表单是否有效。

用法:

使用form标签创建

 


 

 使用jquery实现表单的异步提交:

$(‘#ff‘).form({    
    url:...,    
    onSubmit: function(){ 
        //提交表单时执行的操作 
    },    
    success:function(data){    
       //提交成功后返回的结果 
    }    
});    
// 提交表单    
$(‘#ff‘).submit();  

 通过以上操作就可以使用form表单将数据提交到后台。

 

二.数据表格(数据表格)

 

DataGrid以表格形式展示数据,并提供了丰富的选择、排序、分组和编辑数据的功能支持。DataGrid的设计用于缩短开发时间,并且使开发人员不需要具备特定的知识。它是轻量级的且功能丰富。单元格合并、多列标题、冻结列和页脚只是其中的一小部分功能。

用法:

html标签:


编码 名称 价格

 用jquery接受数据:

$(‘#dg‘).datagrid({    
    url:‘datagrid_data.json‘,       
});  

 就可以将后台数据以表格的方式展现到前台。

三.可编辑数据表格

首先需要加载edatagrid扩展,加载完成后才能使用。

在HTML标签里面创建数据表格:


Item ID Product ID List Price Unit Cost Attribute

 jquery操作:

$(‘#tt‘).edatagrid({    
    url: ‘datagrid_data.json‘,    
    saveUrl: ...,    
    updateUrl: ...,    
    destroyUrl: ...    
});  

 就可以通过双击修改表格数据。

常用方法:

$(‘#tt‘).edatagrid("saveRow");//保存编辑行并发送到服务器
$(‘#tt‘).edatagrid("destroyRow");//销毁当前选择的行
$(‘#tt‘).edatagrid("addRow");//添加一个新的空行

 以上就是jquery easyui的一些常用组件。

 

JQuery EasyUI的常用组件

标签:cti   轻量级   input   validate   开发人员   页脚   创建   datebox   box   

原文地址:http://www.cnblogs.com/wujianrui/p/7143385.html


评论


亲,登录后才可以留言!