Software Development

Learning Oracle ADF: Simple JSF data view/entry form


This second post in my Learning Oracle ADF series is a little late because I haven't been able to get my data entry form to work quite right. It works fine as a data navigator form but creating new entries isn't working yet. I'll go ahead and share what I have discovered so far.

Open the application we created last time. There should be two projects in there: the Model (which we worked on last time) and the ViewController. Open the ViewController project to see the folders underneath, and then open the one called WEB-INF. There should be a faces-config.xml file inside.

Double-clicking on that file will open it in the diagram editor. On the right of the editor you should see the Components palette.

faces-config.xml

If it's not already the default, click the drop-down at the top of the Components palette and select the JSF Navigation Diagram. The palette will now show a number of JSF options. Drag the one called JSF Page onto the diagram editor. It will add a page icon onto the empty faces-config.xml diagram. Rename the icon /index.jsp. Double-click on the newly created icon to launch the Create JSF JSP wizard.

Step 1 of the wizard is where you decide if this is a JSP or a JSPX page. I'm old school -- I don't know much about this fancy JSF technology, so I tend to prefer the older JSP because I'm more comfortable with it right now. (From what I've read, it seems that JSPX would be better overall, so I'll probably try that in future projects.)

Click Next a couple of times to skip to the third screen in the wizard. This is where you pick which tag libraries will be visible in your JSP. I'm not sure what all of these various tag libs do, but I prefer to have too much stuff rather than too little -- it makes things easier in the future. So I just moved everything over from the Available Libraries list to the Selected Libraries list.

Click Next to see the fourth and final screen of this wizard. This is where you can pick the basic HTML attributes for your page -- HTML version, page title, etc. Fill in whatever fits your standards and click Finish.

You'll see in the ViewController project your new index.jsp, and the main edit window should also have that file open in Design mode. The Components palette (in the right-hand column of the screen) was hidden by the Data Control palette that opened when you created this new JSP. This palette shows you the available views you created earlier, which in my case is just the one called ConferenceLineView1.

I understand why JDeveloper did this -- you can drag the views onto the Diagram editor to begin wiring up your UI; however, you probably want to do a little page layout work first. I found it annoying that this new palette popped up because you have to click the Components tab to get back to the Components palette.

Take a look at the Structure window in the lower left-hand corner of the JDeveloper window. You'll see that your new index.jsp page has an h:form already inserted for you. This is where you will want to place most of your components. Go to the Components palette and select ADF Faces Core (if it's not already selected). Scroll until you see the panelHeader, grab it with your mouse, and drag over to the Diagram editor where your index.jsp is. Watch the Structure window to make sure that your panel gets dropped inside the form control; an alternative is to drag it into the Structure window. (Sometimes I find it easier to move components using that tree view instead of the Diagram editor.)

Now you want the Data Control palette that is behind the Components palette. Drag your View over to the index.jsp page. Rather than create a new object on the page immediately, JDeveloper will pop up a hierarchical menu. Select the Create : Forms : ADF Form menu item. You'll now get the Edit Form Fields dialog box. Select the Include Navigation Controls and Include Submit Button check boxes as shown in this screenshot:

Edit Form Fields

You'll notice that it inserts your form, but it also puts a little af:messages tag at the top of the page. I like my messages after the form header, so I dragged the message box down into the form panel. Depending on your mouse dexterity, you may find it easier to do this from the Structure window instead of the Diagram editor.

index.jsp with almost-complete form

You can run it in the embedded OC4J (Oracle Container for Java) that comes with JDeveloper. Click the green Run icon in the icon bar (it should be in the middle of the icon bar -- it's a big green arrowhead).

You can browse through the existing entries in your table using the navigation buttons, but if you attempt to edit an entry and click Submit, the database is not updated. This is the part I haven't figured out -- my Submit button isn't bound somehow, and it's not actually submitting into the database.

I even tried adding a Create button (dragging the Create action from the Data Control palette onto my form) but that also isn't working -- anything I create in the form doesn't get entered into the database.

Testing the form in a Java container

It's very frustrating because I appear to be so close. I'm able to view the database with my new JSF form just fine, but I'm not yet able to get data inserted or modified. I'm going to keep plugging away and re-reading all of the instructions I have. I must have missed some key part of the puzzle -- it's just not obvious from the GUI what part it was.

7 comments
malachie
malachie

I don't see my components ADF in my JSPX page when I drag end drop them. I have to run my page to se its contents... Can somebody help me please. Thks, D.

Justin James
Justin James

For whatever reason, this looks much, much easier in Visual Studio than here, but I may be missing something. If you have used Visual Studio, how would you say it stacks up against JDeveloper for this task? J.Ja

RexWorld
RexWorld

Okay I found the problem with my form. Turns out dragging over the Submit and Create isn't enough. Those actions create and submit into the model but not into the database. There's a separate Commit action you can drag over, it adds a Commit button onto your form. That will save data into the database. This seems kinda confusing to me. Personally I think a Submit is an implicit commit, at least from the user's standpoint. If a user clicks Submit they know full well they are submitting a change to the data. But I guess in keeping with the nature of a database it does make some sense to have a separate Commit button. There's probably some way to wire up the Commit action to the Submit button, so that it can appear as one action to the user.

RexWorld
RexWorld

Unfortunately my most recent Visual Studio experience was probably with version 6. Which tells you how long ago my last real Windows programming was :-) I think though that in general working with Java seems more complicated. I look at all the XML and Java files these wizards created, and I know I could never have written all this junk by hand. The wizards are good but clearly the underlying technology is very complicated.

gevatron
gevatron

Right, you need a commit operation (this is very powerful cause it means you can have DB transactions that can span multiple Web pages, and it will only commit once you actually invoke the commit operation). If you want your submit button to be doing the commit job - just drag the commit operation onto the Submit button and choose "Bind to exsitng ...". One more thing you might want to do then is to set the disabled property of the button to false.

Justin James
Justin James

When you work with WinForms apps, Visual Studio creates all of the initial form stuff that looks pretty complicated too, but for Web apps, all it does is make a basic web.config upfront. You are right about Java though. What makes me laugh about it is that one of the selling points of XML over binary formats is that it is human readable, but Java uses this rat's nest of XML config files that only a tool can understand. The real issue with those config files is that Java is not unified. Instead of being a single framework like .Net, it is a hodge-podge collection of pieces, often from different sources. As a result, the config files get messy. :) J.Ja

RexWorld
RexWorld

Ah, that makes sense. Thanks.

Editor's Picks