You can download the sample application from here
The sample portlet has two things first, when you click on the Print Preferences button it will get all the preferences for the user and list them in the Grid. You can add new preference by entering value of preference Name and value and then clicking on the Add preference button.
In this sample application i am using the Client Side API for Preference Management and the JavaScript to Flex communication for getting as well as setting preferences.
I followed these steps to create the sample application
- First i did develop a FlexPortletPreferences portlet like this
public class FlexPortletPreferences extends GenericPortlet{
protected void doView(RenderRequest request, RenderResponse response)
throws PortletException, IOException {
System.out.println("Entering FlexPortletPreferences.doView()");
response.setContentType("text/html");
getPortletContext().getRequestDispatcher("/preference.jsp").include(request, response);
System.out.println("Exiting FlexPortletPreferences.doView()");
}
}
This portlet is very simple only thing that it does is pass control to the preference.jsp in the doView() method - Then i did develop preference.jsp file like this
<%@page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1" session="false"%>
<%@taglib uri="http://java.sun.com/portlet" prefix="portlet"%>
<%@taglib
uri="http://www.ibm.com/xmlns/prod/websphere/portal/v6.1/portlet-client-model"
prefix="portlet-client-model"%>
<%@taglib uri="http://java.sun.com/portlet" prefix="portletx"%>
<portlet-client-model:init>
<portlet-client-model:require module="ibm.portal.xml.*" />
<portlet-client-model:require module="ibm.portal.portlet.*" />
</portlet-client-model:init>
<script language="javascript">
function printPreferences(){
var _portletWindow = new ibm.portal.portlet.PortletWindow("<%=portletWindowID%>");
_portletWindow.getPortletPreferences(printPreferencesCallback);
}
function printPreferencesCallback(portletWindow, status, portletPrefs){
if (status==ibm.portal.portlet.PortletWindow.STATUS_OK) {
var prefs = portletPrefs.getMap();
var prefList = new Array();
for (var i=0; i<prefs.length; i++) {
console.log(prefs[i].name);
console.log(prefs[i].values[0]);
prefList[i] = {"name":prefs[i].name,"values":prefs[i].values[0]};
}
getFlexApp('PortletPreferenceFlex').displayPreferences(prefList);
}else{
console.error("Error in getting preferences");
}
}
function getFlexApp(appName){
if (navigator.appName.indexOf ("Microsoft") !=-1){
return window[appName];
}
else{
return document[appName];
}
}
function loadPreferences(portletWindow, status, portletPrefs){
console.log("Entering loadPreferences()");
if (status==ibm.portal.portlet.PortletWindow.STATUS_OK) {
var preferenceName = portletWindow.getAttribute("preferenceName");
var preferenceValue = portletWindow.getAttribute("preferenceValue");
portletPrefs.setValue(preferenceName,preferenceValue);
portletWindow.setPortletPreferences(portletPrefs,printPreferencesCallback);
}else{
alert("Error in loading preference");
}
console.log("Entering loadPreferences()");
}
function addPreferences(prefName, prefValue){
console.log("Entering changePreference()");
console.log("Preference Name " + prefName);
console.log("Preference Value " + prefValue);
var _portletWindow = new ibm.portal.portlet.PortletWindow("<%=portletWindowID%>");
_portletWindow.setAttribute("preferenceName",prefName );
_portletWindow.setAttribute("preferenceValue",prefValue );
_portletWindow.getPortletPreferences(loadPreferences);
console.log("Exiting changePreference()");
return false;
}
</script>
<portlet:defineObjects />
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
id="PortletPreferenceFlex" width="750" height="500"
codebase="http://fpdownload.macromedia.com/get/flashplayer/current/swflash.cab">
<param name="movie" value='<%=renderResponse.encodeURL(renderRequest.getContextPath()+ "/PortletPreferenceFlex.swf")%>' />
<embed src="<%=renderResponse.encodeURL(renderRequest.getContextPath() + "/PortletPreferenceFlex.swf")%>"
width="750" height="500"
name="PortletPreferenceFlex" align="middle" play="true" loop="false" quality="high"
type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/go/getflashplayer">
</embed>
</object>
Most of the JavaScript code in this file is same as Client Side User Preferences Manipulation with the difference that it hasgetFlexApp
method which gives me the object of flex application. Inside theprintPreferencesCallback
method, first i am getting object of Flex application and then calling itsdisplayPreferences()
method with Array of the preferences. ThedisplayPreferences()
method is implemented in the flex application - Last and most important piece of the demo application is the PortletPreferenceFlex.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
width="100%" height="100%" initialize="initApp()">
<mx:Script>
<![CDATA[
import flash.external.*;
import mx.controls.Alert;
public function initApp():void
{
if (ExternalInterface.available){
ExternalInterface.addCallback("displayPreferences", displayPreferences);
}
}
//Event handler for handling button click
public function getPortletPreference():void
{
if (ExternalInterface.available) {
// Make call to the printPreference method
ExternalInterface.call("printPreferences");
} else
Alert.show("Error sending data!");
}
public function displayPreferences(obj:Object):void
{
dgPreferences.dataProvider = obj;
}
protected function prefValue_clickHandler():void
{
if (ExternalInterface.available) {
// Make call to the printPreference method
ExternalInterface.call("addPreferences",prefName.text,prefValue.text);
}
}
]]>
</mx:Script>
<mx:Panel id="pnlMain" width="600" height="324" layout="absolute" title="Portlet Preferences Example">
<mx:Button label="Print Preference" y= "37" id="resourceUrl" click="getPortletPreference()" x="482"/>
<mx:DataGrid id="dgPreferences" x="10" y="10" width="464" height="100">
<mx:columns>
<mx:DataGridColumn headerText="Name" dataField="name"/>
<mx:DataGridColumn headerText="Values" dataField="values"/>
</mx:columns>
</mx:DataGrid>
<mx:Button x="321" y="123" label="Add Preference" click="prefValue_clickHandler()"/>
<mx:Label x="13" y="150" text="Preference Value"/>
<mx:TextInput x="121" y="121" id="prefName"/>
<mx:Label text="Preference Name" x="10" y="121"/>
<mx:TextInput x="120" y="148" id="prefValue"/>
</mx:Panel>
</mx:Application>
When user clicks on the Print Preferences button the control get passed togetPortletPreference
method inside this method i am usingExternalInterface
to calldisplayPreferences
method which is JavaScript method inside preference.jsp.
ThedisplayPreferences
makes call to_portletWindow.getPortletPreferences
attachingprintPreferencesCallback
as callback. Inside that method first i am getting the preferences then converting them into Array and then passing that Array to thedisplayPreferences
method which is part of PortletPreferenceFlex.mxml, which is using that array as data source for the Grid.
Same thing happens when you click on Add Preference button control gets passed toprefValue_clickHandler
method which in turn is passing control to theaddPreferences
method for actual adding of the preferences
2 comments:
vEgmedi.com is online medical store pharmacy in laxmi nagar Delhi. You can Order prescription/OTC medicines online.
Cash on Delivery available. Free Home Delivery
Online Pharmacy in Delhi
Buy Online medicine in Delhi
Online Pharmacy in laxmi nagar
Buy Online medicine in laxmi nagar
Onine Medical Store in Delhi
Online Medical store in laxmi nagar
Online medicine store in delhi
online medicine store in laxmi nagar
Purchase Medicine Online
Online Pharmacy India
Online Medical Store
Thanks for info....
SEO Company in Bangalore
Post a Comment