创建一个无缝的Web应用方法.doc

创建一个无缝的eb应用方法准备工作：1、用脚本来创建数据库，D:sourceerpFOD_11Infrastructure下的工程文件，复制JDBC的驱动文件，从 C:oraclexeapporacleproduct10.2.0serverjdbclib复制ojdbc14和ojdbc14_g到OracleMiddlewarewlserver_10.3serverlib2、 在perties 中检查jdbc.urlBase=jdbc:oracle:thin:1這里改成自己的IP、在perties 中检查jdeveloper.home=C:/Oracle/Middleware/jdeveloper第一章、Create Business Components（创建业务组件）1、 Create a New Application(创建一个新的应用)方法如下。输入application Name,Application Template选择Fsion Web Application(ADF),然后点击Finish。2、 Create a Database Connectio（创建数据库连接）以上主要用数据库，连接名称任意输入，用户名：fod,密码：fusion,连接类型：oracle (JDBC)，最后点击“Test Connection”,如出现Success则连通成功。点完成。3、 Create Oracle ADF Business Components（创建Oracle ADF 业务组件）点filenew出现下图所示 bussiness TierADF Business Components点击直接点击，出现如下图所示点Query搜索表，在Available中选择你需要的表到Selected中去。点ext点finish4、 编辑视图5、 Add Validation Logi（添加有效的逻辑）6、 测试业务组件逻辑右击FODModle,点Runconnect，然后组件浏览器将会打开，它可以对数据进行操作。第二章、Create a Simple User Interface（创建一个简单的用户接口）1、Create the Page FlowFileNewweb TierJSFADF TaskFlow点击，一个page flow页面会生成，在组件面板中把拖两个view组件到该页面中，然后在组件面板中点击control Flow case,对2个view拉两条双向的流程线，线条上分别改名为goEdit和goBrowse，如下图。2、Create a JSF Page3、Create a Browse Page4、Create an Edit Page5、Create a Create Action6、Run the Application第三章、Add a List of Values（添加列表值）1、Create a Static View Object(创建一个静态的视图对像)选择工程model然后点击fileNew Business TierADF business Componentsview object输入Name后选择Rows populated at design times(static List静态列表，设计时列举的列表),点Next点New后进入如下画面选择key Attribute,点击Ok2、Create a Static LOV在编辑窗口，点出editOrders.jslpx ,把OrderStatusCode输入框删除，进入Data Controls 面板，展开FODModuleDataControlOrderView1节点，选择OrderStatusCode属性，把它拖到OrderShippedDate右边，依次点击Create context menuSingle Selections ADF。3、Create a Lookup View Object在the Application Navigator，点击oderlfileNewBuiness TierADF Business CommentsView object在Name中输入CustomerView, 选择Read-only access through SQL query.然后点击Next.出现下图在Query Statement中输入“SELECT * from PERSONS PersonsWHERE Persons.PERSON_TYPE_CODE = CUST“，然后点击Test ,如果出现query is valid的信息，再点击Next一直到第6步，在第6步画面中确认PersonId一定要在Select Attribute列表中。勾选上Key Attribute后点下一步到第8步勾选 Application Module后点finish, 在 editor window中, 打开 Orders.xml，然后进入View Accessors tab中，点击 Add，出现如下图画面左边选择CustomerView到右边去,然后点ok, 在Orders.xml画面中，选择ttributes页标签，然后选择CustomerId项在attribtes表中，然后在Validaation Rules项中点dd出现下图所示。在 Add Validation Rule dialog对话框中, 从 Rule Type列表中挑选“Key Exists”，从Validation Target Type 列表中选择” View Accessor “在 Orders Entity Attributes面板中挑选 CustomerId，在Validation Target Attributes面板中选 PersonId， 点击 Add,然后点ok, Click OK to continue without defining an error message.4、Create a Dynamic LOV在编辑窗口，打开OrdersView.xml 并选择select the Attributes tab，在attributes table中选择 CustomerId attribute., 展开List of Values section.点Add为这个项目增加一个LOV 。在List of Values dialog对话框中, 从List Data Source下拉列表中选择 Orders.CustomerView1 list. 从the List Attribute 下拉列表中选择 PersonId , 选UI Hints 页，在Available pane 中选择下列属性到Selected面板中,它们是: PersonId, FirstName, LastName, Email, Gender，然后点关闭当前窗口。在编辑窗口点出editOrders.jspx，选择输入框栏位CustomerId并删除它。在 Data Controls面板中, 展开 FODModuleDataControl | OrdersView1节点，选择CustomerId attribute 把它拖到页面的先前位置。第四章：Add a Search Form（添加一个搜索表单）、在编辑窗口打开OrdersView.xml页面并选择Query Tab页,如下图所示。在 the View Criteria部分点击(Add)。在 Create View Criteria dialog对话框, 在Edit Query Criteria 页, 点击Add item按钮。I在Criteria Item 部分, 从Attribute下拉列表中选择 OrderId ，从 Operator 下拉列表中.选择 Greater than or equal to，在 Operand下拉列表中确认是选择的 Literal . 在Value栏位中输入1.点击”Test”测试语法的有效性。当出现 query is valid信息时点击OK.。点击 Control Hints tab. 选择Select Query Automatically, 从“Search Region Mode”下拉列表中选择Advanced，点击OK关闭“ the Create View Criteria dialog”对话框。2、Add a Search Form to the Page（添加一个搜索窗口到页面）在编辑窗口打开browseOrders.jspx tab页，在结构窗口中展开at form,在at form中你会看到af:panelFormLayout，在 Data Controls panel中展开 OrdersView1 节点和 Named Criteria 节点，选择 OrdersViewCriteria 并把它拖到 af:panelFormLayout中并在 af:form 结构窗口中， (这个搜索窗口的位置应页面的顶端并且在窗口组件中)，依次选择下列菜单 Create context menu, choose Query ADF Query Panel。通过structure看看Query 面板拖的位置是不是form中并在af:panelFormLayout前面，如果在af:panelFormLayout中没有必要有一个query组件就把它放在页的顶端。结关系如下图所示，在Structuer窗口中，选择af:table组件，在属性检查器上展开Behavion部分，在PartialTriggers栏位，选择Edit属性打开the Edit Property dialog对话框在 Available panel中依次展开panelgroupLayout panelHeader。然后选择 query* - 到 Selected panel， 最后点击OK。可以开始运行了。第五章 Add a Graph（添加一个图片）1、Create a View Object（添加一个视图对象）选择工程model然后点击fileNew Business TierADF business Componentsview object输入 WarehouseStockLevelsView作为对象名. 选择 Read-only access through SQL query, 点Next. 在第2步在 Query处输入SQL语句，有下列字段: the warehouse id, warehouse name, product id, and quantity on hand. For example如名如下：SELECTWarehouses.Warehouse_id,Warehouses.Warehouse_Name, WarehouseStockLevels.Product_Id, WarehouseStockLevels.Quantity_On_Hand FROM WAREHOUSES Warehouses, Warehouse_Stock_Levels WarehouseStockLevels WHERE Warehouses.warehouse_id = WarehouseStockLevels.warehoClick Test to validate the SQL syntax. Click OK when the query is valid message displays. Click Next, accepting defaults until you reach step 6 of the wizard, Attribute Settings. For the WarehouseId attribute, select Key Attribute, to use this later for the graph binding in the page. Then click Finish.2、Add the View Object to the Application Module（添加一个视图链结对象到应用模块）依次展开节点model.model.FOModel然后点击fileNew Business TierADF business Componentsview object输入OrderItems_WarehouseStockLevels_ViewLink 作为对象名，点 Next在Select Source Attribute展开OrderItemsView 并选择ProductId，在Select Destination Attribute pane展开WarehouseStockLevelsView 并选择 ProductId，点击 Add在两者之间建立链接。点击 Next 到整个向导结束，通通采用缺省值。然后点击完成。在Application Navigator中双击 FodModule打开application module definition in the overview editor.选择 the Data Model tab.在Available View Objects pane中展开 OrderItemsView并选择WarehouseStockLevelsView via OrderItems_WarehouseStockLevels_ViewLink.在Data Model pane展开 OrdersView1并选 OrderItemsView2. 点击Add Instance to add the view object via the view link3、Add a Graph to the Page（添加一个图表到这个页面）In the editor window, click the browseOrders.jspx tab to bring the page forward. In the Structure window, make sure the component hierarchy of browseOrders.jspx is shown. In the Data Controls panel, expand the OrdersView1 | OrderItemsView2 nodes. Drag the WarehouseStockLevelsView1 node to the Structure window and drop it on the af:form component. (This ensures the collection is placed on the page below the OrderItems detail table.) From the Create context menu, choose Graphs. From the Create context menu, choose Graphs. In the Component Gallery, select Bar from the Categories list and Bar in the Graph Types section. Then click OK.In the Create Bar Graph dialog, make sure Include Child Accessors is not selected.Drag QuantityOnHand from the Available list to the Bars field. Drag WarehouseName from the Available list to the X Axis field. Then click OK.In the Structure window, select the af:table component. In the Property Inspector, Common section, enter orderItemsTable as the Id property and press Enter. In the Structure window, select the dvt:barGraph component. In the Property Inspector, expand the Behavior section, then choose Edit from the PartialTriggers dropdown menu to open the Edit Property dialog. In the Available panel, select table* - orderItemsTable and shuttle it to the Selected panel. Then click OK. Click Save All to save your work. In the editor window, click the orders-flow.xml tab to bring the diagram forward. Right-click the browseOrders page icon and choose第六章 Use Templates and Regions（使用模板和层）1、Create a Template（创建一个模板）A、在应用浏览器中选择 ViewController project，依次点开fileNewweb Tier?JSFJSF page Template B、输入文件名 OrdersTemplate.jspx。C、把 Definitions tab 点到前面,点击 Add. 输入入 main 在 name field 然后点OK.D、在Component Palette, ADF Faces page, 展开Layout panel.拖 Panel Border Layout 到刚生生成的页面上E、从 Component Palette, Layout panel,拖Panel Header 到页面的顶端。F、在Property Inspector, Common section,把 Text属性值改为 Acme Inc。G、展开 Appearance section，从Icon field下拉列表中选择Edit. 然后选择一张图片目的是包含在页面中，点yes添加一个图标在文档的脚，然后点Save。H、在 Property Inspector展开Style section, 然后选择 Background tab. 从 Color 下拉列表中选择一个颜色做为背境颜色的属性。I、在Component Palette, Layout panel, 拖 Panel Box 到border layout component的中央 (in between the start and end facets)。J、在Property Inspector, Common section, 把Text 属性值改为 Order Application.展开Style 部分点击 Box tab. 在Padding 栏位输入 10, 然后从下一个栏位的下拉列表中选择 Pixel 。K、在Component Palette, expand the Common Components panel. 拖 OutputFormatted 到页面的bottom 版面。L、在 Property Inspector, Common section, 把 Value property 值改为 Copyright © 2007, Acme Inc. All rights reserved.。M、在 Component Palette, Common Components panel, 把 FacetRef 拖到panel Box的边上。N、在Insert Facet Ref dialog, 从Facet Name下拉列表框选择main，然后点OK。2、Create a Page with the Template（用这个模板创建一个页面）A、在Application Navigator的 ViewController 中, 依次展开 Web Content | Page Flows双击adfc-config打开缺省的页面流程图。B、在 Component Palette, ADF Task Flo