Friday 22 November 2013

DataTable Row Selection: Update other parts of the page when a DataTable Row is selected - PrimeFaces 4.0

Before you start on anything, make sure you are using PrimeFaces 4.0. or higher, otherwise RowSelecction is a mystery, you can see here.

If you are reading this post, you are probably having a dataTable that does Row selection either using checkbox, Radio button or non of these but selectable, but if you just want to know how to achieve Row selection, then click here. You wish to display something on the same page based on the selected row, you have tried but it seems not to work. It seems to work for a dialog but not for other sections of the page that are not in the dialog. I suffered for about three days trying out different things, but on the 4th day I got it right. So here it is....

When you have a dataTable with row selection, there are 3 scenarios;
  1. You have checkboxes : multiple Selection
  2. You have Radio Buttons: Single Selection
  3. You neither have Checkboxes nor Radio buttons, but your Rows are selectable. 
 Make sure you are using scenario 3.

If you are using scenario 1 or 2 (If you must have checkboxes, or Radio buttons), refer to this page.

If you want to update another section of the page, there are two scenarios;
  1. The section you wish to update is in the same form with the dataTable and on the same page
  2. The section you wish to update is in another form and on the same page. If you are using this option, you just need to know how to call the id of the component e.g :form:Container:idOfComponent
Any of 1 or 2 is ok. 

<p:dataTable>
      <p:event="rowSelect" update="Id of component you wish to update" listener="a method that you wish to execute when you select a row"
</p:dataTable


If you want a more descriptive example, look at this

The reason why I had to suffer for 3 days was, I didn't know that I had to use scenario 3 for things to work. This was all I had to find out.

Wednesday 23 October 2013

DataTable Row Selection Radio Checkbox Primefaces 4.0


DATATABLE ROW SELECTION RADIO CHECKBOX
Implementing a table that allows row selection either having a column of radio buttons or checkboxes
After good hours of struggle and deep search, I found out that, to use the feature as shown in this url, You must have Primefaces-4.0 or above. I was using primefaces 3.5 I couldn't get it working.

Helpful Threads I visited:
I visited many threads, but finally the 2 below helped me to come to a conclusion that the feature was still a major problem in the lower versions(3.5 and below).

Things that must be done to have this datatable working.
-Make sure your Bean implements selectableDataModel or include the rowKey property in the datatable definition.
-selection - (Getters and setters in the Bean. If selection mode is multiple, set and get and array. If the selection mode is single, set and get the object)
-selectionMode - (multiple/single)
-Include this line as one of your columns <p:column selectionMode="single/multiple but not both" style="width: 4%"/>. This is selection mode for radio or checkbox
-Don't include selectionMode in the Datatable definition (<p:datatable selectionMode=""/>) since this is selection mode for row selection. Reason: Row selection and radio/checkbox selection are not compatible and cannot be both enabled.

Do it like here http://www.primefaces.org/showcase/ui/datatableRowSelectionRadioCheckbox.jsf but make sure to add rowkey in <p:datatable ../>


Only me can access the code. Its in my Dropbox and it's protected.

Saturday 5 October 2013

NetBeans 7.3 Nice Features I discovered

NetBeans is my most treasured Java Environment. Recently, I intergrated Visual Paradigm for UML 10.0 Standard Edition into my NetBeans 7.3 and it was very successfull.You can see how i did it here. A day after, I found out that there are other features that are provided through plugins that I have not used yet they are interesting.

Open NetBeans->Tools->Plugins->Available plugins.

On the list, you will find very many plugins with these inclusive;
  •  NetBeans Status line Memory Usage : Shows u NetBeans memory usage










  • Graphical Class Viewer: Shows you graphical view of the Java class



















  • Visual Mobile Designer. Installed but not tested it yet.
  • Log Management. Installed but not tested it yet
Check and install. Its that easy. I installed all the 4 above, but I have tested the First two. I will check out for more features and update this post. I
If you have used some NetBeans features that have interested you, let us know. 

Friday 4 October 2013

UML Integration in NetBeans 7.3 using Visual Paradigm for UML 10.0 Standard Edition and NetBeans UML Plugin

Question: How can I draw UML diagrams in NetBeans 7.3

Response: I asked my self this same question after my own code had grown huge and had started confusing me. I mean my own written code. It was hard to follow up and to remember the flow and logic I had in mind at the time of writing the code. May be you are in the same prison.
Here is what I did. I already had a UML tool (Visual Paradigm Standard Edition 10) installed on my Computer. I used this tool and I reverse engineered my code into a Class diagram, and Sequence diagram as well. This tool is an award winning and one of the best UML tools you can find. It is actually the best if I may be prompted to say. You can do any UML modeling with this tool. So, with this tool, I could easily  visualize how my code was structured from the generated class diagram, and the flow from the sequence diagram. Well, this worked well but I felt I would be more comfortable if I did all this modeling in my environment (NetBeans 7.3) .

I did some search and this is what I found.
I found that Visual Paradigm being a great tool, It has Integration capabilities with a number of IDEs including NetBeans,Eclipse, VisualStudio and others. The Integration capabilities they provide allow you to do all the UML modeling in your Environment. You can draw Class Diagrams, ERD, Sequence Diagrams, Activitity diagrams, Code Reverse and Foward Engineering and many other things.

For NetBeans,
1. On the NetBeans website, I found NetBeans IDE UML Features. They highly recommend the SDE for NetBeans from Visual Paradigm. 
2. On the Visual paradigm website, I found 4 Quick steps to start UML Modeling in NetBeans
3. There is a NetBeans UML plugin that you can just install in NetBeans.See the NetBeans UML plugin project. See also what NetBeans' say about UML

After perusing  all the three options above, I did some more research and, 
This is how I integrated UML into NetBeans 7.3 and got It working!!
Step 1. I already had NetBeans 7.3 and Visual Paradigm for UML 10.0 Standard Edition already installed on my computer. I went to Tools->IDE Integration->NetBeans Integration (CheckBox)->Next->Next. This  installed UML into my NetBeans 7.3 install location automatically.
After doing this, I opened NetBeans and Created a new Java application and right clicked the application as described here. I did not see Visual paradigm options on the Right menu as expected. So I went to step 2.



Step 2.  I restarted NetBeans. I went to Tools->Plugins->Settings->Add-> type Name(UML), URL( http://dlc.sun.com.edgesuite.net/netbeans/updates/6.9/uc/m1/dev/catalog.xml )->Click Ok. Wait for this update process to finish. This finds the NetBeans UML Plugin. When this is done, go to Tools->Plugins->Available Plugins. You should see "UML" on the list. Check it and click install. When installation is done. Thats all.

 Step 3. To be sure that everything was successful, restart NetBeans -> NewProject. You will see UML on the list. Also, when you create a new Java project and you right click, now the Visual Paradigm menu is there as shown here. Enjoy!!

 I will be glad to hear from you. If you have never tried, try this. If you have tried and have gotten it working, share with us.

Wednesday 2 October 2013

Getting started with primefaces 3.4 in NetBeans 7.3.

Question: How do I get started with PrimeFaces in NetBeans?

Response: First of all, PrimeFaces is a JSF(Java Server Faces) Framework. JSF is a UI framework created to ease User Interface creation in Java Web Application development. There are a number of JSF frameworks e.g PrimeFaces, ICE Faces, Rich Faces, Oracle ADF e.t.c.
We shall Use NetBeans 7.3 to get a hello world application with PrimeFaces 3.4. Note that PrimeFaces 3.4 is already part of NetBeans 7.3. You might only need to download PrimeFaces if you want a different version from that already provided in NetBeans. If you have a higher version of NetBeans, then you might have a higher or similar version of PrimeFaces which is fine.

Requirements: You only need to have NetBeans 7.3  up and running on your computer. 

Step 1: Choose Project. Open netbeans and Go to File->New Project. A New Project window will pop up. Choose Java Web-> WebApplication . If you are running NetBeans for the first time after Installation, you might see some extra step as NetBeans tries to activate the Java  web environment, so don't worry. Click Next.

Step 2: Name and Location. In the ProjectName put PrimeFacesHelloWorld. Click Next. ProjectName is the name of your project, so it can be anything. Location is where it will be stored on your computer, so you can change the location by clicking browse if you want.

Step 3: Server and Settings. On the Server, Choose GlassFish Server 3.1.2., Java EE version is Java EE 6 Web, Optionally tick "Enable Contexts and Dependency Injection". Click Next.  If you are using another version of NetBeans, you  might have a different version of GlassFish. Its fine. You are free to use another Java EE server if you know how to, but since GlassFish  is the default for NetBeans, we use that for this tutorial. For a hello word application like this, Contexts and Dependency Injection (CDI) might not count but later if you are to do a bigger application, you might need it. So, Its no problem if you don't tick it for now. 

Step 4: Frameworks.On Frameworks,  tick Java Server Faces. Below, on Java Server Faces Configuration, select PrimeFaces. If you want to see the version of PrimeFaces you have, Click more. This also helps if you have more than one versions of PrimeFaces installed. NetBeans 7.3 has PrimeFaces 3.4 already installed. So, all you have to do is just tick it and your application will automatically be configured to use PrimeFaces. After all this, click Next

Step 5: Run. Right Click PrimeFacesHelloWord(with a blue round Icon) and Click Run. At this point, your application is already created. The application already has 2 Webpages. i.e index.xhtml and welcomePrimefaces.xhtml. If you notice under libraries, you can see primeFaces 3.4.jar. You can also right click index.xhtml and Run.

Step 6: You have arunning application in the browser. The Index page has a link(PrimeFaces  welcome Page ). Click this link and you will see a PrimeFaces page.

This note is optional. You don't have to read it to get the application to run but the information might be helpful.

If you want to use another version of PrimeFaces say PrimeFaces 3.5, just download the jar and after creating the Java web Project with JSF activated, right click libraries and add the Jar. 
Or Go to Tools-> Ant Libraries->New Library ->Library Name(The name for the library you are adding-your own naming)->Add JAR/Folder->Browse for the Jar you downloaded and add it(The jar will be added under the library name you just created). When you add a library here, It will be globally available so whenever you wish to add it in the project, you will always find it on the list of jars(after creating the project right click libraries ->Add library->you will see a list of global libraries and the library you added in ant libraries will be on the list), and also for PrimeFaces You will find it on the List when you are creating a PrimePaces application under more in the NetBeans Wizard.

Note: Images are coming soon. But if you follow well, you can have your helloworld program running. Let me know if you have any issues or any questions or even suppliments. Thanx.



Monday 30 September 2013

How to approach a Java Web application

Java web development has evolved since its birth up to today. Am not going into history but am going to answer this question that might immediately pop in  your mind if  you are considering java for your web applications.

Question:
What is the approach to use in developing Java web applications? (In other words, what do I do and where do I start from if I want to develop a web application in Java?)

Response:
This may sound like a simple and lousy question if you have not ventured into the actual development of web applications in Java, but for those who have tried you probably know what this means.
You have probably heard people saying scattered and non-comprehensible statements regarding how to do web applications in Java. If you are down there in an illusion, or if you have an Idea, lets face it. 

In Java, there are a number of approaches/technologies you can use for a web application. I will leave out a lot of verbose that you might not benefit you if you want to start immediately so, I will go straight to what you need to know.

To develop a good web application in Java,
 One you have to know about MVC (Model View Controller) architecture. There are a lot of materials on this topic to get you started, and am not talking about any technology in detail here. I strongly suggest that you first get some understanding of MVC because later, everything in Java web application development built around it.

Two, Choose a framework and learn how to use it. There are a number of frameworks built to  simplify MVC and make development easier e.g Spring MVC, Struts 2, JSF. e.t.c So, look out for a Java  web application framework and this will help you not to re-invent the wheel as you do your development. I immediately advise that you learn JSF(Java Server Faces) since it holds all the future for Java web applications. JSF alone is very wide and has a huge learning curve so I suggest you look out for a framework built on top of JSF, which is what most developers do anyway. So, get some few tips and some understanding on JSF and Learn a JSF Framework instead. There are very many JSF Frameworks but the most common ones are PrimeFaces, IceFaces, RichFaces, Oracle ADF. Each of these is very good in its own way but your choice might depend on a number of factors. I have used Oracle ADF but I now use PrimeFaces. If you want a clean comparison that will help you to make your own choice, see here.  

Three, you need to know JPA (Java persistence) and EJB(Enterprise Java Beans). To bring the whole picture very clearly, JSF (Using your chosen JSF Framework e.g Primefaces) will be your provider for the Views, JPA for the Models, and EJBs for the Controller and Logic. This makes MVC but with the combination of best practices.

Four, choose the right IDE(Intergrated Development Environment). Some IDEs can really complicate things for no good reason. I have met people who have lived in fear for Java web development just because they started off with IDEs that made everything seem so complicated and abstract. I suggest you use NetBeans as your IDE. A simple JSF application using NetBeans might help you understand. An IDE is purely a personal choice to make but NetBeans is free, reliable, professional, easy and straight forward;  the fact the Oracle company which owns Java also owns the tool, you can smell a bright future in this regard. A minute, if you intend to use Oracle ADF as your JSF Framework, strictly JDeveloper is the IDE. If you can't wait to develop a JSF application in NetBeans, start right away started using this tutorial

Some one is grumbling that I didn't talk about JSP(Java Server Pages) , Servlets or JDBC.  Well, we can't hide away from the fact that some frameworks like Struts 2  and others you may know have been widely used, but lets also come to the fact that despite their success there is transformation going on right now. So, It's a personal choice to transform with others or keep in the past. As for me, I will focus on what the future holds for Java web and Enterprise applications which is what I have talked about above. Don't forget that, If you Invest in best practices, you will always spend less time to produce very good work , but if you do the other way round, you will always spend ages to produce even the simplest thing. If you bet, try it.

Let me know what you think. Your opinion is highly appreciated.

Using selectOneMenu in Primefaces

Question:
I had two tables. Staff and Department. Staff is related to Department by manyToOne respectively. On the Staff form, I have a dropdown(selectOneMenu) which has all the departments. For each shown department I want to get the primary key which I can Insert into the Staff table as the foreign key.
So I had two things to cater for here. First, displaying the list of Departments in the drop down, Second, Obtaining the primary key of the selected department for the purposes of Staff-department Forein key.

Response.
After days of hutsle in trying to use selectOneMenu, today i finally get it. I tried a number of things but this is what finally worked.



The first argument will be the value, and the second will be the displayed label
 Step 1: selectOneMenu in primeFaces page.
<p:selectOneMenu value="#{staffBacking.deptId}">
       <f:selectItem itemValue="#{null}" itemLabel="Select">
        <f:selectItems value="#{staffBacking.selectItems}" >
</p:selectOneMenu>

Step 2: The backing bean for the page contained this method
//Static data
public List<SelectItem> getSelectItems() {
        selectItems.add(new SelectItem(1, "Development"));
        selectItems.add(new SelectItem(2, "Administrative"));
        return selectItems;
    }

//data From database
public List<SelectItem> getSelectItems() {
        for(int i = 0; i < getDf().findAll().size(); i++){
            selectItems.add(new SelectItem(getDf().findAll().get(i).getDeptId(), getDf().findAll().get(i).getDeptName()));
        }
        return selectItems;
    }


The was also a setter and a getter for deptId i.e. getDeptId(), setDeptId(String departmentId). This will hold the value from the value attribute of selectOneMenu

Step 3:  Set the department id value to the current object of Department and then add the staff. Below is the method that persists the staff.

public void addStaff(){
        getDept().setDeptId(Integer.parseInt(getDeptname()));
        getStaff().setDepartmentdeptId(dept);
        getSf().create(staff);
    }