Wed. Aug 4th, 2021

Requirement: I have an af:inputText component. Now when the user double-click on the af:inputText component it will set some properties like value, contentStyle for the af:inputText.

Solution: For the solution of the above requirement follow the steps as shown below:

Step 1: Create an Oracle ADF Fusion Web Application.

Step 2: Drag and drop af:inputText and set label=”Name”

Drag and drop af:resource and set type=”javascript”. The af:resource will be inside af:document

Write the below JavaScript function inside the af:resource

function setInputTextProperties(event) {
	var inputText = AdfPage.PAGE.findComponent('it1');
	inputText.setProperty("value", "Susanto Paul");
	inputText.setProperty("contentStyle", "background-color:aqua;font-weight:bold;");
}

Drag and drop af:clientListener inside af:inputText and set method=”setInputTextProperties” and type=”dblClick”

Thus, the complete code for demo.jspx page is shown below:

<?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="demo.jspx" id="d1">
            <af:resource type="javascript">
              function setInputTextProperties(event) {
                  var inputText = AdfPage.PAGE.findComponent('it1');
                  inputText.setProperty("value", "Susanto Paul");
                  inputText.setProperty("contentStyle", "background-color:aqua;font-weight:bold;");
              }
            </af:resource>
            <af:form id="f1">
                <af:inputText label="Name" id="it1">
                    <af:clientListener method="setInputTextProperties" type="dblClick"/>
                </af:inputText>
            </af:form>
        </af:document>
    </f:view>
</jsp:root>

Save and run the application. Thus, the ran application is shown below:

In the above af:inputText component as soon as we double click on the component it will set the properties like the value, contentStyle for the  af:inputText component, as shown below.

Hence, the solution to our requirement.

If you like the post please comment, share, and do join me on Facebook. Please subscribe to my YouTube Channel for video tutorials.

Thanks & Regards,
Susanto Paul

 224 total views,  1 views today

By Susanto Paul

Susanto is an Oracle ACE, a qualified MCA, MBA, and a highly-skilled Senior Oracle Specialist. He is an enthusiastic Blogger and YouTuber who helps learners to solve their complex problems more efficiently. He has 9+ years of experience in multiple technologies like AWS, Oracle ADF, Oracle APEX, Oracle JET, Oracle VBCS, Oracle IDCS, Oracle PL/SQL, Oracle Integration Cloud, Java, JDBC, Servlets, JSP, Spring, Hibernate, HTML5, CSS3, JavaScript, TypeScript, NodesJS, Angular, MySQL, Oracle WebLogic Server, JUnit, JMeter, Selenium Web Driver, etc. He is a certified: Oracle Certified Professional Java SE 6 Programmer, Oracle ADF 11g Certified Implementation Specialist, Oracle Cloud Platform Application Integration 2020 Certified Specialist, Oracle Cloud Infrastructure Foundations 2020 Certified Associate, and Oracle Cloud Infrastructure Developer 2020 Certified Associate

Leave a Reply

Your email address will not be published. Required fields are marked *