Carl Backstrom's Blog

As promised I've put up the export of my demo application from Oracle World , for people who were at ODTUG in New Orleans it's pretty much the same application I showed there.

Thanks, for everybody who showed up I had a great time and hopefully was able to give people some ideas. I'll see what the rules are for me putting my slides on slideshare or something like that , but at some point Oracle will putting up the slides and a recording of the session.

Download the Application

Edit

The application will only work in Firefox, but that is only because it was built specifically to show Firebug features.

If you remove anything that says console.log or console.dir it will work in other browsers.

Regards,
Carl

One problem with APEX is it has issues with dealing with text values of greater than 32k, while there is a fairly simple workaround it does have quite a few pieces and there has to be an easier way to do it.

Well in APEX 3.1 there is now an integrated javascript call to take care of this. This example also shows some of our new namespaced javascript objects and functions.

I've created a working example here.

Setting the CLOB
<br />function clob_set(){<br /> var clob_ob = new apex.ajax.clob(<br /> function(){<br /> var rs = p.readyState<br /> if(rs == 1||rs == 2||rs == 3){<br /> $x_Show('AjaxLoading');<br /> }else if(rs == 4){<br /> $s('P159_DROP',p.responseText);<br /> $x_Hide('AjaxLoading');<br /> }else{return false;}<br /> }<br /> );<br /><br /> if(!$v_IsEmpty('P159_CLOB')){clob_ob._set($v('P159_CLOB'))};<br />}<br />

What's happening in the previous piece of javascript is I'm creating a apex.ajax.clob object. This object only takes one parameter when being initialized which is a function , or pointer to a function, to call when the XMLHTTP object's readyState changes. In that return function ,and for all built in APEX asynchronous AJAX calls, p is the XMLHTTP object.

Once the apex.ajax.clob object is created you just call set method giving it a string ._set(String Value);

It will automatically create a collection in your session CLOB_CONTENT and populate the CLOB001 column.

You can then use that in a page or application level process , usually by calling a doSubmit() and submitting the page.

The p.responseText on successful population of the CLOB will be SUCCESS.

Getting the CLOB
<br />function clob_get(){<br /> var clob_ob = new apex.ajax.clob(<br /> function(){<br /> var rs = p.readyState<br /> if(rs == 1||rs == 2||rs == 3){<br /> $x_Show('AjaxLoading');<br /> }else if(rs == 4){<br /> $s('P159_DROP',p.responseText);<br /> $x_Hide('AjaxLoading');<br /> }else{return false;}<br /> }<br /> );<br /> clob_ob._get();<br />}<br />

Getting a CLOB is much the same as setting one. Create the apex.ajax.clob object setting the function to call when p.readyState and then call the ._get() method which doesn't take any parameters.

This solution only deals with one clob at a time and the clob is alway put into the CLOB_CONTENT collection, though dealing with multiple clobs is also much easier, more on that later ;). But it is much easier to work with than the old workaround.

I just watched 2001: A Space Odyssey in the last week in HD. If you've never seen or it's been awhile or never seen it in HD do yourself a favor and check it out it's an amazing movie, though it looks like they were a little off on the dates.

So I mentioned in my last post one of my favorite new features in Application Express 3.1 was being able to pass temporary values to OnDemand process, and I showed an example using x01.

Of course passing one value is useful but not as useful as passing 10-13 of them so lets meet the rest.

• x01-x10
• g_widget_mod
• g_widget_action
• g_widget_action_mod

So I'm going through my example application updating different examples new APEX 3.1 features, as I work through them I'll be posting examples of changes.

So the first one are the changes to the basic example for illustrating Ajax using an OnDemand Process.

Javascript
<br /><script type="text/javascript"><br />function f_TestOnDemand(){<br /> var get = new htmldb_Get(null,$v('pFlowId'),'APPLICATION_PROCESS=SimpleExample',0);<br /> get.addParam('x01',$v('P11_TEST'));<br /> gReturn = get.get();<br /> get = null;<br /> gReturn = (!gReturn)?'null':gReturn;<br /> $s('P11_TEXT_DROP',gReturn);<br />}<br /></script><br />

One of the biggest changes , and one of my favorites , is that in older versions of APEX to pass a value to on OnDemand Process in most cases you would need a application level item that was only used for that purpose , this is no longer needed.

This new functionality is illustrated on line 4 where the global variables x01 gets the value of the textarea to post to the process. There are 10 global variables x01 - x10 , and a few others, so you can pass around quite a few values at once, more in later post.

There are a couple calls to $v('ITEM_NAME') which given an item name returns you the value of the given item.

And $s('ITEM_NAME','Some Value') which given an item name and a value set the value of that item.
* These both work with most the basic item types and will be extended support all item types.

OnDemand Process (SimpleExample)
<br />declare<br /> l_value varchar2(4000);<br />begin<br /> l_value := wwv_flow.g_x01;<br /> htp.p('<packet>');<br /> htp.p('<desc>This was just put into one of the global temporary values.</desc>');<br /> htp.p('<payload id="test">'||l_value||'</payload>');<br /> htp.p('</packet>');<br />end;<br />

On line 4 of the OnDemand Process is take getting the value of the global variable. The global variables are only available for that Ajax call and do not get saved into session state.

Simple changes to be sure but they allow for much more generic javascript and easier integration across different application's

While APEX ships with some built in javascript functionality, and very nice javascript functionality if I say so myself ;). We are definitely not everything to everybody, which is on purpose.

There are so many very good 3rd javascript libraries , and we love our 3rd party javascript libraries , out there (extjs , YUI , DOJO and many more) that we don't want to be making that choice for developers since the proper choice can be different all the way from the image directory level to the workspace , application and even page by page level.

In fact sometimes I feel bad , well not that bad ;), for forcing even our library on developers. In 3.1 our library can be turned on and off on a page by page basis.

But I digress, if you have filesystem access integrating in a 3rd party library is as easy as any other web page you just include in your path.

But if you are in a hosted environment, you need to pick a library or build of a library that is all in one file.

jQuery is a good example of a 1 file library that can be easily integrated into APEX using #WORKSPACE_IMAGES# or #APP_IMAGES# . And I've created a very simple example here to show that it works , http://apex.oracle.com/pls/otn/f?p=11933:151

I'm going to be looking into different ways of including in other libraries that require a directory structure when you don't have file system access, I think XDB might be helpful here, but if someone has already solved this particular problem please comment or blog about it as it will be very helpful to quite a few people.

Wow a real APEX posting can you believe it?


So I got an email from Alistair Laing asking about a certain example of mine , (AJAX) Report Pull.


He rightfully pointed out that if you used one the AJAX enabled report templates the AJAX pagination worked but the sorting wouldn't work, sometimes.

The reason for this is that the AJAX templates are a HACK! That's right I said it ,I can because I built them, sure they are a successful , well used, robust HACK but a HACK none the less.


The issue with the sorting not working is because the header links are rewritten when the page loads so that the headers no longer have normal links but have AJAX enabled links. The pagination doesn't have this issue because the AJAX code is hardcoded in and to make matters worse if you paginate first then the sorting does get rewritten to be AJAX, I told you it was a HACK.

But have no fear with just a little bit more effort you can make it sorting work as it should , Ajax Region Pull & Pagination

There are a few differences between the first example and the second example.

The main part being the javascript code on the pulling page (149)
<br /><script type="text/javascript"><br />function dhtml_GetReport(pThis){<br /> var l_Val = html_SelectValue(pThis);<br /> /*<br /> Request value of the AJAX request is being set to RP so that and a process on the page has 150 has been enabled to Reset Pagination if the Request Value is RP<br /> */<br /> var get = new htmldb_Get(null,$x('pFlowId').value,'RP',150);<br /> get.add('P150_DEPT',l_Val);<br /> /*<br /> The clip values have been changed to make sure that the only thing that is inserted into page 149 is the report code an nothing else this to make sure the proper dom elements can be queired.<br /> */<br /> gReturn = get.get(null,'<clip>','</clip>');<br /> get = null;<br /> $x('ReportDrop').innerHTML = gReturn;<br /> /*<br /> The following code gets the REGION ID of the Region you just grabbed and then initlizes the headers to be AJAX based.<br /> */<br /> init_htmlPPRReport($x('ReportDrop').getElementsByTagName('DIV')[0].id.replace('report',''));<br /> return;<br />}<br /></script><br />
On the report page (150) create a Before Header Reset Pagination Process that resets the pagination if the REQUEST is RP

On the Report Region put <clip> in the Region Header and </clip> in the Region Footer.

There are a few other ways to do this but this is the way that most closely mirrored the original example.

I have updated my Example Application Export so this is there to dig through.

Something to look forward to.

In 3.1 all of this has been fixed with the inclusion of one SUPER EXCITING new declarative report attribute.



I mean look at that! It's a thing of beauty isn't it ;) and better yet it supports all of APEX's pagination types.



EDIT: if you cut and paste the code snippet you will get all the code. I need to adjust the layout of this blog or get one of those nifty code highlighting javascript widgets.

While I do like some of the new features of the whole Web TOO point OH thing ( AJAX, tagging , wiki's , blogs,etc) I've never been much for the whole social network thing, I guess it has it's uses , but I truthfully like more directed forums and mailing lists for following things I'm interested in, they've worked since the days of BBS's to get the info I'm looking for. I do have accounts at most the big ones mainly just to see what it's all about and .....uhh.... borrow good idea's.

But facebook has just taken that proverbial step over to the darkside, I guess that's what happens when MS gets a piece of you. So maybe you have or hadn't heard about facebook's Beacon setup http://www.facebook.com/business/?beacon , here's a bunch of news stories , http://news.google.com/news?q=facebook+beacon .

But the one sentence summary is it allows a website you visit to automatically post what you did there to your facebook account.

It's taken me a couple days after first hearing about it to understand why this sucks. And there are two reasons.

First and most importantly there is not a simple global opt-out. I don't want to participate, I want to have as much control as possible over what is public information about me as I can and they have just ripped that out of my hands, and then told that I'm better for it and it's better this way.

Secondly, well there isn't a second one the first one is quite enough.

Basically and I'll yell this so they hear me.

I DECIDE WHAT I PUBLISH AND I WANT ONE SETTING, EASILY FOUND, TO DO IT!!!!!!

Sure the first comment will be hey if you don't want this then don't have a facebook account, and sure that is a solution , and looking to be a better one every minute I think about this, but facebook has been useful on occasion.

For now since I use Firefox exclusively I'll follow these instructions to block beacon http://www.ideashower.com/blog/block-facebook-beacon/ and I'll keep my eye's open to see if facebook tries to get around that.

If they do, that's it see you facebook it's been fun.

Wednesday on Overlook II at 2pm

So unless you were there or heard about it, my presentation at Oracle World blew up in my face. It seems that Ubuntu and the projectors provided don't mix well. While it wasn't a complete crash and burn, it was definetly a emergency landing.

I had to fall back on my slides , and my whole presentation was supposed to be very slide light and demo heavy, and try to describe to people what the demo was supposed to do. I spent more times on product direction / higher level functions and I still filled the hour and not to many people left so I must have been able to pass along some good info, none the less it wasn't what it should have been.

I worked real hard on my presentation so I was pretty mad at myself/ubuntu/the projector/the world.

But this conference has given me a second chance with the Unconference event. Patrick Wolf mentioned maybe I should do it agian at an Unconference which made alot of sense to me.

So I marched up to the signup board put myself in a slot to present.

I worked way too hard way to hard on this presentation for people not to see it..

So Wednesday on Overlook II at 2pm come by and I'll give it a try again, plus I'll be showing 3.1 features on a huuuuuge projector.

Since Application Express can use WebServices and can integrate JSON like any other webpage. Take a look at this site http://www.trynt.com/ which has a bunch free WebServices,XML and JSON feeds which can be integrated into an APEX application.

Actually the first rule is probably require user login.

So I've been watching the usage on my tagging functionality, and it's not quite what I was hoping for. While I know people were applying and adding tags there was significant amount of people that were applying and adding tags just any old page, probably just to see the nifty AJAX effect I'm sure ;).

So I'm turning off the user initiated tagging, and going with an administrative tagging setup, which is basically just me adding them. I'm actually going to replace my breadcrumbs with this since I think it will be more useful.

User entered tags would work great if I required login to my application and then people could tag pages with personal tags that only they could see. And then the tag package could create tag weights based on that compared against the administered tags.

I will be allowing for voting on tags to change their weights on page but you can only vote on tags the administrator has entered.

Anyway I should have PL/SQL package that can be plugged into any APEX application to provide tagging functionality next week. I'm thinking I might make a package that contains the tagging/rating/comments functionality into ones package , configurable of course.

If course there is always my regular 40 hour to think of but this is much funner ;)

Well I haven't bought into the whole Web 2.0 thing, I'm not talking about the technology part of course. I think AJAX and new RIA features are here to stay. They are excellent tools in the toolkit. I'm talking about the social networking part, I've signed up on services like facebook and such but mostly I have people that are already my friends and I have IM or email contact already, and really don't see the need to add random people but hey maybe it's just me, plus some of the hype is really starting to remind me of Web 1.0.

BUT!! I am sold on tagging, I think it's one of the most important ways of dealing with the flood of data I collect, I'm an avid del.icio.us user now , thanks Tyler , and want to tag everything. I want private tags for me and public tags for outside consumption,

I want to tag my dog , good dog or bad dog, I want to tag my nephew mohawk or sans mohawk.

Plus and most importantly I'm really pushing to include tagging into this.

So in the spirit of this , and as a simple testbed, I built a very simple tagging mechanism for the examples on my sample application.

I'm still working all the kinks especially with how I deal with weighting of tags but so far I'm pretty happy with the result.

When I'm finished this will make an nice addition to the examples on my application and hopefully help people find things they need easier. I think it's much more useful than the breadcrumbs which I will probably be removing soon.

Since I don't require logins you could game the system by voting for tags multiple times or even put in ....... lets just say nonsensical tags, but I'll be administering it since I want it to be useful people.

Well have at it.

http://apex.oracle.com/pls/otn/f?p=11933:136

So I just got a sneak peek at abstract for a particular Oracle OpenWorld session and let me tell you it sounds impressive.

Well sneak peak isn't quite the right word since I had to write the thing.

Advanced Application Express - Building Web 2.0 Applications (Carl Backstrom)

With Oracle Application Express you can quickly create applications that include custom Web 2.0 functionality. In this session you will learn about using the built-in JavaScript libraries and application views to build AJAX based interfaces and functionality. Efficient debugging, development techniques to improve reuse and the future direction of AJAX functionality in Application Express will also be covered.

Well if there is one thing I know in a web application many times it's the details that count.

So here are two quick links to help out with some of the smaller graphic details that sometimes make a difference, especially when your like me and are graphically challenged.

1. Create your AJAX loading graphic http://www.ajaxload.info/

A nice loading graphic for your AJAX requests customized for you applications look and feel is always nice.


2. Create Striped Backgrounds
http://www.stripegenerator.com/

Striped backgrounds (for page or region headers usually) are nice because they are fairly small graphics which equals fast downloads. While you can end up with some pretty garish designs used properly you can get a nice look for minimal page weight.

So I had a couple comments on my Accordion Implementation I whipped up the other day.

http://carlback.blogspot.com/2007/06/is-for-apex-and-accordion.html

Plus someone wanted to be able to initialize with a certain pane open and also to create the Accordion based off of regions not a report. So I took all that to heart and rewrote my implementation a bit plus some extras I wanted and you get.

Report Based Accordion
http://apex.oracle.com/pls/otn/f?p=11933:130

and Region Based Accordion
http://apex.oracle.com/pls/otn/f?p=11933:131

The onmouseover interaction now has a 1/2 second delay.

The object initialization is now a bit more robust with more options. Most of them have pretty normal defaults. The one I recommend setting everytime is OpenMaxHeight as it gives a more consistent user experience.

function pg_Init(){
   pAccordian = new Accordion('accordion');
   /* optional */
   pAccordian.OpenType = 'onmouseover'; //onclick or onmouseover default = onclick
   pAccordian.OpenMaxHeight = 150; // optional but recommended max height of opened pane
   pAccordian.OpenPane = 1;             // open Accordian pane on init 1 based array
   pAccordian.class_Item = 'item'; // set the class to collect item item nodes
   pAccordian.class_Title = 'title'; // set the class that collects title nodes
   pAccordian.class_Title_Current = 'title_current'; // set the class to set current title
   pAccordian.class_Content = 'content':  // set the class that collects content nodes
   /*init object*/
   pAccordian._Init(pAccordian);

}

Just a quick post on a handy online tool.

JSLint while writing javascript sometimes it's easy to take short cuts like if statements without brackets or not ending your lines with semicolons. Plus it's just nice knowing that your dotting your i's and crossing your t's.

I've used it before but after seeing again all the small errors in some of my javascript I've decided to specifically run all my code through it now as a practice.

Documentation : http://www.jslint.com/lint.html

Tool : http://www.jslint.com/

That's right people I've I have the hottest new product for the Oracle APEX community available now!

With some all new functionality but with that slick old school style.

You will receive a working AJAX based ranking system, a AJAX based commenting system (aka: shoutbox) and an reworked AJAX Collection Control (that actually works) plus many other features and enhancements.


! BUT THATS NOT ALL !

Starting with this version I'll also throw in a SQL scripts to install and deinstall all the objects needed to support this application , that's right no more hunting from page to page making sure the examples have the proper tables or procedures! You might ask yourself how can this get any better?

! WELL LET ME TELL YOU !

Sample Data! That's right not only do you get the application! Not only do you get the supporting schema objects! But if you act now you will get your very own copy of the sample data as seen on the Original OTN Sample Application

And what would you expect to pay for this? Hundreds? Thousands? No this is provided to you the people for free thats right absolutely free what can be a better deal than that!

Oh and I'll throw in a readme.txt file as well just because I like you ;)

Pick yours up today.

http://apex.oracle.com/pls/otn/f?p=11933:22

I've added two new features/examples to my Example Application and they can be found on right side of every page.

One is a Ajax based Commenting system and another is an Ajax based Rating system. They are both very simple to implement. Even though the ones I built are tied to Application and Page ID's the table structure can easily be adjusted to apply them to any situation.

A nice additions to these features would be to only allow for one rating per user per page and to automatically populate the comment authors name. This would require me to create a login which is just overkill for my example application but for anyone implementing these solutions it is defiantly features worth adding.

The code can be found on these two pages.

Rating System : http://apex.oracle.com/pls/otn/f?p=11933:5


Comment System : http://apex.oracle.com/pls/otn/f?p=11933:124


The commenting system is open so please use a little restraint in using it, I don't want to have to be spending to much time administrating comments at the same time commenting on my samples would help me and everybody else.

EDIT:
Talk about a timely article :) Study: 38 Percent Of People Not Actually Entitled To Their Opinion

Steven Karam has provided a PDF of his Oracle World presentation Putting the Express Back Into Oracle Application Express with AJAX. It's a very well written and easy to understand introduction into using some of the built in AJAX functionality in APEX. Plus I gotta love the shout out I get at the end ;).
Take some time to dig around his blog a bit more as well he has quite a few tips and tricks in there. The generating XML post is very nice and something I've been working with lately.

Here is a preview of long promised Sticky Hide Show Region code example. The installable code example will be found on the Oracle Application Express Sample Code page in the next day or two.