ADF页面中嵌入javascript有两种方式

一、ADF页面中嵌入javascript有两种方式：

1、页面中直接写入。举例：

Java代码  

1. <af:resource type="javascript">  
2.   function sayHello() {  
3.       alert("Hello, world!")  
4.   }  
5.     
6.   function sayJianlong() {  
7.       alert("Hello, world!")  
8.       var greeting = AdfPage.PAGE.findComponentByAbsoluteId("greeting");  
9.       alert(greeting);  
10.       greeting.setValue("http://www.ejianlong.com");  
11.   }  
12.     
13.   function sayHtml() {  
14.       var name = document.getElementById("name").value;  
15.       alert(name);  
16.   }  
17.     
18. </af:resource>    

2、使用外部链接js文件。例如：

Java代码  

1. <af:resource type="javascript" source="/mc/js/F00mc004.js"></af:resource>  

二、ADF页面中对js函数的访问方式。

Java代码  

1. <?xml version='1.0' encoding='UTF-8'?>  
2. <!-- ADF中使用javascript示例 -->  
3. <jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.1"  
4.           xmlns:f="http://java.sun.com/jsf/core"  
5.           xmlns:h="http://java.sun.com/jsf/html"  
6.           xmlns:af="http://xmlns.oracle.com/adf/faces/rich">  
7.   <jsp:directive.page contentType="text/html;charset=UTF-8"/>  
8.   <f:view>  
9.     <af:document id="d1" title="my test for javascript\html\adf">  
10.       
11.       <!-- ADF Tag内嵌JS代码方式 -->  
12.       <af:resource type="javascript">  
13.         function sayHello() {  
14.             alert("Hello, world!")  
15.         }  
16.           
17.         function sayJianlong() {  
18.             alert("Hello, world!")  
19.             var greeting = AdfPage.PAGE.findComponentByAbsoluteId("greeting");  
20.             alert(greeting);  
21.             greeting.setValue("http://www.ejianlong.com");  
22.         }  
23.           
24.         function sayHtml() {  
25.             var name = document.getElementById("name").value;  
26.             alert(name);  
27.         }  
28.           
29.       </af:resource>  
30.         
31.       <af:resource type="javascript" source="/mc/js/F00mc004.js"></af:resource>  
32.         
33.       <!-- 测试ADF JS调用 -->  
34.       <af:commandButton text="Say Hello" id="button1">  
35.          <af:clientListener method="sayHello" type="click"/>  
36.       </af:commandButton>  
37.         
38.       <!-- 测试ADF JS调用，通过ADF js组件访问ADF Component -->  
39.       <af:commandButton text="Say Jianlong and show it's websit url" id="button12">  
40.          <af:clientListener method="sayJianlong" type="click"/>  
41.       </af:commandButton>  
42.       <af:outputText id="greeting" value="" clientComponent="true"/>  
43.         
44.       <!-- 测试ADF Tag与HTML Tag混用，并通过HTML Tag访问ad:resource标记的JS function -->  
45.       <af:panelBox text="PanelBox1" id="pb1">  
46.         <f:facet name="toolbar"/>  
47.         <form id="form1">  
48.             <input id="name" type="text" value="please input your name" />  
49.             <input id="button" type="button" οnclick="sayHtml()" value="sysHTML" />  
50.         </form>  
51.       </af:panelBox>  
52.         
53.       <!-- 测试ADF Tag与JSF Tag混用，并通过JSF Tag访问ad:resource标记的JS function -->  
54.       <af:panelBox text="PanelBox2" id="pb2">  
55.         <f:facet name="toolbar"/>  
56.         <h:commandButton id="testJSF" type="button" value="testJSF" οnclick="sayHello()" />  
57.       </af:panelBox>  
58.   
59.       <af:panelFormLayout id="pfl1">  
60.         <af:form id="f1">  
61.           <af:commandButton text="access js function from js file" id="cb1">  
62.             <af:clientListener type="click" method="sayOutFileJS"/>  
63.           </af:commandButton>  
64.         </af:form>  
65.         <f:facet name="footer"/>  
66.       </af:panelFormLayout>  
67.   
68.     </af:document>  
69.   </f:view>  
70. </jsp:root>  

F00mc004.js源码如下：

Java代码  

1. function sayOutFileJS() {  
2.     alert("This is function which is in a js file ");  
3. } 
   

-----------------------------------------------------------------

ADF 11g不再支持Onclick等JavaScript，而是采用<af:clientListener>来实现诸如删除某条记录的提示框。

 

[javascript] view plain copy

1. function confirmDelete() {  
2.   
3.   
4. if (confirm('Are you sure you want to delete this record?'))  
5.   
6.   
7. return true;  
8.   
9.   
10. else  
11.   
12.   
13. return false;  
14.   
15.   
16. }  

[xhtml] view plain copy

1. <af:commandLink actionListener="#{bindings.removeRowWithKey.execute}"  
2.   
3.   
4. action="#{viewCalStatus.deleteCalStatus}" text="Delete">  
5.   
6.   
7. <af:clientListener method="confirmDelete" type="click"/>  
8.   
9.   
10. <af:setActionListener from="#{row.rowKeyStr}" to="#{requestScope.calStatusRow}"/>  
11.   
12.   
13. </af:commandLink>  

 

 

 

ADF 中的<af:commandLink>和<af:commandButton>传递参数的方法

  
  

   
   

    
    

     
     [xhtml] 
     
     view plain
     
     copy
    
    
   
   
   
   
<af:commandLink id= “” text= “”><f:param name= “param_name” value= “param_value”/></ af:commandLink>  
  
  
  
 
  
评论：<af:commandLink>可以采用该方法传递参数，而<af:commandButton>不行。不过可以应用<h: commandButton >代替<af:commandButton>实现参数传递。
具体方法如下：
 
  
  

   
   

    
    

     
     [xhtml] 
     
     view plain
     
     copy
    
    
   
   
   
   
<h:commandButton value="更新" action="#{emplBean.edit_action}" id="cb1">       <input type="hidden" name="emplId" value="${emplBean.employee.empno}"/></h:commandButton>