How to Configure Alta UI Skin in JDeveloper 12.1.x

How to Configure Alta UI Skin in JDeveloper 12.1.x

The Oracle Alta UI is  the modern UI design for mobile and web applications.
 By default, the Skyros skin is applied to the new fusion web application.

To use the Alta UI skin, change the <skin-family> value from skyros to alta in the 

trinidad-config.xml file of your fusion web application as shown below

<?xml version="1.0" encoding="UTF-8"?>
<trinidad-config xmlns="http://myfaces.apache.org/trinidad/config">
  <skin-family>alta</skin-family>
  <skin-version>v1</skin-version>
</trinidad-config>

Mostly you want to customize the Alta UI skin for your application. To create a customized ADF skin in 

JDeveloper 12, right-click your view controller project, choose New => From Gallery => New Gallery dialog.

In the Web Tier category, select JSF/Facelets and then ADF Skin:

 Fill the information for your new skin.

In the Skin page, choose one of the ADF skins that Oracle ADF provides. In the current version of Developer 12.3.1,

 the Alta UI skin is not available in the list yet. Simply accept skyros-v1.desktop. JDeveloper will help us 

to create and modify the associated configuration files, then we will fix it.

Itrinidad-skins.xml file, shows that your skin extends from  Skyros Skin family.

To make your skin to extend from the Alta UI skin, change the <extends> value from the skyros-v1.desktop

 to alta-v1.desktop as below:

<?xml version="1.0" encoding="UTF-8"?>

<skins xmlns="http://myfaces.apache.org/trinidad/skin">

  <skin>

    <id>myskin.desktop</id>

    <family>myskin</family>

    <extends>alta-v1.desktop</extends>

    <render-kit-id>org.apache.myfaces.trinidad.desktop</render-kit-id>

    <style-sheet-name>skins/myskin/myskin.css</style-sheet-name>

    <bundle-name>org.javaplus.adfsamples.view.skinBundle</bundle-name>

  </skin>

</skins>

Now, you have your customized skin extended from the Alta UI skin.

Credit 

http://rogersuen.blogspot.com/2014/10/adf-turn-on-and-extend-new-alta-ui-skin.html

SOAP Web Service Using JDeveloper

SOAP Web Service Using JDeveloper

Any Java method can be published as a Web Service. JDeveloper provides wizards that take a Java class and its methods and creates a Web Service from that class.

Instead of manually adding the web service annotations to the Java class, you can use a JDeveloper wizard to manage that for you. The wizard adds the web service annotations and allows you to chose which methods you want to publish as web methods. This is an easy way to take an existing Java class and convert it to a web service.

In this section you create a new project and Java class, just as you did earlier. In this scenario, rather than manually adding annotations to create the web service, you use a wizard. The wizard creates all the necessary annotations to enable the class as a web service. Once the wizard steps are complete, you test the web service using the HTTP Analyzer with the integrated server, just as you did before.

Step 1: Create a Plain Old Java Object (POJO)

1. Create a new empty project. Right-click the Annotation project node and select New > From Gallery. In the New Gallery, select General > Projects in the Categories list and Custom Project in the Items list. Click OK.
   
2. In the Create Project Dialog, name the project Wizard and click Finish.
   
3. In the Applications window, right-click the new Wizard project and select New from the context menu.
   
   
4. In the New Gallery, select General > Java  in the Categories list and  Class from the Items list. Click OK to create a new Java class.
   
   
5. Name the class HelloService. By default the package name should be the project name. Ensure that the package name is set to wizard. Leave the rest of the values at their defaults and click OK to create the class and invoke the Code Editor.
   
   
6. Add the following method to the class:
       public String sayHello (String s) {
            return "Hello " + s;
       }



7. Click Save All  to save your work.
   
   At this point you just have a class with some very simple business logic to return the word Hello followed by the argument value.

Step 2: Creating the Web Service Class

Now that you have a POJO (Plain Old Java Object), you can use JDeveloper to create the annotations necessary to publish any of the methods as web services.

1. In the Applications window, right-click  HelloService.java and select Create Web Service. This starts the wizard to create the class as a web service.
   
   
2. In the Select Deployment Platform step of the Create Java Web Service wizard, ensure that the Java EE 6, with support for JAX-WS Annotations is selected as the deployment platform and click Next.
   
   
3. In the Generation Options step of the wizard, enter  MyWebService1 as the Web Service Name, and ensure that the Port Name is set to MyWebService1Port. Click Next.
   
   
4. In the Message Format step of the wizard, select the SOAP 1.2 Binding option and Click Next.
   
   
5. In the Methods step of the wizard, all the publishable methods are displayed so that you can select the ones you wish to publish. Because in this case there is only one, it is selected by default. The remaining pages are for including any additional classes the service may need, configuring policies for the service, and providing the handler details.
   You will not change any of these values, so click Finish at any of these screens to create the web service.
   
   
6. The class definition is updated with the annotation needed to publish the web service. Make sure that the port name is set to MyWebService1Port, or change it to this value in the editor.
   
   
7. Click Save All  to save your work.

Step 3: Testing the Web Service

In this section you compile, deploy and test the web service. Just as before, you use the HTTP Analyzer for testing the web service. When you test web services using the analyzer, the service is compiled and deployed to the integrated server automatically. The analyzer is then invoked, enabling you to send values to and receive values from the web service.

1. In the Applications window, right-click  HelloService.java in the Wizard project and select Test Web Service from the context menu.
   
   This option invokes the integrated server, deploys the service and then starts the analyzer. It may take a few seconds to start the Integrated server if it is being run for the first time.
   
   
   
   Just like earlier, the top portion of the HTTP Analyzer editor displays the URL for the web service, WSDL URL, and exposed Operations.
   
   
2. In the Request area, enter <your name> in the arg0 field and click Send Request.
   
   
   
   The analyzer sends the request to the service, and after a few seconds the return parameter is displayed.
   
   
   
   You have now used a wizard in JDeveloper to annotate a Java class into a web service. This is an example of a bottom-to-top approach for creating a web service. You created a java class and then made it into a web service. Sometimes a web service exists that you want to use in some way. That is an example of a top-to-bottom approach. In the next section of this tutorial, you see how to consume an existing web service.
3. In preparation for the next task of creating a web service from a WSDL file, generate the WDSL to a file. Right-click the HelloService.java class in the Navigator and select Show WSDL for Web Service Annotations.
   
   
   
   The generation of the WSDL file starts, and then MyWebService1.wsdl displays in the Design editor. You can expand and select the nodes to visualize the flows.
   
   
4. Click Imports to see what other artifacts the WSDL uses. In this case it uses MyWebService1_schema1.xsd.
5. Select MyWebService1_schema1.xsd from the drop down list.
   
   
6. The schema document opens in a visual editor window that shows the relationships of the defined elements.
   
   
7. From the menu, select File | Save As...
   
   
   
   and save the file in the root directory of your aplication (WebServicePractice.).
   
    
8. Select the MyWebService1.wsdl tab and save that file to the same directory you chose for the MyWebService1_schema1.xsd file.
9. Locate the directory where you saved the MyWebService1.wsdl file and open the file in WordPad or the text editor of your choice.
   
   
10. After you examine the file, close the text editor window.
11. Close all the tabs in the Editor and collapse the Wizard node in the Applications window.
    
    

Credit:

http://docs.oracle.com/cd/E37547_01/tutorials/tut_web_services/tut_web_services_2.html

Creating a Java Web Service using JDeveloper

Creating a Java Web Service using JDeveloper

Creating and testing Java Web Services could really be simple using JDeveloper. Let’s see how can we create a java service and test it in JDeveloper.

1. Create a project and Java class.
In Jdeveloper, click on File->New and choose General->Application in categories column. Select Generic Application and click Ok. Provide Application Name and Project Name in wizard and click ok.
Right-click on the project in Application Navigator and select New from context menu. In New Gallary window, select General->Java under Categories and then select 'Java Class' in Items section and click ok. In Create Java Class wizard, give a suitable name to class and set other properties as needed and click ok.
2. Add methods that need to be exposed as service

3. Create web service from the java class.
    Right click on the class and choose 'Create Web Service'. Rest follow the wizard for the completion. If you are not looking for any specific configuration, you can keep all the default setting in wizard. When wizard end's your service is ready to be deployed.
    Please note annotation @WebService at the start of the class, this is what makes this class to be recognized as web services.
Test your service.
    Right click on the java class and choose Test Web Service option from the context menu. This will deploy the service to Integrated Weblogic Server. Jdeveloper by default provides an interface (HTTP Analyzer) that could not only be used to provide input and receive output but we could also view WSDL, SOAP and HTTP messages. 

CaseInsensitive search in ADF Table

'filterFeatures' in ADF table column, caseInsensitive search in af:table filter

In ADF table column when we apply search using filter it matches case (A-Z,a-z), means by default search is case sensitive, to change it you can change a property in column.

When you select a column and go to propertyInspector ,change 'filterFeatures' to 'caseInsensitive'
and It will search data in table without matching case

Radio Group List Support by ADF BC

Radio Group List Support by ADF BC

Radio Group List is frequently used in Oracle Forms application screens. Same construct is supported out of the box in ADF BC. ADF BC together with ADF Faces UI perhaps is one of the best frameworks to modernize legacy enterprise applications and enable them for the Web. I will show you today how easy it is to enable Radio Group List in ADF 11g.

Application implements static VO with 3 values for Low, Average and High (L, A and H):

Main VO - JobsView, contains one transient field - Status. I'm using this transient field for demo purposes to assign Radio Group List. Transient field value is calculated using Groovy expression, it returns (L, A or H):

LOV is defined for Status field, it maps with static VO and returns Id into Status:

We want to display this LOV as Radio Group List - just set list type to be Radio Group, framework will take care for the rest:

Radio Group List is rendered for every row inside ADF table:

Sample applications doesn't process displayed Radio Group List changes, but you can do it easily based on specific use case requirements.

Enter Only Numeric In ADF InputText In JDeveloper 11g

Enter Only Numeric In ADF InputText In JDeveloper 11g

To enter only numbers/numeric value in ADF InputText, 
<af:validateRegExp/> can be used from Operations node in Component Palette.

 <af:inputText value="#{bindings.EmployeeNo1.inputValue}" label="#{bindings.EmployeeNo1.hints.label}"  
                  required="#{bindings.EmployeeNo1.hints.mandatory}"  
                  columns="#{bindings.EmployeeNo1.hints.displayWidth}"  
                  maximumLength="#{bindings.EmployeeNo1.hints.precision}"  
                  shortDesc="#{bindings.EmployeeNo1.hints.tooltip}" id="it18"  
                  autoSubmit="true"  
                  valueChangeListener="#{backingBeanScope.book.employeeDetails}">  
             <f:validator binding="#{bindings.EmployeeNo1.validator}"/>  
   <af:validateRegExp pattern="[0-9]{1,10}" messageDetailNoMatch="Enter Only Numbers"/>  
 </af:inputText>  

Get selected row (single/multiple) from POJO based table in ADF

Get selected row (single/multiple) from POJO based table in ADF

Previously i have posted about populating af:table from managed bean using POJO and adding records in it, Check this-
Populate af:table programmatically from managead bean using POJO 
In this post i am extending previous post application
This post is about getting selected row from POJO based table , It is a common requirement while using af:table based on POJO

Get single row using custom selection listener-

SelectionListener  handles selection event of table , whenever user selects a row in table ,selection listener is fired
Set table RowSelection property to single (to select one row at a time) or multiple (to select multiple row ) and create a custom selection listener in managed bean that will handle table's selection event

See selection listener code in managed bean we can get selected row  using this - 

import oracle.adf.view.rich.component.rich.data.RichTable;
import org.apache.myfaces.trinidad.event.SelectionEvent;

 /**Method to get selected row(single)
     * @param selectionEvent
     */
    public void tableSelection(SelectionEvent selectionEvent) {
        //Get table from selectionEvent
        RichTable richTable = (RichTable) selectionEvent.getSource();
        //Cast to the List that populates table
        PersonBean row = (PersonBean) richTable.getSelectedRowData();
        //Get the attributes (column) from list
        System.out.println(row.getName());
    }

Now check this -

 Output on console  

Get single/multiple selected row on a button click (ActionEvent)-

Set table RowSelection to multiple and select multiple row using Ctrl key of your keyboard
and check this code to get multiple selected row using RowKeySet, We can get all row using getSelectedRowKeys method

import org.apache.myfaces.trinidad.model.RowKeySet;
import java.util.Iterator;    



/**Method to get all selected record in af:table
     * @param actionEvent
     */
    public void getSelectedRecord(ActionEvent actionEvent) {
        //getTableBind is binding of table on page.
        RowKeySet selectedEmps = getTableBind().getSelectedRowKeys();
        //Create iterator from RowKeySet
        Iterator selectedEmpIter = selectedEmps.iterator();

        while (selectedEmpIter.hasNext()) {
            String i = selectedEmpIter.next().toString();
            //personList is the list used to populate table and name is a column of table
            //So here filter list using index and get values then
            PersonBean rowIter = personList.get(Integer.parseInt(i));
            System.out.println(rowIter.getName());
        }
       
    }

Now run and check again -

 Output on console  

Populate af:table programmatically from managead bean using POJO

Populate af:table programmatically from managead bean using POJO

This post is about a common question
How can we populate an af:table programmatically ?

It means that data in af:table is not populated through model layer (Using ViewObject) using binding layer. lets say I have some values in our managed bean and have to show records in tabular format on page

So what we have to do -

• First you should know the number and data type of columns in table, suppose i have to populate a table for person details (name, mobile number and salary). to get and set value of columns i have created a java bean class , it has 3 variable for 3 columns

// Java Class to set and get value for table column
public class PersonBean {

    public PersonBean(String name, String moNo, Integer salary) {
        this.Name = name;
        this.mobNo = moNo;
        this.salary = salary;
    }
    private String Name;
    private String mobNo;
    private Integer salary;

    public void setName(String Name) {
        this.Name = Name;
    }

    public String getName() {
        return Name;
    }

    public void setMobNo(String mobNo) {
        this.mobNo = mobNo;
    }

    public String getMobNo() {
        return mobNo;
    }

    public void setSalary(Integer salary) {
        this.salary = salary;
    }

    public Integer getSalary() {
        return salary;
    }
}



• Next step is to create a managed bean for referencing af:table , this managed bean makes use of person java bean class to add data in same format for all table rows. A List data structure is used to pass all values in af:table. See code of managed bean 



//ArrayList to poplate data in af:table
    List<PersonBean> personList = new ArrayList();

    //To Populate default row in table (Code in Constructor)

    public ProgTableBean() {
        personList.add(new PersonBean("muhammad arshad", "PK", 4000));
    }

    public void setPersonList(List<PersonBean> personList) {
        this.personList = personList;
    }

    public List<PersonBean> getPersonList() {
        return personList;
    }



• Now just drop an af:table on page and set it's properties like value, column header and text values in columns



 As i have to show only 3 columns so deleted extra ones



 Set properties -
 value- from where table collection is populated
 columns values- take the var reference of table and refer variable name in List (here 'row' is table var and second is variable name in person bean class)




 See the XML source of af:table-



<af:table var="row" rowBandingInterval="1" id="t1" value="#{viewScope.ProgTableBean.personList}"
                          partialTriggers="::b1">
                    <af:column sortable="false" headerText="Name" id="c1" width="150">
                        <af:outputText value="#{row.name}" id="ot1"/>
                    </af:column>
                    <af:column sortable="false" headerText="Mobile Number" id="c2">
                        <af:outputText value="#{row.mobNo}" id="ot2"/>
                    </af:column>
                    <af:column sortable="false" headerText="Salary" id="c3" align="right">
                        <af:outputText value="#{row.salary}" id="ot3"/>
                    </af:column>
                </af:table>





• I have added a form and button in page to add new records in table , see the form source code



<af:panelFormLayout id="pfl1">
                    <f:facet name="footer"/>
                    <af:inputText label="Name :" id="it1" binding="#{viewScope.ProgTableBean.nameBind}"/>
                    <af:inputText label="Mobile Number :" id="it2" binding="#{viewScope.ProgTableBean.mobNumBind}"/>
                    <af:inputText label="Salary :" id="it3" binding="#{viewScope.ProgTableBean.salaryBind}">
                        <af:convertNumber/>
                    </af:inputText>
                    <af:button text="Add Record" id="b1" actionListener="#{viewScope.ProgTableBean.addNewRcord}"/>
                </af:panelFormLayout> 


Code in managed bean for button action-

    /**Method to add new record in table
     * @param actionEvent
     */
    public void addNewRcord(ActionEvent actionEvent) {
        //Get all values using compoenet binding as mobNumBind
        if (mobNumBind.getValue() != null && nameBind.getValue() != null &&
            salaryBind.getValue() !=
            null) {
            // Add new Record in List
            personList.add(new PersonBean(nameBind.getValue().toString(), mobNumBind.getValue().toString(),
                                          Integer.parseInt(salaryBind.getValue().toString())));
        }
    }



• Run the application and test it

Programmatically showing the Popup in ADF

Programmatically showing the Popup in ADF 

You have to display the popup on click of some button. Drag drop the af:popup in the page and bind the popup in the managed bean like screenshot

On the button , write a method on the action event.

public void ShowPopup(ActionEvent actionEvent) {           RichPopup.PopupHints hints = new RichPopup.PopupHints();           this.getPopUp().show(hints);  }

If you want to hide the popup..you can write like this

public void HidePopup(ActionEvent actionEvent) {            RichPopup.PopupHints hints = new RichPopup.PopupHints();            this.getPopUp().hide();   }