EASYUI - 技术教程文章
easyui相关【图】
1：datagrid获取或太json格式的page方式一：2：方式二 2：easyui提示框1:右下角提示框$.messager.show({ title:‘提示‘, msg:‘删除成功‘, showType:‘show‘});2：确认提示框$.messager.confirm(‘提示‘,‘确定要删除‘+name+‘吗？‘,function(r){ if(r){ ... }}3:居中显示框$.messager.alert(‘info‘,‘提示‘,‘‘,function(){}); 3：jquery ajax请求1:$.post(url,{data},function(result){});2:function su...
easyui-datagrid自动合并行【代码】
1.目标 1.1表格初始化完成后，已经自动合并好需要合并的行； 1.2当点击字段排序后，重新进行合并； 2.实现 2.1 引入插件/*** author ____′↘夏悸* create date 2012-11-5***/ $.extend($.fn.datagrid.methods, {autoMergeCells : function (jq, fields) {return jq.each(function () {var target = $(this);if (!fields) {fields = target.datagrid("getColumnFields");}var rows = target.datagrid("getRows");var i = 0,j = ...
EasyUI配置和组件【代码】【图】
首先在webcontent添加配置文件新建静态或动态网站，在title的下面加入五个配置文件路径，注意:循序不能乱<!-- 顺序不可以乱 --> <!-- 1.jQuery的js包 --> <script type="text/javascript" src="jquery-easyui-1.4.4/jquery.min.js"></script> <!-- 2.css资源 --> <link rel="stylesheet" type="text/css" href="jquery-easyui-1.4.4/themes/default/easyui.css"> <!-- 3. 图标资源 --> <link rel="stylesheet" type="text/css" h...
jQuery EasyUI API 中文文档 - Tree树使用介绍
用 $.fn.tree.defaults 重写了 defaults。 依赖 draggable droppable 用法 Tree 能在 <ul> 元素里定义，此标记可以定义为叶节点和子节点。下面是一个示例： 复制代码代码如下:<ul id="tt"> <li> <span>Folder</span> <ul> <li> <span>Sub Folder 1</span> <ul> <li> <span><a href="#">File 11</a></span> </li> <li> <span>File 12</span> </li> <li> <span>File 13</span> </li> </ul> </li> <li> <span>File 2</span> </li> <li...
JQuery EasyUI 之 messager基本使用【代码】【图】
? 基本语法：$.messager.alert ( title , msg , icon , fn )； 其中，icon有四种设置："error"、"info"、"question"、"warning"。 ? $.messager.confirm(title, msg, fn)；<script type="text/javascript">$(function () {$.messager.confirm("操作提示", "您确定要删除吗？", function (data) {if (data) {alert("确定");}else {alert("取消");}});}); </script> ? $.messager.alert ( title , msg , icon , fn )；$(function(){...
EasyUI Tree 树 ——实现多级别菜单的展示，以及与后台数据的交互【代码】【图】
一 要引入的js css库 <link type="text/css" href="css/base.css" rel="stylesheet" /><link type="text/css" href="jquery-easyui-1.4/themes/default/easyui.css" rel="stylesheet" /><link type="text/css" href="jquery-easyui-1.4/themes/icon.css" rel="stylesheet" /><link type="text/css" href="css/icon.css" rel="stylesheet" /> <script type="text/javascript" src="jquery-easyui-1.4/jquery.min.js"></script><s...
EasyUI简单CRUD
<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta name="keywords" content="jquery,ui,easy,easyui,web" /> <meta name="description" content="easyui help you build your web page easily!" /> <title>短信管理</title> <link href="../Scripts/easyui/themes/default/easyui.css" rel="stylesheet" /> <li...
解决easyui tabs中href无法跨域跳转
<!DOCTYPE HTML> <html> <head><meta http-equiv="content-type" content="text/html" /><meta name="author" content="blog.anchen8.net" /><script type="text/javascript" src="__PUBLIC__/jquery-easyui-1.4.1/jquery.min.js"></script><script type="text/javascript" src="__PUBLIC__/jquery-easyui-1.4.1/jquery.easyui.min.js"></script><link rel="stylesheet" type="text/css" href="__PUBLIC__/jquery-easyui-1.4.1/the...
ASP.NET MVC5+EF6+EasyUI 后台管理系统（89）-国际化，本地化，多语言应用【代码】【图】
开篇早年写过一篇多语言的应用 ： 本地化(多语言) 讲述了如何创建多语言的资源文件，并利用资源文件来获得页面和请求的语言属性本次补充这篇文章，的原因是在实际项目中，有多种需要多语言的情况比如：日志要根据当前语言显示而有些情景比较复杂，我们可能的key是提取自数据中，或者说一些错误的提示和模型界面字段的显示下面我们回顾和新增一些实际应用1.多语言使用多语言基础使用，请跳转开篇早年写的连接中 本地化(多语言) ...
java+easyui实例【代码】【图】
1、首先引入easyui包在jsp页面上引用以下文件：<link rel="stylesheet" type="text/css" href="easyui/themes/default/easyui.css"><link rel="stylesheet" type="text/css" href="easyui/themes/icon.css"><script type="text/javascript" src="js/jquery-easyui-1.3.2/jquery-1.8.0.min.js"></script><script type="text/javascript" src="js/jquery-easyui-1.3.2/jquery.easyui.min.js"></script><script type="text/javascript...
EasyUI - Messager消息框【代码】【图】
全局设定：JavaScript代码：//设置按钮中的文字，默认是-ok/cancel ,可以任意设置文字，比如现在的-确认/取消 $.messager.defaults = {ok: ‘确认‘,cancel: ‘取消‘, } 第一种：效果： html代码：无 JavaScript代码：//第一种：警告窗口，最简单的一种 //参数依次是：标题，内容，内部图标，点击按钮后执行的事件 $.messager.alert(‘警告窗口‘, ‘消息内容！‘, ‘info‘, function () {alert("你点击了按钮！"); }); 第二种...
EasyUi Combox 多选 以及可能出现的问题 no result find for action Xxxx and result input 的说明
EasyUi Combobox 多选 以及可能出现的问题 no result find for action Xxxx and result input 的解决方法我个人遇到问题的时候，是这么个场景：原有需求是做个下拉选择某个属性的相应值，只支持单选即可。此时的下拉值对应的是一个关联表的ID号，后台用int类型接收。新需求里边提出了，这个下拉需要做成多选的，因为EasyUi的combobox有multiple属性（是否可多选），故继续使用combobox来做。那么问题来了，给combobox的multiple属...
[转]EasyUI 搭建后台登录界面和管理系统主界面
原文链接：EasyUI 搭建后台登录界面和管理系统主界面原文：https://www.cnblogs.com/rainbow70626/p/15229529.html
jqueryui和easyui区别
jQuery自带的一个可选ＵＩ库，但是非常可惜，一些关键的组件没有包含进去，如TreeView, DataGrid，还需要寻找第三方的插件。EasyUI是某公司开发的一套对私免费，对公收费的ＵＩ库，基于ＧＮＵ开源协议，不过只有付费了才能买到他们的源代码。是目前枯人接触过最优秀的一款基于jQuery的UI库，整体打包后不到300k， 几乎包含所有的常用组件。jQuery UI vs EasyUI: 二者冲突怎么办？jQueryUI和EasyUI的某些组件是命名冲突的，如 Dial...
javascript 中 easyui的使用案列【图】
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title>easyui的应用</title> <script src="easyui/jquery.min.js"></script> <script src="easyui/jquery.easyui.min.js"></script> <script src="easyui/locale/easyui-lang-zh_CN.js"></script> <link rel="stylesheet" href="easyui/themes/icon.css"> <link rel="stylesheet" href="easyui/themes/default/easyui.css"> <link rel="st...
EasyUI中DataGrid默认分页的问题【代码】
发现在table上直接写data-options后导致数据加载两遍，后来放到了$();中只加载一遍。 另外默认分页PageSzie的设置。 1$(function () {2//加载完后给星星加Tip 3 $("#dg").datagrid({4 rownumbers:true,5 url:‘datagrid_data1.aspx‘,6 method:‘get‘,7 fit: true,8 striped:true,9 pagination: true, 10 onLoadSuccess: function (data) { ...
项目总结—jQuery EasyUI- DataGrid使用【图】
概要 jQuery EasyUI是一个基于jquery的集成了各种用户界面的框架,使用easyui我们不需要写太多javascript代码，一般情况下我们只需要使用一些html标记来定义用户接口,easyui将我们需要的功能都已经封装好了,我们只要来调用easyui给我们提供的接口就可以了,今天我们来学习下easyui中的DataGrid 数据显示 我们可以在easyui-datagrid中显示数据,显示数据从大类上我们也分为两种,一种是datagrid显示的数据不是来自于数据库...
easyUI resizable组件使用【代码】
easyUI resizable组件使用：<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Document</title><script src="easyui/jquery.min.js"></script><script src="easyui/jquery.easyui.min.js"></script><script src="easyui/locale/easyui-lang-zh_CN.js"></script><script src="js/test005.js"></script><link rel="stylesheet" href="easyui/themes/default/easyui.css"><link rel="stylesheet" href="easyui/the...
jquery easyui toolbar 分割线问题
http://bbs.csdn.net/topics/390507228——————————————————————————————————将“<div class="datagrid-btn-separator" />”改为< span class="datagrid-btn-separator" style="vertical- align: middle; height: 15px;display:inline- block;float:none"></span>原文：http://www.cnblogs.com/cuizhf/p/5240329.html
[easyUI] datagrid 数据格 可以进行分页【代码】
1. 新建一个GridNode的类:publicclass GridNode {private Long id;private String title;//投票标题private Integer type;private String version;private String options;//备选项数private String participants;//参与人数//getter/setter/constructor省略 }2. 网页内新建一个table元素.3. script代码 $(function(){$(‘#dg‘).datagrid({url:‘server/demo7_server.jsp‘, //远程请求数据的url路径pagination:true, ...
JQuery EasyUI后台UI框架使用连载【代码】【图】
在正式了解 jQuery EasyUI 之前，我们先了解一下什么是 jQuery EasyUI。它的学习条件、市场上的同类产品、所支持的浏览器等。然后配置运行 jQuery EasyUI。一、什么是JQuery EasyUI jQuery EasyUI 是一组基于 jQuery 的 UI 插件集合，而 jQuery EasyUI 的目标就是帮助Web 开发者更轻松的打造出功能丰富并且美观的 UI 界面。开发者不需要编写复杂的JavaScript，也不需要对 css 样式有深入的了解，开发者需要了解的只有一些简单...
Easyui Datagrid 最后一行添加合计 Easyui Datagrid 修改显示行号列宽度【代码】【图】
Easyui Datagrid 最后一行添加合计有多种方法，由于我们列表的列比较多会出现横向滚动条，所以直接用它本身showfooter：true;会出现列表数据和合计行之间出现横向滚动条，所以选择列表最后追加合计行进行处理1、最后一行添加合计 后台计算好每页合计值 前端在列表最后追加一列 Easyui Datagrid 最后一行添加合计 就实现了2、 Easyui Datagrid 修改显示行号列宽度 .datagrid-htable{ w...
EasyUI选项卡页面处理示例【代码】【图】
<%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>Full Layout - jQuery EasyUI Demo</title><%@ include file="/common/taglibs.jsp"%><link id="easyuiTheme" href="${ctx}/res/js/easy...
jquery easyui的使用【图】
第一步下载jquery easyui 下载地址：http://www.jeasyui.com/download/index.php第二步创建Java web项目第三步导入相关的文件。。文件夹结构例如以下<link rel="stylesheet" type="text/css" href="easyui/themes/default/easyui.css"> <link rel="stylesheet" type="text/css" href="easyui/themes/icon.css"> <script type="text/javascript" src="easyui/jquery-1.7.2.min.js"></script> <script type="text/javascript"...
构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统（14）-系统小结【代码】【图】
原文:构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统（14）-系统小结不知不觉已经过了13讲，（本来还要讲多一讲是，数据验证之自定义验证，基于园友还是对权限这块比较敢兴趣，讲不讲验证还是看大家的反映），我们应该对系统有一个小结。首先这是一个团队开发项目，基于接口编程，我们从EasyUI搭建系统的框架开始，开始了一个样例程序对EasyUI的DataGrid进行了操作，并实现Unity的注入到容器，使程序 的性能大大提升，代...
SSH结合EasyUI系统（一）———简单介绍
鉴于前文《不仅仅是吐槽》，决定将自己学过的和在学的东西整理一下放进园子；做一个好园友！ 接下来将会持续更新的是近一段时间在学的java web中比较流行的框架SSH(Struts+Spring+Hibernate)结合EasyUI整合的demo，至于ssh的介绍，用我的理解一句话描述：Struts让Web与Action交互更简单，Hibernate解决了model与数据库的交互，spring相当于容器很好的将两则融合到一起。3大框架各自发挥了自己的特点，当然有利有弊，这里就不多叙...
解决EasyUI DataGrid删除行失败的方法【图】
笔者最近在做一个项目的后台，用到了EasyUI的datagrid控件，并开启了行内编辑功能，实际上也就是使用了edatagird这个空间，引用了edatagrid.js，一切似乎都做的顺风顺水，添加数据、修改数据都没有问题，然而到删除数据的时候居然没有反应，折腾了好几天也没有任何进展。截图如下：前台代码如下：<table id="lsdg" title="设备数据采集列表" singleSelect="true" rownumbers="true" fitColumns="true" toolbar="#toolbar...
解决bootstrap和easyUI部分css类冲突问题。
今天发现bootstrap和easyui的css类重复用了一个很笨的办法解决了，这种小事网上都不好搜啊。我先引用的bootstrap后引用的easy UI，bootstrap的会被覆盖，boot的样式不正常就是难看了点，easy UI的有问题页面就直接不能看了，所以还的easy UI放后面，我又增加了个人mybootstrap.css，吧bootstrap被覆盖的重命名复制过去就互不冲突了。比如：吧所有的panel替换成b-panel存到mybootstrap.css，引用的时候用b-panel原文：http://www.cn...
easyui下拉框过滤优化【代码】
项目中有个需求：编辑combobox的输入域会自动检索匹配项，当没有任何匹配项时，将combobox重置为初始状态。处理方式：重写输入域的blur事件，判断当前值是否为加载的数据集的子集，如果不是则重置。脚本如下：$.fn.combobox.defaults.inputEvents.blur = function(e){var target = e.data.target;var opts = $(target).combobox(‘options‘);if (opts.reversed || opts.limitToList){if (opts.blurTimer){clearTimeout(opts.blurT...
基于MVC+EasyUI的Web开发框架经验总结（12）--利用Jquery处理数据交互的几种方式【代码】【图】
在基于MVC4+EasyUI的Web开发框架里面，大量采用了Jquery的方法，对数据进行请求或者提交，方便页面和服务器后端进行数据的交互处理。本文主要介绍利用Jquery处理数据交互的几种方式，包括获取数据并显示，插入新数据到服务器，更新数据，删除数据等操作。1、利用Jquery获取数据并显示为了顺利获取数据，我们需要保持页面端调用和服务器端保持一致，并相应的把数据转换或者封装为对象实体进行处理。下面我们以一个简单的全国省份、全...