Extjs嵌入html

方式一:使用组件的html属性嵌入html代码,如果html代码中存在参数可以使用字符串拼接的方式拼接html代码. html页面: <!doctype html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Extjs中嵌入html</title> <…

Ext.Loader.setConfig({ enabled : true }); Ext.Loader.setPath('Ext.ux', '../extjs/ux'); Ext.require([ 'Ext.form.*', 'Ext.data.*', 'Ext.grid.Panel' ]); Ext.onReady(function() { Ext.QuickTips.init(); var bodyWidth; var bodyHeight; var panelWidth = bodyW…

.net 实现Office文件预览 Word PPT Excel 2015-01-23 08:47 63人阅读评论(0) 收藏

先打个广告: .Net交流群:252713569 本人QQ :524808775 欢迎技术探讨, 近期公司要求上传的PPT和Word都需要可以在线预览.. 小弟我是从来没有接触过这一块的东西感觉很棘手..不过网络是强大的,还是让我找到了解决方案,记载一下. 要实现无任何插件的预览,swf文件是比较好的. PDF则需要有这个插件才能预览..那么转换的过程如下以PPT 为例 : PPT →(由ASPOSE转换)→ PDF文件 →(由pdf2swf转换)→Swf文件最终由EXTJS嵌入Flex…

jsp中的js嵌入Extjs与后台action交互

近期做前台须要和后台交互数据,直接使用js一直没实现.最后使用extjs实现了,extjs代码直接嵌入到jsp的js代码中就可以(0跟jsp里使用extjs一样,须要载入extjs的几个文件) <script language="javascript" type="text/javascript"src="../ext3/adapter/ext/ext-base.js"></script> <script langu…

ExtJs 使用点滴十三在FormPanel 嵌入按钮

Ext.onReady(function () { //初始化标签中的Ext:Qtip属性. Ext.QuickTips.init(); Ext.form.Field.prototype.msgTarget = 'side'; //提交按钮 var btnsubmit = new Ext.Button({ text: '提交', handler: btnsubmitclick }); //重置按钮 var btnreset = new Ext.Button({ text: '重置', han…

ExtJS 4.2 业务开发(一)主页搭建

本篇开始搭建一个ExtJS 4.2单页面应用, 这里先介绍主页的搭建,内容包括:主页结构说明.扩展功能等方面. 目录 1. 主页结构说明 2. 扩展功能 3. 在线演示 1. 主页结构说明 1.1 主页布局传统的ExtJS 4.2应用,基本布局如下: 1.2 主页布局分析根据上面的主页布局图,可转换具体试图结构: header:存放系统的名称.logo.用户信息等内容. menu:菜单区域,以Tree形态展现业务入口. tab:业务区域,具体的业务都以tab页的形式嵌入到此区域. 1.3 主…

开发extjs常用的插件

Spket是目前支持Ext 2.0最为出色的IDE. 它采用.jsb project file 文件并将继承于基类和所有文档的内容嵌入到生成代码提示的Script doc中.注:不支持配置项的代码提示. 一.Spket Eclipse插件与IDE Spket提供了Eclipse插件和独立的IDE环境来支持ExtJs开发,下载地址:http://spket.com/download.html,在下载页面找到如下图所示的地方. Plugin是将Spket直接配置为Eclipse插件进行使用,而Spk…

extjs的调试方法

1.使用extjs自带的测试工具第一步:在ExtJS下载的资源包中,找到debug.js,将JS文件导入实际要运行的HTML或者JSP页面上第二步:在有关JS文件代码中嵌入Ext.log('自定义调试信息'),如Ext.log('执行了xxx操作')等第三步:运行网页吧,奇迹出现了,凡是你添加Ext.log信息的页面展现出来的页面下方都带有一个EXT自动生成的CONSOLE控制台,比较像MyEclipse的CONSOLE,CONSOLE里面显示的就是你执行的信息了其实还有一点也非常有用,…

认识ExtJS(04)--常见Web框架的ExtJS改造

常见Web框架的ExtJS改造怎样开始改造工作? 改造主要集中在对表现层的修改,底层的数据库访问不需要进行任何的变动.也就是说主要集中早这2个方面:一方面是表现部分即是JSP页面:另一方面是客户端与服务器的交互方式. 1.页面改造 •页面框架改造传统页面布局很多时候是通过frame框架进行的,在不同的框架嵌入不同的功能页面,而在ExtJS中主要地通过各种布局类进行页面区域的划分,因此需要针对不同的宽假选择合适的ExtJS布局类. •页面主题内容改造页面中的主题内容主要包括各种数据展示方式,…

Java源码ExtJS 5 SpringMVC 4Hibernate 4通用后台管理开发框架

需要源码,请加QQ:858-048-581 一.特色1.采用Spring MVC的静态加载缓存功能,在首页将Javascript文件.CSS文件和图片等静态资源文件加载进来放进内存,极大提高ExtJS的加载速度.2.三种皮肤主题:经典.灰色和海王星,支持多浏览器和多分辨率.3.分别封装了模型层.控制层.业务逻辑层和数据持久层的通用操作模块,层次分明,大大减少代码冗余,二次开发效率高.4.系统是公司多个项目的基础框架,稳定性好,支持大并发. 二.主要功能1.采用ExtJS 5.1无限制免费版本,放…

[ExtJS5学习笔记]第三十三节 sencha extjs 5 grid表格导出excel

使用extjs肯定少不了使用表格控件,用到表格,领导们(一般)还是惯于使用excel看数据,所以用到extjs表格的技术猿们肯定也会有导出表格excel这一个需求,本文主要针对如何在用extjs将grid表格导出到excel,使用的是前端导出,不涉及后端. 源代码打包下载将源代码嵌入到应用中查看导出按钮以及导出效果扩展支持sum统计和groupsum分组源代码打包下载本次使用的是github上的一个开源项目Exporter 下载地址:https://github.com/iwiznia…

Javascript - ExtJs - Ext.form.Panel组件

FormPanel组件(Ext.form.FormPanel) logogram:Ext.form.Panel | xtype:form Ext.form.Panel.配置 frame }//旗下所有子组件宽度为100px. fileUpload: true//显示文件上传组件,如果指示了此项,则必须在items子组件数组中注册一个xtype为"fileuploadfield"的子组件 items : [ {} , { }]//添加表单子控件 buttons : [ {} , {} ]…

Javascript - ExtJs - 组件 - 分页

服务端只需要返回如下格式的字符串,ExtJs就可以解析并自动生成分页数据. , name: "sam" } ] } 准备: CREATE PROCEDURE [dbo].[usp_PagingLarge] @TableNames VARCHAR(2000) , --表名,可以是多个表,但不能用别名 @PrimaryKey VARCHAR(100) , --主键,可以为空,但@Order为空时该值不能为空 @Fields VARCHAR(400…

通用后台管理系统（ExtJS 4.2 + Spring MVC 3.2 + Hibernate）

通用后台管理系统(ExtJS 4.2 +Spring MVC 3.2 + Hibernate) 开发语言JAVA 成品成品前端技术extjs 数据库mysql,sql server,oracle 系统可作为OA.网站.电子政务.ERP.CRM.APP后台等基于B/S架构的应用软件系统的快速开发框架. 详细信息原文:http://www.yctxkj.com/product/showproduct.php?lang=cn&id=16 系统可作为OA.网站.电子政务.ERP.CRM.APP后…

11.Extjs登录页面js

/** * @author sux * @desc 登录 */ Ext.onReady(function(){ Ext.QuickTips.init(); //错误信息显示必须 var loginForm = new Ext.form.FormPanel({ //title: '用户登录', width: 290, height: 300, labelWidth: 50, labelAlign: 'right', defaults: { width: 210, layout: 'form', x…

ExtJS 4.2 评分组件

上一文章是扩展ExtJS自带的Date组件.在这里将创建一个评分组件. 目录 1. 介绍 2. 示例 3. 资源下载 1. 介绍代码参考的是 Sencha Touch 2上的一个RatingStar扩展插件,在此基础上做了移植到ExtJS 4.2,并扩展了默认值.form表单支持等功能. 1.1 JavaScript代码 /*! * 评分组件 */ Ext.define('App.Demo.RatingStarFiledDemoTab', { extend: 'Ext.panel.Panel'…

Fis3的前端工程化之路[三大特性篇之内容嵌入]

Fis3版本:v3.4.22 Fis3的三大特性资源定位:获取任何开发中所使用资源的线上路径内容嵌入:把一个文件的内容(文本)或者base64编码(图片)嵌入到另一个文件中依赖声明:在一个文本文件内标记对其他资源的依赖关系内容嵌入嵌入资源即内容嵌入,可以为工程师提供诸如图片base64嵌入到css.js里,前端模板编译到js文件中,将js.css.html拆分成几个文件最后合并到一起的能力.有了这项能力,可以有效的减少http请求数,提升工程的可维护性. fis不建议用户使用内容嵌入能…

页面嵌入dom与被嵌入iframe的攻防

1.情景一:自己的页面被引入(嵌入)至别人的页面iframe中 if(window.self != window.top){ //url是自己页面的url window.top.location.href = url } 通过顶层框架的判断,得知自己所在的框架是否是顶层框架.来判断自己页面所在的情况. 知识点:不同域中的iframe不能相互访问. 比如我们的页面在别人的页面iframe中,我们的页面跟别人的页面就在不同的域中. 这时候我们通过window.top.location是无法访问loc…

ABP文档 - 嵌入的资源文件

文档目录本节内容: 简介创建嵌入的文件暴露嵌入的文件使用嵌入的文件简介一个web应用里,客户端包含javascript,css,xml等文件,这此文件被添加到一个web项目后,发布成独立的文件,有时,我们需要把一些这样的文件打包入一个程序集(一个类库项目,一个Dll文件),并且作为嵌入式资源文件部署在这个程序集里,ABP提供了一个基础架构,方便地处理这件事. 创建嵌入的文件我们首先要创建一个资源文件并把它标记为嵌入式资源,任何程序集都可以包含嵌入式资源文件,假设我们有一个名为“Ab…

ExtJS 4.2 介绍

本篇介绍ExtJS相关知识,是以ExtJS4.2.1版本为基础进行说明,包括:ExtJS的特点.MVC模式.4.2.1GPL版本资源的下载和说明以及4种主题的演示. 目录 1. 介绍 1.1 说明 1.2 特点 1.3 使用协议 1.3 MVC模式 2. 资源 2.1 资源地址 2.2 资源目录说明 2.3 docs/index.html 3. 运行图 1. 介绍 1.1 说明 ExtJS是一个用javascript.CSS和HTML等技术实现的主要用于创建RIA即富客户端,且与后台技术无关的前…

ExtJS 4.2 第一个程序

本篇介绍如何创建一个ExtJS应用程序.并通过创建目录.导入文件.编写代码及分析代码等步骤来解释第一个ExtJS程序. 目录 1. 创建程序 1.1 创建目录建议 1.2 实际目录 1.3 index.html 1.4 运行图 2. 代码分析 2.1 Ext.onReady() 2.2 Ext.create() 1. 创建程序 1.1 创建目录建议根据官方建议,创建一个ExtJS应用程序的目录推荐如下: - appname | - app | - namespace | - Class1.js…

ExtJS 4.2 组件介绍

目录 1. 介绍 1.1 说明 1.2 组件分类 1.3 组件名称 1.4 组件结构 2. 组件的创建方式 2.1 Ext.create()创建 2.2 xtype创建 1. 介绍 1.1 说明 ExtJS的强大功能之一是提供了非常丰富的组件,包括grid(表格).panel(面板).form(表单).button(按钮).progressBar(进度条)等等. 一个的ExtJS 4应用程序的UI界面,就是由一个或多个组件组成. 这里将会介绍组件的分类.名称.结构以及创建方式. 1.2 组件分类…

ExtJS 4.2 组件的查找方式

组件创建了,就有方法找到这些组件.在DOM.Jquery都有各自的方法查找元素/组件,ExtJS也有自己独特的方式查找组件.元素.本次从全局查找.容器内查找.form表单查找.通用组件等4个方面介绍组件的查找方式. 目录 1. 全局查找方式 2. 容器内查找 3. form查找子组件 4. 通用组件查找方式 1. 全局查找方式全局查找方式指在整个ExtJS框架中查找组件. 1.1 Ext.getCmp(id) :返回此id对应的组件说明:此方法是在所有组件中查找匹配此id的组件. 参数: ①…

ExtJS 4.2 业务开发(二)数据展示和查询

本篇开始模拟一个船舶管理系统,提供查询.添加.修改船舶的功能,这里介绍其中的数据展示和查询功能. 目录 1. 数据展示 2. 数据查询 3. 在线演示 1. 数据展示在这里我们将模拟一个船舶管理系统,并提供查询.添加.修改的功能. 大致的目录结构如下: ShipMgrTab.js :船舶业务的入口. controller 目录:存放船舶业务的逻辑控制文件. model 目录:存放船舶业务的model文件. store 目录 :存放船舶业务的store文件. view 目录 :存放船舶业务的组件…

ExtJS 4.2 业务开发(三)数据添加和修改

接上面的船舶管理业务,这里介绍添加和修改操作. 目录 1. 添加操作 2. 修改操作 3. 在线演示 1. 添加操作 1.1 创建AddShipWindow.js 在业务中的view目录下创建一个AddShipWindow.js文件,表示一个增加船舶的窗口组件. 此文件中包含了一个form组件用于显示所要添加的字段:船舶名称.状态.吨数和核载人数. 具体代码如下: Ext.define('App.ShipMgr.view.AddShipWindow', { extend: 'Ext.window…

ExtJS 4.2 Grid组件的单元格合并

ExtJS 4.2 Grid组件本身并没有提供单元格合并功能,需要自己实现这个功能. 目录 1. 原理 2. 多列合并 3. 代码与在线演示 1. 原理 1.1 HTML代码分析首先创建一个Grid组件,然后查看下的HTML源码. 1.1.1 Grid组件 1.1.2 HTML代码从这些代码中可以看出,Grid组件可分为grid-header和grid-body 两块区域(若含有工具栏和分页栏,它们都会含有各自的独立区域). 其中grid-body包含了许多tr元素,每一个tr都是代表Gri…

ExtJS 4.2 Date组件扩展：添加清除按钮

ExtJS中除了提供丰富的组件外,我们还可以扩展他的组件. 在这里,我们将在Date日期组件上添加一个[清除]按钮,用于此组件已选中值的清除. 目录 1. Date组件介绍 2. 主要代码说明 3. 代码与在线演示 1. Date组件介绍这里的Date组件全称为 Ext.form.field.Date,为form表单一个组件. 查看Ext.form.field.Date的源代码的得知需要 Ext.picker.Date. Ext.picker.Date是一个日期选择器,包含了日期选中.渲染布局…

Extjs 让combobox写起来更简单

也已经写了很久时间的extjs ,每次都用到很多的combobox,配置很多东西觉得实在是太麻烦,所以根据常用到的情况写了一个简便的combobox,再次记录下来,以免放在某个地方忘记了找不到了. 定义一个基本的baseCombobox类,如下. Ext.define('Admin.view.baseCmp.BaseCombobox', { extend: 'Ext.form.field.ComboBox', xtype: 'baseCombobox', editable: false, lab…

ExtJS 项目准备工作（一）

首先,需要从网上下载两个文件,一个是SenchaCmd-6.2.0-windows-64bit(我的电脑是window 10 64位) 另一个是ExtJs6的源码包(ext-6.0.0.415). 源码下载地址:http://pan.baidu.com/s/1ntqqZpB sencha cmd 下载地址:https://www.sencha.com/products/sencha-cmd 解压之后安装cmd,运行 SenchaCmd-6.2.0.103-windows-64bit.exe文件,…

ExtJS in Review - xtype vs. alias

今天在帮一个兄弟检查一段自定义控件的代码时觉得他对xtype以及alias的使用和ExtJS各示例代码的使用有较多的不一致,而我自己也不是很清楚使用这两个属性时的最佳方法.因此在回家后整理出了这样一篇文档.一方面用来标准化我们自己的代码,另一方面也共享给大家,毕竟对这两个属性进行详细讨论的资料几乎没有. xtype 首先来看看xtype的定义.在ExtJS的官方文档中是这样对它进行定义的: This property provides a shorter alternative to creat…