仓酷云

标题: ASP网页编程之AJAX和Web开辟新手艺：Dynamic Faces [打印本页]

作者: 再现理想 时间: 2015-1-16 22:19
标题: ASP网页编程之AJAX和Web开辟新手艺：Dynamic Faces
ASP是依赖组件的，能访问数据库的组件好多就有好多种,再有就是你微软的工具可是什么都要收钱的啊！ajax|web　　ProjectDynamicFaces是数个扩大JavaServerFaces手艺的的项目之一。ProjectDynamicFaces是一个立异型的项目，供应了向基于JavaServerFaces手艺的使用软件增加Ajax功效的办法。它使我们可以让使用软件已在利用的任何JavaServerFaces组件撑持Ajax功效。我们无需对组件举行修正就可以够使它们撑持Ajax，我们也无需对使用软件举行任何修正就能够使它具有Ajax的魔力。

　　要使使用软件具有Ajax魔力，我们必需起首断定使用中但愿Ajax功效更新的网页部分。象基于JavaServerFaces手艺的开辟职员懂得的那样，JavaServerFaces网页是由组件树暗示的。使用DynamicFaces，我们可以断定组件树中的哪一个组件会受害于异步更新。就象利用Ajax更新代表网页的HTMLDOM树的一部分那样，我们利用DynamicFaces更新代表JavaServerFaces网页的组件树的一部分。因而，DynamicFaces机制关于Ajax和JavaServerFaces开辟职员而言是熟习的。

　　更主要的是，DynamicFaces利用JavaServerFaces组件形式，使我们可以以一种更无效的体例使用Ajax功效。因为组件形式的合作特征，一些网页组件上的JavaScript事务可以触发该网页上任何数目的别的组件的异步更新。DynamicFaces使得这些异步更新只是向服务器发送的一次Ajax哀求的了局，而不是招致每次异步更新的Ajax哀求的了局。

　　DynamicFaces还使用JavaServerFaces组件形式无效地办理客户机端和服务器真个形态。当DynamicFaces更新客户机端上的组件形态时，它更新的只是已改动的组件而不是全部树的形态。最好的一点是DynamicFaces在背景完成一切这些操纵，并且是以一种与JavaServerFaces手艺的性命周期完整分歧的体例完成的。

　　除简化向使用软件增加Ajax功效外，DynamicFaces还向我们供应了增加Ajax功效的办法的天真性。这篇文章将会商使用DynamicFaces使使用软件更具交互性和活气的三种办法：

　　・使用DynamicFaces供应的定制ajaxZone标签断定组件树中必要被Ajax化的部分。

　　・使用DynamicFaces供应的JavaScript库向单个组件增加Ajax功效。

　　・在一个网页中增加撑持Ajax的组件，比方jMakiwidget。

　　在进修这些手艺前，我们先来看看使用软件怎样才干利用DynamicFaces手艺。

　　开辟使用DynamicFaces的使用软件

　　经由过程向一个尺度的JavaServerFaces1.2完成中增加Ajax功效，DynamicFaces使用了JavaServerFaces手艺的运转工夫库的可扩大性。DynamicFaces的中心是定制的Lifecycle和ViewRoot完成。这二个完成是JavaServerFaces手艺供应的尺度Lifecycle和ViewRoot完成的扩大，一个尺度的Lifecycle工具代表JavaServerFaces性命周期的一个实例，一个尺度的ViewRoot工具代表一个组件树的根。团结利用定制Lifecycle工具和定制ViewRoot工具，使JavaServerFaces性命周期可以处置Ajax事件，在无需对全部网页更新的情形下从头显现组件树的一部分。这些定制完成从命于不撑持Ajax哀求的尺度完成。

　　为了使JavaServerFaces手艺运转工夫库晓得定制Lifecycle工具的存在，我们必需在设置形貌器中使用一个初始化参数向FacesServlet实例呈报该工具。

＜servlet＞
＜servlet-name＞FacesServlet＜/servlet-name＞
＜servlet-class＞javax.faces.webapp.FacesServlet＜/servlet-class＞
＜init-param＞
＜param-name＞javax.faces.LIFECYCLE_ID＜/param-name＞
＜param-value＞com.sun.faces.lifecycle.PARTIAL＜/param-name＞
＜/init-param＞
＜load-on-startup＞1＜/load-on-startup＞
＜/servlet＞
　　别的，我们还必需将DynamicFaces依附的JavaArchive（JAR）文件增加到使用软件的webarchive（WAR）文件的lib目次中。由于DynamicFaces是基于JavaPlatformEnterpriseEdition5（JavaEE5）的，我们所必要的几近一切依附干系都已存在。最初一个依附是ShaleRemoting，DynamicFaces使用它从Java类路径中加载JavaScript文件和别的资本。ShaleRemoting依附于commons-logging，因而我们必需向使用软件供应commons-logging。

　　最初，我们必需在利用它的每一个网页中申明该DynamicFaces标签库。关于切合尺度的非XML语法的JavaServerPages（JSP）网页而言，这类申明以下所示：

＜%@taglibprefix="jsfExt"uri="http://java.sun.com/jsf/extensions/dynafaces"%＞
　　关于切合XML语法的JavaServerPages（JSP）网页而言，这类申明以下所示：

＜jsp:rootxmlns:jsp="http://java.sun.com/JSP/Page"version="1.2"
xmlns:jsfExt="http://java.sun.com/jsf/extensions/dynafaces"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"＞
　　假如利用Facelets而非JSP，语法与JSPXML的语法十分类似，以下所示：

＜htmlxmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:jsfExt="http://java.sun.com/jsf/extensions/dynafaces"
xmlns:f="http://java.sun.com/jsf/core"＞
　　好了。我们能够入手下手使用DynamicFaces向使用软件中增加Ajax功效了。

　　作为一种手动设置使用软件的替换性计划，我们可使用DynamicFaces下载包，个中包含面向JSP和Facelets的空缺使用软件。假如利用现成的空缺使用软件，一切的设置事情已事后完成，我们就能够入手下手编写网页了。
<P>　　使用ajaxZone标签更新部分网页

　　断定网页上哪些组件将撑持Ajax的一种体例是用DynamicFaces供应的ajaxZone定制标签封装它们。当如许做时，我们就告知DynamicFaces只异步更新利用ajaxZone标签断定的组件树部分。

　　比方，假定我们有一个带有一系列按钮的网页，客户在网上购置汽车时，能够用这些按钮选择尺度或奢华装修。当客户点击一个按钮时，一系列别的组件的值会产生变更，而不会形成全部网页被更新。当客户改动一个组件的值时，汽车的代价也会改动，但不会形成全部网页的更新。

　　显现的是cardemo使用软件中网页的一个屏幕快照，它使客户可以选择汽车的设置情形。

：选择汽车的设置

　　显现了二个由ajaxZone标签分别的地区。当客户点击地区2中的一个按钮时，该地区中组件的值会产生变更。当客户改动地区2中的一个组件的值时，地区1中YourPrice输入组件的值也会随之变更。

　　要完成如许的功效，我们必要将一切组件封装在ajaxZone标签中，以下所示：

＜jsfExt:ajaxZoneid="zone1"＞
＜h:panelGridcolumns="2"＞
＜h:outputTextstyleClass="subtitle"
value="#{bundle.basePriceLabel}"/＞
＜h:outputText
binding="#{carstore.currentModel.components.basePrice}"/＞
＜h:outputTextstyleClass="subtitle"
value="#{bundle.yourPriceLabel}"/＞
＜h:outputTextvalue="#{carstore.currentModel.currentPrice}"/＞
＜/h:panelGrid＞
＜/jsfExt:ajaxZone＞
＜jsfExt:ajaxZoneid="zone2"
action="#{carstore.currentModel.updatePricing}"＞
＜h:commandButtonid="Standard"value="#{bundle.Standard}"
styleClass="#{carstore.customizers.Standard.buttonStyle}"
actionListener="#{carstore.choosePackage}"/＞
＜h:commandButtonid="Deluxe"value="#{bundle.Deluxe}"
styleClass="#{carstore.customizers.Deluxe.buttonStyle}"
actionListener="#{carstore.choosePackage}"/＞
＜h:outputTextvalue="#{bundle.Engine}"
styleClass="optionLabel"/＞
＜h:selectOneMenustyleClass="optionValue"
binding="#{carstore.currentModel.components.engine}"/＞
＜h:outputTextvalue="#{bundle.Speakers}"
styleClass="optionLabel"/＞
＜h:selectOneRadiostyleClass="optionValue"
binding="#{carstore.currentModel.components.speaker}"/＞
＜/jsfExt:ajaxZone＞
　　后面的代码中包括名字分离为zone1和zone2的二个域。象代码显现的那样，zone1中只要一个输入组件，因而它不会发生任何Ajax哀求；Zone2域中包括有输出和输入组件。当客户点击2个按钮中的1个，大概选择菜单或单选按钮列表中的一个选项时，zone2中的组件会启动一个Ajax哀求。这一哀求将引发办法表达式#{carstore.currentModel.updatePricing}中界说的操纵被挪用。

　　当利用域时，每一个Ajax事件将使得网页中的一切域被更新。后面例子的效果是，当用户选择zone2中的任何输出组件时，Ajax功效会主动地更新zone1中的汽车代价数据。

　　值得指出的是，我们无需编写一行JavaScript代码就可以够完成这一例子，我们也无需任何定制组件。这一使用软件利用了我们熟知的一般而复杂的JavaServerFaces组件，但它们已可以撑持Ajax功效了。

　　ajaxZone标签向网页创作者供应了一种利用DynamicFaces的复杂、熟习、直不雅的体例。在最复杂的例子中，ajaxZone标签可以向网页创作者供应所必要的功效。ajaxZone标签撑持很多使我们可以进一步定制其操纵的别的属性，ajaxZone文档中包括有其属性的完全清单。

　　上面的部分将会商利用DynamicFaces的另外一种办法，它使我们可以细粒度地把持网页中组件的Ajax化。
<P>　　利用DynamicFacesfireAjaxTransaction办法

　　为了对与Ajax相干的义务举行细粒度的把持，我们可使用DynamicFaces供应的内置JavaScript库。经由过程利用现有组件标签中符合的DynaFaces.fireAjaxTransactionJavaScript函数，我们能够对网页中组件异步更新体例有更细粒度的组件级把持。

　　比方，假定我们但愿网页中的一些组件对一品种型的JavaScript事务━━比方onclick作出呼应，并但愿该网页中的别的组件对别的范例的JavaScript事务作出呼应。又假定我们但愿天生一个Ajax哀求的每一个组件可以引发组件树的分歧部分被异步更新。为了完成这些义务，我们必要利用fireAjaxTransaction函数。

　　为了利用fireAjaxTransaction函数，必要完成上面的筹办事情：

　　・在一个组件标签中增加一个JavaScript事务属性，比方onclick。

　　・将该属性的值设置成DynaFaces.fireAjaxTransaction函数。

　　・向该函数传送一系列参数。

　　上面的代码是一个复杂的HelloWorld例子中一个网页的一部分，用户能够输出他或她的名字，点击一个按钮，使用程序会用一条包括用户名字的问候语呼应用户的输出。

...
＜f:view＞
...
＜h:formid="form"prependId="false"＞
...
＜h:graphicImagevalue="wave.med.gif"/＞
＜p＞
Hello,mynameisDuke.Whatisyourname?
＜p＞
＜h:inputTextid="input"value="#{testBean.name}"/＞
＜h:commandButtonid="button"
actionListener="#{testBean.changeText}"

value="click"/＞
＜p＞
＜h:outputTextid="text"value="#{testBean.text}"/＞
＜/h:form＞
...
＜/f:view＞
　　在下面的例子中，inputText标签代表一个输出域。当用户在该输出域中输出内容，并点击commandButton标签暗示的按钮，就会呈现上面的情形：

　　1、DynaFaces.fireAjaxTransaction函数实行，使得DynamicFaces向服务器发送一个Ajax哀求。

　　2、服务器前往一个DynamicFacesJavaScript库处置的出格XML呼应。

　　3、符合的库函数用新的值更新HTMLDOM树。

　　为了告知fireAjaxTransaction函数怎样天生Ajax哀求，我们向它传输一系列参数。在下面的例子中，我们向fireAjaxTransaction函数传送了2个参数。上面是挪用fireAjaxTransaction函数的代码：

　　This参数指的是代表触发该事务的按钮的标签，别的参数由唆使DynamicFaces怎样处置该哀求的选项构成。在这个例子中，选项是execute和render。

　　Execute和render选项指的是JavaServerFaces性命周期的部分，如所示：

：DynamicFaces怎样使用execute和render选项分别JavaServerFaces手艺的性命周期

　　Execute是在postback时代实行的性命周期部分。它包括有处置形式工具的数据转换、考证、更新阶段；Render依据对网页的哀求显现该网页。

　　在对fireAjaxTransaction函数的挪用中利用的execute选项列出了在JavaServerFaces性命周期的execute部分时代必需处置的组件的ID，HelloWorld例子中的这行代码以下所示。

execute:input,button

　　承受用户名的input组件必需实行性命周期的execute部分，由于它的数据必需被保留到形式工具中。Button组件也应该实行性命周期的execute部分，由于InvokeApplication阶段是性命周期execute片段的一部分。

　　当性命周期的render片段显现一个利用DynamicFaces的网页时，作为一次Ajax哀求的了局，它只显现该网页上被选定的组件。我们利用render选项显现要从头显现的组件的ID，HelloWorld例子中的render选项以下所示：

render:input,text

　　在这一例子中，作为Ajax哀求的了局，性命周期的render片段会从头显现网页上的input和text组件。当用户点击该按钮时，代表input组件的输出字段和代表text组件的输入文本会被再次显现。输出字段会被从头显现，扫除在点击该按钮前用户输出的值。输入文本会被从头显现，显现包括在点击该按钮前用户在输出域中输出的值的信息。该网页上的别的组件无需被从头显现。

　　除execute和render选项外，我们还可使用别的选项，进一步定制DynamicFaces处置事务的体例。必要记着的是，利用fireAjaxTransaction函数使我们可以对网页中的哪些组件会得益于Ajax有更多的把持。现实上，fireAjaxTransaction函数让我们可以可以使网页中的任何组件撑持Ajax，而无需编写JavaScript或任何别的代码。
<P>　　团结利用DynamicFaces和jMaki

　　至此，我们已进修了怎样利用DynamicFaces从头显现撑持Ajax的JavaServerFaces组件。可是，怎样增加已经在基于JavaServerFaces的使用软件中看到的撑持Ajax的widget呢？

　　我们能够使用ProjectjMaki将喜好的widget封装在JavaServerFaces组件中。如许，我们既可以享用到JavaServerFaces组件形式的优点，也可以取得利用被封装为JavaServerFaces组件的widget的天真性。同时，我们不必编写为现有组件完成Ajax功效的JavaScript代码，和为widget创立JavaServerFaces组件所请求的Java平台代码。

　　怎样团结利用jMaki和DynamicFaces呢？关于网页创作者而言，这十分复杂，就是将与jMakiwidget相干的标签拖到网页中。
为了团结利用jMakiwidget和DynamicFaces，widget开辟职员必要对jMakiwidget的组件文件作一些小小的修正。这些修正使jMakiwidget可以充实使用JavaServerFaces手艺供应的组件形态办理体系，准确地转换DynamicFaces请求的header。修正的细节超越了三篇文章的会商局限，读者能够参阅相干材料。

　　DynamicFaces开辟团队已完成了转换3个与DynamicFaces.团结利用的jMakiwidget所必要的事情。被转换的jMakiwidget是script.aculo.usin-placeeditorwidget、Dojofisheyewidget、Dojoinline-editorwidget。

　　除转换fisheyewidget，开辟团队还修正了jMakiAPI，使widget可以触发一个JavaServerFaces代价修正事务，以下图所示：

＜a:ajaxname="dojo.fisheye"
value="#{fishEyeBean.selectedIndex}"
valueChangeListener="#{fishEyeBean.valueChanged}"
args="{items:[
{iconSrc:images/150x126_jalopy.jpg,caption:Jalopy,index:0},
{iconSrc:images/150x126_luxury.jpg,caption:Luxury,index:1},
{iconSrc:images/150x126_roadster.jpg,caption:Roadster,index:2},
{iconSrc:images/150x126_suv.jpg,caption:SUV,index:3}
]}"
/＞
　　DynamicFaces和jMaki开辟团队正在抓紧事情，确保一切的jMakiwidgets撑持DynamicFaces。

　　如今，让我们来站在网页创作者的角度来会商这一成绩。要想弄分明怎样团结利用jMakiscript.aculo.usin-placeeditorwidget和DynamicFaces，我们在一个JavaServerFaces数据表组件中包括该widget，使我们可以编纂该表中一个单位的值。

　　在JSP网页中，我们必需申明请求的标签库，和DynamicFaces和jMaki标签，以下所示：

＜%@taglibprefix="f"
uri="http://java.sun.com/jsf/core"%＞
＜%@taglibprefix="h"
uri="http://java.sun.com/jsf/html"%＞
＜%@taglibprefix="jsfExt"
uri="http://java.sun.com/jsf/extensions/dynafaces"%＞
＜%@taglibprefix="a"
uri="http://java.sun.com/jmaki-jsf"%＞
　　上面的代码增加的是＜jsfExt:scripts/＞标签：

＜f:view＞

＜html＞
＜head＞
＜title＞TablewithjMaki＜/title＞
＜jsfExt:scripts/＞
＜/head＞
＜body＞
　　这一标签显现DynamicFaces所请求的JavaScript文件的＜script＞元素。

　　最初，经由过程包括一个指定被封装为jMakiwidget的in-placeeditor的jMakiajax标签，我们就将该widget增加到了网页上。

＜h:form＞

＜h:dataTable
...
rows="10"binding="#{ResultSetBean.data}"
value="#{ResultSetBean.list}"
var="customer"＞
＜h:column＞
＜f:facetname="header"＞
＜h:outputTextvalue="AccountId"/＞
＜/f:facet＞
＜h:outputTextid="accountId"
value="#{customer.accountId}"/＞
＜/h:column＞

＜h:column＞
＜f:facetname="header"＞
＜h:outputTextvalue="CustomerName"/＞
＜/f:facet＞
＜a:ajaxname="scriptaculous.inplace"
value="#{customer.name}"/＞
＜/h:column＞
＜/h:dataTable＞
...

＜/h:form＞
＜/body＞
＜/html＞
＜/f:view＞
　　显现的是上述网页：

：用户修正一个单位的值之前

　　显现的是当用户点击CustomerName列中一个单位的链接时的情形：

：用户点击CustomerName列中一个链接后的情形

　　必要注重的是，当用户点击CustomerName列中的一个元素时，客户名字元素会被一个输出组件、一个"OK"按钮、一个"Cancel"链接所代替，利用户可以编纂以后的客户名字。假如用户点击"Cancel"而不是"OK"，该单位就会被从头显现为本来的值；假如用户输出一个值，并点击"OK"按钮，新的值就会被使用Ajax手艺发送到服务器，使该形式更新为新的值。然后，被编纂的单位就会被从头显现。显现的是是单位被修正后的网页：

：在用户向服务器提交新的值后，网页从头显现为新的值

　　结论

　　ProjectDynamicFaces向我们供应了一种向基于JavaServerFaces的使用软件中增加Ajax功效的天真、无效的体例，而无需保持JavaServerFaces组件形式的任何上风。在内置的JavaScript库、Ajax完成、DynamicFaces供应的组件交互形式的匡助下，我们会发明使用DynamicFaces增加Ajax功效更简单了。基于JavaServerFaces的使用软件可以得益于jMakiwidget供应的更多的天真性。使用cdonts，可以发送、查看邮件，实现webmail的功能。结合wsh，可以实现对nt主机的管理，如nt用户管理、iis虚拟主机设置、exchange邮箱设置等等，就像管理本地机一样方便。

作者: 分手快乐 时间: 2015-1-19 08:45
封装性使得代码逻辑清晰，易于管理，并且应用到ASP.Net上就可以使业务逻辑和Html页面分离，这样无论页面原型如何改变，业务逻辑代码都不必做任何改动；继承性和多态性使得代码的可重用性大大提高。

作者: 小魔女 时间: 2015-1-28 05:52
先学习用frontpage熟悉html编辑然后学习asp和vbscript建议买书进行系统学习

作者: 山那边是海 时间: 2015-2-5 18:10
接下来就不能纸上谈兵了，最好的方法其实是实践。实践，只能算是让你掌握语言特性用的。而提倡做实际的Project也不是太好，因为你还没有熟练的能力去综合各种技术，这样只能使你自己越来越迷糊。

作者: 深爱那片海 时间: 2015-2-13 05:30
以HTML语言整合(HTML负责界面上，ASP则负责功能上)形成一个B/S(浏览器/服务器)模式的网页程序。

作者: 爱飞 时间: 2015-3-3 15:42
最近在学asp，不要问我为什么不直接学.net，因为公司网站是asp做的所以有这个需要，卖了本书asp入门到精通，对里面的六大内置对象老是记不住，还有很多属性和方法看的头晕。

作者: admin 时间: 2015-3-11 12:08
ASP主要是用好六个对象，其实最主要的是用好其中两个：response和request，就可以随心所欲地控制网页变换和响应用户动作了。

作者: 因胸联盟 时间: 2015-3-18 16:08
下面简单介绍一下我学习ASP的方法,希望对想学习ASP的朋友有所帮助...

作者: 活着的死人 时间: 2015-3-26 12:32
你可以通过继承已有的对象最大限度保护你以前的投资。并且C#和C++、Java一样提供了完善的调试/纠错体系。

欢迎光临仓酷云 (http://ckuyun.com/)