如何为现有网站添加Ajax web窗体添加表格

在做web开发的时候难免遇到一个问题,那就是,选择什么样的框架。下面把前端的框架简单的列一下。
  Apache基金会今天发布了Flex 4.8版本,这是Adobe将Flex捐献给Apache基金会后发布的第一个版本。
  需要注意的是,Flex目前还在孵化阶段,还不是Apache的正式项目,Flex 4.8也不是一个正式的Apache版本。
  Apache称,该版本标志着Flex新时代的开始,Flex的未来将由社区来驱动,而不是由一个公司驱动。开发者可以通过贡献代码,来帮助改进Flex,如修复bug、增加功能等。
从Macromedia卖给Adobe,然后又捐给apache,不知道搞什么名堂。不过还好没有经过大幅,否则就真的是悲哀了!
ExtJS是一种主要用于创建前端用户界面,是一个基本与后台技术无关的前端ajax框架。
功能丰富,无人能出其右。
无论是界面之美,还是功能之强,ext的表格控件都高居榜首。
华丽的界面,灵活的功能,还有开发工具都是配套的,但有个最大的问题,用就得花钱!
easyui帮助你构建你的web应用更加容易。
它是一个基于jquery的插件,开发出来的一套轻量级的ui框架,非常小巧而且功能丰富。
官方网站是:
但是她有一个最大的问题就是代码只能找到以前的开源的版本,到了1.2以后的版本源代码都是经过混淆的,如果遇到问题修改起来会非常麻烦!不过一个比较大的优势是开源免费,并且界面做的还说的过去!
又一个基于jquery的框架,开发的界面功能都很丰富。
jQuery MiniUI & 快速开发WebUI。
它能缩短开发时间,减少代码量,使开发者更专注于业务和服务端,轻松实现界面开发,带来绝佳的用户体验。
使用MiniUI,开发者可以快速创建Ajax无刷新、B/S快速录入数据、CRUD、Master-Detail、菜单工具栏、弹出面板、布局导航、数据验证、分页表格、树、树形表格等典型WEB应用系统界面。
界面做的挺不错,功能也挺丰富,但是有两个比较大的问题,一个是收费,一个是没有源码,说白了,不开源!基于这个开发如果想对功能做扩展就需要找他们的团队进行升级!
5、jQuery UI
jQuery UI 是一套 jQuery 的页面 UI 插件,包含很多种常用的页面空间,例如 Tabs(如本站首页右上角部分) 、拉帘效果(本站首页左上角)、对话框、拖放效果、日期选择、颜色选择、数据排序、窗体大小调整等等非常多的内容。
功能非常全面,界面也挺漂亮的,可以整体使用,也可以分开使用其中的几个模块,免费开源!
DWZ富客户端框架(jQuery RIA framework), 是中国人自己开发的基于jQuery实现的Ajax RIA开源框架.
设计目标是简单实用,快速开发,降低ajax开发成本。
欢迎大家提出建议,我们将在下一版本中进一步调整和完善功能.共同推进国内整体ajax开发水平。
在线演示地址
毕竟是国产的,支持一下,而且源码完全公开,可以选择一下!不过性能怎么样不敢确定!
Google 网页工具包&&GWT 提供了一组基于Java语言的开发包,这个开发包的设计参考Java AWT包设计,类命名规则、接口设计、事件监听等都和AWT非常类似。熟悉Java AWT的开发者不需要花费多大的力气就能够快速的理解GWT开发工具包,将更多地时间投入到GWT应用的开发过程中。
你不用去了解这样那样的javascript框架,通过java你就可以写出功能丰富的界面,可以做单元测试,毕竟是google的产品,严重支持一下!
Yahoo! UI Library (YUI) 是一个开放源代码的 JavaScript 函数库,为了能建立一个高互动的网页,它采用了AJAX, DHTML 和 DOM 等程式码技术。它也包含了许多 CSS 资源。使用授权为 BSD许可证,基本上没怎么研究过!
YUI Compressor倒是挺出名的,这套UI库不知道应用的情况怎么样!
Sencha 是由 ExtJS、jQTouch 以及 Raphael 三个项目合并而成的一个新项目。
大公司的框架,并且是几样库的强强联合,值得推荐!
在国内应用好像不是很广,不过性能上应该没问题。
Dojo是一个用javascript语言实现的开源DHTML工具包。
有多个基金会的支持,包括IBM和SUN,都是软件界的泰斗,值得信赖!
ZK是一套以 AJAX/XUL/Java 为基础的网页应用程式开发框架,用于丰富网页应用程式的使用接口。最大的好处是,在设计AJAX网络应用程式时,轻松简便的操作就像设计桌面程式一样。 ZK包含了一个以AJAX为基础、事件驱动(event-driven)、高互动性的引擎,同时还提供了多样丰富、可重复使用的XUL与HTML组件,以 及以 XML 为基础的使用接口设计语言 ZK User-interfaces Markup Language (ZUML)。
功能丰富,全面,文档齐全,而且升级了很多次,非常值得推荐!
12、OperaMasks-UI
OperaMasks-UI是OperaMasks团队 2011下半年打造的一款轻量级前端JS组件库,旨在提供一款学习曲线低、定制性灵活、样式统一,且多浏览器支持、覆盖企业业务场景的前端 JavaScript UI组件库。目前,该团队已将这一产品以LGPL 开源协议开放给社区。
文档丰富,功能齐全,而且很容易使用和开发!而且是国产的哟!
13、JavaFX
Sun公司(已于2009年被Oracle公司收购)在日发布了JavaFX技术的正式版,它使您能利用 JavaFX 编程语言开发富互联网应用程序(RIA)。JavaFX Script 编程语言(以下称为JavaFX)是Sun微系统公司开发的一种declarative, statically typed(声明性的、静态类型)脚本语言。JavaFX技术有着良好的前景,包括可以直接调用Java API的能力。因为 JavaFX Script是静态类型,它同样具有结构化代码、重用性和封装性,如包、类、继承和单独编译和发布单元,这些特性使得使用Java技术创建和管理大型程序变为可能。
不管用的人多少,毕竟是从sun开始,现在是oracle,相信会有一个广阔的市场,但是确实不知道有哪个公司用这个框架开发!
以上都是个人收集整理的,不知道现在都在用什么框架,其中粗体部分仅仅代表个人关点!
阅读(...) 评论()您所在的位置: &
清华大学出版社
《C#入门经典(第4版》第22章 Ajax 编程,本章利用Asynchronous JavaScript and XML技术,即Ajax技术就很容易创建交互式的Web应用程序。本小节为大家介绍的是Web服务。
22.5& Web服务
Web服务用于独立于平台的通信。第21章介绍了如何创建和调用ASP.NET Web服务,第35章将讨论如何使用WCF创建Web服务。
在下面的示例中,创建了一个新的Web服务,并直接从客户脚本中调用它。
试试看:调用Web服务
(1) 打开前面创建的Web站点AJAXWebSite。
(2) 添加一个支持AJAX的WCF服务,如图22-6所示,命名为HelloService.svc。
(点击查看大图)图& 22-6
(3) 打开HelloService.svc文件,添加Greeting()方法:
using System.ServiceMusing System.ServiceModel.Ausing System.ServiceModel.W[ServiceContract(Namespace = " ")][AspNetCompatibilityRequirements(RequirementsMode =AspNetCompatibilityRequirementsMode.Allowed)]public class HelloService{[WebGet][OperationContract]public string Greeting(string name){return "Hello, " +}}
(4) 添加一个新的AJAX Web窗体CallService.aspx。
(5) 打开ASPX页面中ScriptManager控件的属性编辑器。单击Services属性的省略号按钮,打开如图22-7所示的对话框。用Add按钮添加一个服务引用,把它的Path属性改为HelloService.svc。
(点击查看大图)图& 22-7
(6) 在页面上添加3个HTML控件:Input(文本)、Input(按钮)和Div。
(7) 把Div控件的标识符设置为result。
(8) 把Input(文本)控件的标识符设置为input。
(9) 把button1的Value属性改为Invoke Service…。
(10) 修改页面的脚本块,先在脚本块中声明一个变量helloService,如下所示:
& script type="text/javascript" &var helloSfunction pageLoad() {}& /script &
(11) 在pageLoad方法中,创建helloService变量的一个实例,其类型与前面ScriptManager的Services属性定义的类型相同。HelloService是访问Web服务的一个代理。
& script type="text/javascript" &var helloSfunction pageLoad() {helloService = new HelloService();}
(12) 创建函数helloSucceed和helloFailed。这些方法在Web服务调用成功和失败时被异步调用。在helloSucceed方法中,把div标记result的innerHTML属性设置为Web服务的结果:
& script type="text/javascript" &var helloSfunction pageLoad() {helloService = new HelloService();}function helloSucceed(result) {var d = document.getElementById("result");d.innerHTML =}function helloFailed(error, userContext, methodName) {}& /script &
(13) 在pageLoad函数中,调用代理对象的set_defaultSucceededCallback和set_defaultFailed Callback方法,来指定异步调用Web服务成功和失败时,应调用helloSucceed和helloFailed函数:
&script type="text/javascript"&var helloSfunction pageLoad() {helloService = new HelloService();helloService.set_defaultSucceededCallback(helloSucceed);helloService.set_defaultFailedCallback(helloFailed);}function helloSucceed(result) {var d = document.getElementById("result");d.innerHTML =}function helloFailed(error, userContext, methodName) {}function callService() {var l = document.getElementById("input");helloService.Greeting(l.value);}&/script&
(14) 添加函数callService,它使用代理变量hello调用Web服务的Greeting操作。为了发送输入字段中的值,需要使用document对象的getElementbyId函数访问输入字段。Input是赋予输入字段的名称:
&script type="text/javascript"&var helloSfunction pageLoad() {helloService = new HelloService();helloService.set_defaultSucceededCallback(helloSucceed);helloService.set_defaultFailedCallback(helloFailed);}function helloSucceed(result) {var d = document.getElementById("result");d.innerHTML =}function helloFailed(error, userContext, methodName) {}function callService() {var l = document.getElementById("input");helloService.Greeting(l.value);}&/script&
(15) 指定单击Invoke Service按钮时调用函数callService,把onclick事件赋予button1,以调用函数,如下所示:
&input id="button1" type="button" value="Invoke Service... "onclick="callService();" /&
(16) 启动Web页面,在文本控件中输入一个名称,单击按钮,来调用Web服务。
示例的说明
创建支持AJAX的WCF服务会在web.config中添加如下配置段。操作元素enableWebScript给Web服务添加了JSON支持,因此Web服务可以直接接收和返回能由JavaScript客户端用户使用的JSON对象:
&system.serviceModel&&behaviors &&endpointBehaviors&&behavior name="HelloServiceAspNetAjaxBehavior"&&enableWebScript /&&/behavior&&/endpointBehaviors&&/behaviors&&serviceHostingEnvironment aspNetCompatibilityEnabled="true" /&&services&&service name="HelloService"&&endpointaddress=""behaviorConfiguration=HelloServiceAspNetAjaxBehavior"binding="webHttpBinding" contract="HelloService" /&&/service&&/services&&/system.serviceModel&
Web服务在ASPX页面上通过ScriptManager的Services属性配置。前面已使用 Service Reference Collection编辑器指定了服务。该编辑器把Services元素添加到ScriptManager中,这个ScriptManager包含的ServiceReference元素用path属性引用了Web服务。
&asp:ScriptManager ID="ScriptManager1" runat="server"&&Services&&asp:ServiceReference Path="HelloService.svc" /&&/Services&&/asp:ScriptManager&
在客户脚本中异步调用Web服务。这里Web服务是通过调用Greeting方法来调用的,并给它传送了一个由Web服务的Greeting操作定义的字符串:
helloService.Greeting(l.value);
结果会异步到达。Web服务完成时调用的方法是由set_defaultSucceededCallback方法指定的。万一Web服务失败,所调用的方法就由set_defaultFailedCallback方法指定。
helloService.set_defaultSucceededCallback(helloSucceed);helloService.set_defaultFailedCallback(helloFailed);
使用set_defaultSucceededCallback和set_defaultFailedCallback方法,无论用Web服务调用什么操作,每次Web服务操作成功或失败时,都会调用赋予这些方法的函数。除了使用这些默认方法之外,还可以直接把成功和失败函数赋予调用Web服务的操作。在示例中,Web服务提供了Greeting操作。代理对象的Greeting()函数把Greeting请求发送给Web服务。除了给Web服务传送输入参数之外,还可以传送helloSucceed和helloFailed函数,如下所示:
helloService.Greeting(l.value, helloSucceed, helloFailed, null);
这样,就可以根据所调用的操作创建不同的成功和失败函数了。
【责任编辑: TEL:(010)】&&&&&&
关于&&&&&&的更多文章
循序渐进学习iOS应用开发
对于开发者和软件设计师来说,苹果公
本书描述了黑客用默默无闻的行动为数字世界照亮了一条道路的故事。
讲师: 39人学习过讲师: 7人学习过讲师: 10人学习过
尼古拉?特斯拉是19世纪末20世纪初那场改变了人们日常
这是一本写给高中生、大学生以及所有希望提高分析思维
本书是企业应对不断变化的市场环境、客户期望和新技术
本书是目前中文版本第一个真正介绍PHP 5及MySQL 5新增语法与功能的权威宝典!
本书本着精、全、要三宗旨,从理论中延伸,从实践
51CTO旗下网站

我要回帖

更多关于 web窗体添加表格 的文章

 

随机推荐