EASYUI - 技术教程文章
EasyUI的-表格设置【代码】
<table id="tt" title="Formatting Columns" class="easyui-datagrid" style="width:550px;height:250px" url="data/datagrid_data.json" singleSelect="true" iconCls="icon-save">id="tt" title="Formatting Columns" 表格名称class="easyui-datagrid" 表格的数据类型style="width:550px;height:250px" 宽度/高度url="data/datagrid_data.json" 表格数据源singleSelect="true" 配...
建筑材料系统 ASP.NET MVC4.0 + WebAPI + EasyUI + Knockout 的架构设计开发
框架介绍：1、基于 ASP.NET MVC4.0 + WebAPI + EasyUI + Knockout 的架构设计开发2、采用MVC的框架模式，具有耦合性低、重用性高、生命周期成本低、可维护性高、有利软件工程化管理等优点3、采用WebAPI，客户端完全摆脱了代理和管道来直接进行交互4、采用EasyUI前台UI界面插件，可轻松的打造出功能丰富并且美观的UI界面5、采用Knockout，，提供了一个数据模型与用户UI界面进行关联的高层次方式（采用行为驱动开发）6、数据访问层采...
取到easyui的tab下iframe方法【代码】
我们在使用easyui的tab时，有时候需要每次点击tab头，动态刷新该tab下的iframe的内容tab的html如下：Html代码:<div id="tab-user-right" > <div title="直接分配的操作权限" id="user-right-act"> <iframe scrolling="yes" frameborder="0" height="500" width="100%" frameborder="0" ></iframe> </div> <div title="拥有的角色" id="user-role"> ...
Asp.Net+Easyui实现基本的CRUD【图】
话说今天周四，本该给自己放个假，好好休息休息，但无奈自己对IT实在是痴迷，心甘情愿的想加加班把目标功能实现，功夫不负有心人，经过6个小时的鏖战，我终于成功了。在此和大家分享下成果，希望大家给个赞。 我的目标效果：在页面加载时，table表显示后台数据表中的学生的信息；点击添加按钮，出现弹框，可以添加学生信息；选中某一学生记录后，点击修改按钮，出现弹框，可以对学生信息进行修改；选中某一学生记录后，点击删除...
EasyUi datagrid 动态生成表头【代码】
从后台到显示表头显示数据/*** 服务器账单明细* @author Administrator**/publicclass ServerBillingDetailInfo implements Serializable{/*** */privatestaticfinallong serialVersionUID = 6802412713642265144L;private Long id;//服务器账单idprivate String bussinessNum;//服务器账单os账号private String ip;//服务器账单服务器Ippublic ServerBillingDetailInfo() {super();// TODO Auto-generated constructor stub }p...
easyui datagrid 内容无法加载的问题【代码】
先看代码<!DOCTYPE html> <html lang="en"><head><meta charset="gb2312"/><title>增加，删除行</title><link rel="stylesheet" type="text/css" href="../easyui-ku/themes/default/easyui.css"/><link rel="stylesheet" type="text/css" href="../easyui-ku/themes/icon.css"/><link rel="stylesheet" type="text/css" href="../easyui-ku/themes/demo.css"/><script type="text/javascript" src="../easyui-ku/jquery.min.js"><...
Easyui 异步树直接所有展开
初始化异步树直接所有展开代码： $(function(){$('#tt').tree({url:'<%=request.getContextPath()%>/treeInit',lines:true,onLoadSuccess:function(node,data){var t = $(this);if(data){$(data).each(function(index,d){if(this.state == 'closed'){t.tree('expandAll');}});}}});});原文：http://www.cnblogs.com/bhlsheji/p/4389171.html
easyui-datagrid加载时的效率低下，解决方案【图】
在360浏览器中 使用easyui datagrid 加载数据是效率低下，有时候会出现卡机。可以修改easyui源码进行解决。原文：http://www.cnblogs.com/fuyuanming/p/5900819.html
2、easyUI-创建 CRUD可编辑dataGrid（表格）【代码】【图】
在介绍这节之前，我们先看一下效果图：双击可以进入编辑点击添加可以在下一行显示应用场景，一般不用于这种用户添加（此处只是示例），一般用于多记录，如学历信息，工作经历等在这之前，我们要在index.php中引入jquery.edatagrid.js文件，可以去网站下载，稍后也会附出文件以代码的形式；在前一节中，我们需要修改的有两个地方（优化后的代码基础上）,第一index.php页面，第二稍稍增加或者改动userAction和userModel文件；首先附上...
easyui datagrid 的分页刷新按钮
datagrid 刷新bug:情形：当用户A,B 同时操作 datagrid时(记录1，记录2、记录3)。如果A如果删除记录1， B此时已选中了记录1 ，记录2 ， 这时B点击分页中的刷新按钮后，记录1不可见。但是getchecked 会发现选中的是2条记录（记录1 记录2 ） ，而不是一条记录2。 一种办法：再点击刷新按钮的时候。清除所有选中的行。easyui ui 1.4.2jquery.easyui.min.js _5d4.pagination({ total: (opts.pageNumber * opts.page...
easyui datagrid 自定义加载按钮实例【图】
今天写一个项目，在用到datagrid的时候突然发现加载操作列中的自定义按钮出来问题，经过一番研究，原来这么简单。话不多说，上图650) this.width=650;" src="/upload/getfiles/default/2022/11/15/20221115012639652.jpg" title="QQ图片20150514151227.png" /> //获取选中行审核 function Checker(indexDiv) { $(‘#grid‘).datagrid(‘selectRow‘,indexDiv);//获取选中行 var rows = $(‘#grid‘)...
原创: EasyUI Tree 最后一级 节点 横向排列【代码】
原创: EasyUI Tree 最后一级 节点 横向排列转载请指明出处 必须要写在: onLoadSuccess 事件中 ddAuthTree.tree({lines: true,checkbox: true,cascadeCheck: true,lines: false,url: authTreeUrl, onLoadSuccess:function(node,data){ddAuthTree.find("ul >li:not(:has(ul))").css(‘float‘, ‘left‘); // 选择最后一个节点 并添加 float:leftddAuthTree.find("ul >li:has(ul)").css(‘clear‘, ‘both‘); ...
jQueryEasyUI Messager基本使用【图】
1、$.messager.alert(title, msg, icon, fn)1>、基本用法代码：<html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title>消息提示框</title> <link href="/jquery-easyui-1.2.4/themes/default/easyui.css" rel="stylesheet" type="text/css" /> <link href="/jquery-easyui-1.2.4/themes/icon.css" rel="stylesheet" type="text/css" /> <script src="/jquery-easyui-1.2.4/jquery-1.6.4.min.js" t...
JavaScript提高：006：ASP.NET使用easyUI TABS标签updatepanel【图】
前文使用了easyui的tab标签。切换问题，使用了session保存当前选中页，然后页面总体刷新时再切换至上次保存页码。那么使用updatepanel后，这个问题就非常好攻克了。http://blog.csdn.net/yysyangyangyangshan/article/details/38578403引用dll上文已说过。以下直接看怎样改进tab在页面中的使用。前台代码：<%@ Register Assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"...
easyUI_动态改变datagrid的url值【代码】
$(‘#tt‘).datagrid({ url:‘/demo/user/getUsers‘, queryParams:{ id:‘001‘, state:‘ok‘ } }); 原文：https://www.cnblogs.com/liuxiansheng/p/9122514.html
Jquery easyui开启行编辑模式增删改操作【代码】【图】
Jquery easyui开启行编辑模式增删改操作先上图 Html代码： <table id="dd"></table>引入JS文件和CSS样式<script src="http://www.cnblogs.com/Resources/jquery-easyui-1.2.3/jquery-1.4.4.min.js" type="text/javascript"></script><script src="http://www.cnblogs.com/Resources/jquery-easyui-1.2.3/jquery.easyui.min.js" type="text/javascript"></script><link href="http://www.cnblogs.com/Resources/jquery-easyui-1.2....
Easyui Datagrid相同连续列合Demo之三【代码】【图】
效果图：html<!DOCTYPE html> <html> <head><meta charset="UTF-8"><title>Merge Cells for DataGrid - jQuery EasyUI Demo</title><link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css"><link rel="stylesheet" type="text/css" href="../../themes/icon.css"><link rel="stylesheet" type="text/css" href="../demo.css"><script type="text/javascript" src="../../jquery.min.js"></script><script...
EF6 CodeFirst+Repository+Ninject+MVC4+EasyUI实践(完)【代码】
前言 这一篇是本系列的最后一篇，虽然示例讲到这里就停止呢，但对于这些技术的学习远不能停止。虽然本示例讲的比较基础，但是正如我第一篇说到的，这个系列的目的不是说一些高端的架构设计，而是作为一个入门级，对学习EntityFramework6构建一个简单的示例以及对其进行设计，管理，编码的过程。应部分园友要求，博客换了一个清爽的模板。之前的模板也是为了学习一下，所以按照其他模板的样式，把自己的博客园模板修该了一下。虽然这...
构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统（27）-权限管理系统-分配用户给角色【代码】【图】
分配用户给角色，跟分配角色给用户操作是基本一致的。打开模块维护，展开SysRole模块添加一个操作码，并赋予权限设置好之后将权限授权给管理员，在SysRole的index添加操作码与js事件@Html.ToolButton("btnAllot", "icon-share", "分配用户", perm, "Allot", true)$("#btnAllot").click(function () {var row = $(‘#List‘).datagrid(‘getSelected‘);if (row != null) {$("#modalwindow").html("<iframe width=‘100%‘ height=‘...
基于easyUI实现权限管理系统（三）——角色管理【代码】【图】
此文章是基于EasyUI+Knockout实现经典表单的查看、编辑 一. 准备工作 1. 点击此下载相关文件，并把文件放到 ims 工程对应的文件夹下 二. 相关文件介绍 1. role.jsp：角色管理界面<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"><%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">...
EasyUI 中点击取消按钮关闭Dialog（对话框窗口）【代码】【图】
1.在取消按钮里的function中通过id找到这个对话框所在的层，2.点出这个对话框，然后在括号了写入关闭的方法 <div id="dl1" class="easyui-dialog" title="窗口" style="width:400px;height: 200px" data-options=" toolbar:[{text:‘添加‘,iconCls:‘icon-add‘,handler:function(){alert(‘点击了添加按钮‘)}},{text:‘保存‘,iconCls:‘icon-save‘}],buttons:[{text:‘确定‘},{text:‘取消‘,handler:function(){$(‘#dl1‘...
jQuery EasyUI 窗口 – 创建简单窗口【代码】【图】
jQuery EasyUI 窗口 – 创建简单窗口创建一个窗口（window）非常简单，我们创建一个 DIV 标记：<div id="win" class="easyui-window" title="My Window" style="width:300px;height:100px;padding:5px;">Some Content. </div> 现在运行测试页面，您会看见一个窗口（window）显示在您的屏幕上。我们不需要写任何的 javascript 代码。如果您希望创建一个隐藏的窗口（window），记得设置 ‘closed‘ 属性为 ‘true‘ 值，您可以调用 ‘...
jQuery EasyUI
jQuery EasyUI 框架帮助你轻松建立站点:http://www.zi-han.net/case/easyui/base.html EasyUI Demo 在线实例:http://www.jeasyui.net/demo/514.html原文：http://www.cnblogs.com/xiaohaizhuimeng/p/5202880.html
easyUi可编辑表格【代码】
//表格展示 $("#tt").datagrid({columns:[[{field:‘itemid‘,title:‘Item ID‘,width:80,sortable:true,editor:‘text‘},{field:‘productid‘,title:‘Product ID‘,width:80,sortable:true,editor:‘text‘},{field:‘status‘,title:‘Item Details‘,editor:‘text‘},{field:‘listprice‘,title:‘List Price‘,width:80,align:‘right‘,sortable:true,editor:‘text‘},{field:‘unitcost‘,title:‘Unit Cost‘,width:...
解决easyui-datagrid在ie中无法reload问题
easyui在页面载入时，会自己主动填充datagrid中的数据，当加入、改动、删除后，会触发reload事件，对datagrid进行又一次载入。 这个过程在FireFox中没有问题，用firebug观察发现前后两次http状态码都是200，证明两次都是从server又一次取的新数据，没实用浏览器中的缓存。 可到了IE中，发现第一次载入时的http状态码是200，reload时的http状态码是304，证明reload时的数据是从缓存中读取的，造成的结果是加入后datagrid表格不更...
扩展easyui.datagrid，添加数据loading遮罩效果代码 --来自网摘收集【代码】
//jquery.datagrid 扩展 (function (){ $.extend($.fn.datagrid.methods, { //显示遮罩 loading: function(jq){ return jq.each(function(){ $(this).datagrid("getPager").pagination("loading"); var opts = $(this).datagrid("options"); var wrap = $.data(this,"datagrid").panel; if(opts.loadMsg) { $("<div class=\"datagrid-mask\"></div>").css({display:"block",width:wrap.width(),height:wrap.height()}).ap...
easyui_验证扩展【代码】
本文为转载，并非原创 easyui validatebox 验证类型 分类： jquery-easyUI 2013-06-0510:58 11000人阅读 评论(2) 收藏 举报 easyuiValidateBox required: "必选字段",remote: "请修正该字段",email: "请输入正确格式的电子邮件",url: "请输入合法的网址",date: "请输入合法的日期",dateISO: "请输入合法的日期 (ISO).",number: "请输入合法的数字",digits: "只能输入整数",creditcard: "请输入合法的信用卡号",equalTo: "请再次输入...
jQuery UI与jQuery easyUI的冲突解决办法
jQuery UI与jQuery easyUI都是基于jQuery开发的。难免里面会有些方法名冲突！因此对jQuery.easyui其中的两个方法名：resizable 和 draggable进行替换，分别替换为resiz_able和dragg_able，即可！原文：http://www.cnblogs.com/zqzjs/p/4656844.html
Vue EasyUI 调整大小v-Resizable的坑【代码】
具体安装，参考https://www.w3cschool.cn/vueeasyui/vueeasyui-p8h937nn.html 坑：这样无效 v-Resizable 直接套在 LayoutPanel 标签里面<template><div><Layout style="width: 700px; height: 250px"><LayoutPanel region="north" style="height: 50px"><div class="title">North Region</div></LayoutPanel><LayoutPanel region="south" style="height: 50px"><div class="title">South Region</div></LayoutPanel><LayoutPanel...
EasyUI-Datagrid行内编辑【图】
接上一篇，这次介绍easyUI的datagrid的行内编辑单元格的功能。 关于行内编辑，我之前写过一个demo 《jQuery：页面可编辑表格》，但是easyui 中早已经封装了行内单元格编辑的功能，我们在调用时只需要使用人家封装好的方法就行。这里就使用封装好的方法。实现思路： 1.定义table 时写上监听单击事件的方法：onClickCell:onClickCell； 2.将需要编辑的<th>和<td>设置编辑的触发响应：editor:‘text‘。其中text只是它...