微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

JQuery EasyUI的一些常用组件

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

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

一.表单

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

用法

使用form标签创建

rush:js;">

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

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

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

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

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

用法

html标签

rush:js;">
名称

用jquery接受数据:

rush:js;"> $('#dg').datagrid({ url:'datagrid_data.json',});

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

三.可编辑数据表格

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

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

rush:js;"> Box',options:{required:true}}">Item ID
Box',options:{precision:1}}">List Price Box">Unit Cost

jquery操作:

rush:js;"> $('#tt').edatagrid({ url: 'datagrid_data.json',saveUrl: ...,updateUrl: ...,destroyUrl: ... });

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

常用方法

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

以上所述是小编给大家介绍的JQuery EasyUI的一些常用组件。编程之家 jb51.cc 收集整理的教程希望能对你有所帮助,如果觉得编程之家不错,可分享给好友!感谢支持

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐