Ashish Awasthi's Blog

Saturday 1 June 2013

Using JQuery in Oracle ADF

JQuery is advance javascript library to support client side scripting of HTML, it is free and Opensource software licensed under MIT.
Jquery is designed to make it easier to create animations, enhance look feel of component, smooth navigation.
Read about Jquery- http://jquery.com/ , https://jquery.org/
here i am showing you, how to add Jquery in oracle ADF application.

First add Jquery library to your fusion web application, download library file Download
Add this file to javascript resources, see image
Now create a javascript(Jquery) file to change color of af:inputText, here is javascript code is given

function changeColor() {
    if ($("input[name=it1]").val() != null) {
       if (($("input[name=it1]").val().length > 0) && ($("input[name=it1]").val().length < 3)) {
            $("input[name=it1]").css("color", "magenta");
        }
      else if (($("input[name=it1]").val().length > 3) && ($("input[name=it1]").val().length < 6)) {
            $("input[name=it1]").css("color", "red");
        }
        else if (($("input[name=it1]").val().length >= 6) && ($("input[name=it1]").val().length < 9)) {
            $("input[name=it1]").css("color", "yellow");
        }
         else if (($("input[name=it1]").val().length >= 9) && ($("input[name=it1]").val().length < 12)) {
            $("input[name=it1]").css("color", "maroon");
        }
         else if (($("input[name=it1]").val().length >= 12) && ($("input[name=it1]").val().length < 15)) {
            $("input[name=it1]").css("color", "teal");
        }
         else if (($("input[name=it1]").val().length >= 15) && ($("input[name=it1]").val().length < 18)) {
            $("input[name=it1]").css("color", "blue");
        }
        else {
            $("input[name=it1]").css("color", "green");
        }
    }
}

Now create a jspx page , and call this JS file as a resource in jspx page, and also add Jquery Lib to jspx page as Resource
Now add a input text in page, and call javascript resource using af:clientListener

See the code of jspx page-

<?xml version='1.0' encoding='UTF-8'?>
<jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.1" xmlns:f="http://java.sun.com/jsf/core"
          xmlns:af="http://xmlns.oracle.com/adf/faces/rich">
    <jsp:directive.page contentType="text/html;charset=UTF-8"/>
    <f:view>
        <af:document title="JqueryADF.jspx" id="d1">
         <af:resource type="javascript" source="/javascript/libs/jquery-1.4.4.js"/>
         <af:resource type="javascript" source="/resources/js/inputText.js"/>
            <af:form id="f1">
            <af:inputText label="Chck JQ" id="it1" contentStyle="font-weight:bold;">
                        <af:clientListener type="keyDown" method="changeColor"/>
                    </af:inputText>
            
            </af:form>
        </af:document>
    </f:view>
</jsp:root>

Now Run this application and enter value in input text field and see how color is changing with length
You can use this , with your password field, for any kind of alert, to make 'Find and Enter' games
One more thing , it is difficult to use Jquery with pagefragments because in page fragments component id's are like :t1:cb1, r1:t1:it2. and jquery does not support ':' so you can easily use this with .jspx page
Sample ADF application -Download

Thursday 30 May 2013

Add Custom Flash Chat in Oracle ADF Application

In this tutorial i am going to show that how can you add a custom flash chat in your ADF application, and use it to chat with friends.
this is very much simple, as no code required to do this.

Go to http://www.everywherechat.com/ , this site provides free custom flash chat rooms, get html code of your custom chat from here
Create an html page using that code

<html>
<body>
<!-- Begin Everywherechat Room Code -->
    
      <br />
     <script src="http://www.everywherechat.com/e.php?defaultRoom=Lobby&roomList=true&fontSize=12&width=600&height=500&theme=night"></script> 

<!-- End Everywherechat Room Code --> 
</body>
</html>

Now create a Fusion Web Application and create a page in it, call this HTML page in an inlineFrame (af:inlineFrame)

<?xml version='1.0' encoding='UTF-8'?>
<jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.1" xmlns:af="http://xmlns.oracle.com/adf/faces/rich">
  <af:panelGroupLayout id="pgl1">
    <af:inlineFrame id="if1" source="/chat.html" inlineStyle="height:700px;width:700px;"/>
  </af:panelGroupLayout>
</jsp:root>

Now Run your application and see your flash chat room is ready - Happy Coding

Download Sample Application-Sample ADF Application

Tuesday 21 May 2013

Generate Barcode Image in Oracle ADF using OnBarcode API

In this tutorial we will learn how to generate Barcode Image for any Number(Barcode) in ADF using OnBarcode API, this API provides barcode SDK(Software Development Kit) to generate Barcode. This is paid.
You can get it from http://www.onbarcode.com/ , click on Download to get barcode SDK.

Now create a fusion web application and add barcode.jar to project libraries, you will get this JAR , when you download SDK
Good thing about this API is that it is very simple to use, not much code required to generate a simple barcode image
You can generate multiple type of Barcode as Code 39, Code 128, EAN-8, EAN-13, UPC-A, UPC-E
Suppose i have to generate a Code128 type of Barcode for any barcode number, so for this write this simple code and you are done

Code128 barcode = new Code128();

barcode.setData("122322311");
barcode.drawBarcode();

Download sample application that integrates this API with Oracle ADF Download Sample ADF Application
Unzip and Run this application
I have used a servlet in order to show image on page fragment

Monday 20 May 2013

Set and Get Value from Taskflow parameter (pageFlowScope variable) from Managed Bean- ADF

Hello All

This post is about getting and setting value in taskFlow parameter using Java Code so for that we have created a application with bounded taskFlow

Let's see how to do this -

We have bounded taskflow having Input Parameter defined in it named GLBL_PARAM_TEST

and we have to set its value from managed bean.
this is very simple -see how to do that

Get pageFlowScope Map and put parameter 's value in it

        Map paramMap = RequestContext.getCurrentInstance().getPageFlowScope();
        paramMap.put("GLBL_PARAM_TEST", "Ashish");

And get Value from taskFlow parameter in managed bean

    public String resolvEl(String data){
               FacesContext fc = FacesContext.getCurrentInstance();
               Application app = fc.getApplication();
               ExpressionFactory elFactory = app.getExpressionFactory();
               ELContext elContext = fc.getELContext();
               ValueExpression valueExp = elFactory.createValueExpression(elContext, data, Object.class);
               String Message=valueExp.getValue(elContext).toString();
               return Message;
             }


String param=resolvEl("#{pageFlowScope.GLBL_PARAM_TEST}");

Wednesday 15 May 2013

Beauty of ADF- Taskflow, Difference b/w Facelets and JSP XML fragments in bounded taskflow

Oracle ADF framework support modular architecture for enterprize application development. Multiple small module can be bound together to form a large module .
The greatest advantage of ADF controller over core JSF navigation model is that it splits a single bulky module to multiple reusable and interconnected modules known as Taskflows.

i am not going deeper in Taskflows as every ADF developer know about it ,so the important part is page fragment.

When we create taskflow as bounded taskflow , and check it to create fragment in taskflow.

Now when we create pagefragment in bounded taskflow, there is 2 option for creating fragment

Create fragment as Facelets
Create fragment as JSP XML

Facelets- is default and official view handler for JSF pages, priviously JSP was used to view JSF pages but it didn't support all component so Facelets comes in picture under APACHE open source license. It supprts all UI component used by JSF (Java Server Faces).
Facelets was developed by Jacob Hookom in 2005.
If you create Facelets fragment in bounded taskflow, then taskflow must be dropped in a JSF page (parent page) not in .jspx (JSP XML ) page.
if you try to drop it into JSP XML page-

JSP XML- jspx is XML variant of JSP(Java Server Pages) to support XML document . JSP XML fragments are used in ADF inorder to support XML document and more powerful page validation techniques.
If you create jsp xml fragments in bounded taskflow, then taskflow must be dropped in a JSP XML(.jspx) page(parent page) not in JSF page.

Subscribe to: Posts ( Atom )

Search this blog