Browsing "Older Posts"

Browsing Category "EXTJS"
APEX-AT-WORK no image

onClick event over whole EXTJS tree node

Von Tobias Arnhold → 5.14.2010
I while ago I had an issue with the ExtJS tree. Somebody mentioned that not all parts of an ext tree node (for example the icons or the empty area) get called by an onClick event. There are just two line of code you need to add to your tree:

tree.on('click', function(node){ // tree is the created ExtJS tree object
fnc_openWindow(node.id); //this is the javascript function I call
});


Watch the whole post in the ExtJS forum to get more information about it:
http://www.extjs.com/forum/showthread.php?95597-Ext-tree-href-event-on-whole-div-element
APEX-AT-WORK no image

AJAX based select list in APEX - Part 2

Von Tobias Arnhold → 3.01.2010
I couple of days ago I wrote about a way using AJAX based select lists in APEX.
After some hints from Peter Raganitsch I tried the ApexLib Framework but I run into some issues with ExtJS.
Error message:
vFieldValue is undefined
populateLovField(Object { name="pFieldId"}, Object { name="pLovEntry"})ApexLib_Full.js
populateDependingLovs(Object { name="pFieldId"})ApexLib_Full.js
(?)()ApexLib_Full.js
(?)(Object { name="pEvent"})ApexLib_Full.js
vAjaxRequest.add(pLovEntry.oUsedFi...ace(/\:/g, String.fromCharCode(1)));

Error part where somehow an ExtJS function got called:

vAjaxRequest.add(pLovEntry.oUsedFieldList[ii], vFieldValue.replace(/\:/g, String.fromCharCode(1)));

I found another solution from Carl Backstrom: Ajax Selects
I modified his script a bit and used it in my environment.

Using the ApexLib would have been much easier luckily I just had a really small application.

Good for us that APEX 4.0 will solve these problems by a new standard feature:
Oracle APEX 4.0: Cascading LOVs/Select Lists

AaW - DBMON First pictures / Erste Bilder

Von Tobias Arnhold → 2.22.2010
The following post is targeted towards a German audience, thus it is in German:

Anfang Februar habe ich über eine Oracle DB Monitoring Anwendung für die deutsche APEX Community berichtet: Whats about the German APEX users?
Endlich habe ich es geschafft ein paar Screenshots zu erstellen. Die Anwendung basiert auf APEX und ExtJS und sammelt derzeit folgende Informationen:
- Tablespace Auslastung
- CPU Auslastung
- Buffer Hitratio Auslastung
- Session Zähler
- PGA Auslastung
- Init.ora Paramter
- Aktueller DB Status

Daten werden durch den DBMS_SCHEDULER über ein PL/SQL Package zu spezifizierten Zeiten gesammelt und können dadurch rückwirkend ausgewertet werden.
Gerade für Oracle XE Umgebungen kann dieses kleine Tool von nutzen sein.

Derzeit suche ich noch Beta-Tester, um für Ende März eine erste Testversion auf Herz und Nieren zu überprüfen. Wenn Interesse besteht, schickt einfach eine Email an: Tobias Arnhold (tobias-arnhold@hotmail.de)

Hier die ersten Screenshots:



APEX-AT-WORK no image

Creating an ExtJS tree with PL/JSON

Von Tobias Arnhold → 2.04.2010
I searched for a smoother way building ExtJS trees in APEX and found a great post from Anja Hildebrandt: Nice trees with ExtJS (Erstellung eines ExtJS-Baums…)

She used the PL/JSON Utility from Lewis Cunningham: PL/JSON by jkrogsboell, lewiscunningham

During the time now Lewis developed a new version of the utility and Anjas code didn't work anymore. I updated her source code with the new version of PL/JSON 0.8.6.

First I show how you build JSON output with the PL/JSON scripts:
Example - ex4.sql

SQL> declare
2 obj json;
3 procedure p(v varchar2) as begin dbms_output.put_line(null);dbms_output.put_line(v); end;
4 begin
5 p('you can also put json or json_lists as values:');
6 obj := json(); --fresh json;
7 obj.put('text', 'Audi');
8 obj.put('id', 100);
9 obj.put('leaf', json_bool(true));
10 obj.put('href', 'f?p=110:1:');
11 obj.put('children', json_list('[{"text": "A4"},{"text": "A5"}]'));
12 obj.print;
13 end;
14 /


you can also put json or json_lists as values:
{
"text" : "Audi",
"id" : 100,
"leaf" : true,
"href" : "f?p=305:1:",
"children" : [{
"text" : "A4"
}, {
"text" : "A5"
}]
}

PL/SQL procedure successfully completed

PL/JSON forum example
 
SQL>
SQL> DECLARE
2 resultset json;
3 row_list json_list := json_list();
4 columns1 json;
5 num_rows number := 2;
6 columns_length number := 3;
7 procedure p(v varchar2) as begin dbms_output.put_line(null);dbms_output.put_line(v); end;
8 BEGIN
9 p('Data:');
10 FOR i IN 1 .. num_rows
11 LOOP
12 columns1 := json();
13 columns1.put('rownum', i);
14 FOR x IN 1 .. columns_length
15 LOOP
16 columns1.put('column' || x, 'Testdata');
17 END LOOP;
18 row_list.add_elem(columns1.to_anydata);
19 END LOOP;
20 resultset := json();
21 resultset.put('ResultSet', row_list);
22 resultset.print;
23 END;
24 /


Data:
{
"ResultSet" : [{
"rownum" : 1,
"column1" : "Testdata",
"column2" : "Testdata",
"column3" : "Testdata"
}, {
"rownum" : 2,
"column1" : "Testdata",
"column2" : "Testdata",
"column3" : "Testdata"
}]
}

PL/SQL procedure successfully completed

SQL>

Updated tree package of Anja

create or replace package PKG_EXTJS_JSON is

-- Author : AHILDEBRANDT
-- : TARNHOLD
-- Created : 10.08.2009
-- Updated : 04.02.2010
-- Purpose : check if category has sub-categories
function hasChildren(i_cat_id in number) return boolean;

-- Purpose : create JSON-Object for category;
-- recursive
function getJsonObject(i_cat_id in number default 0) return json;

-- Purpose : function that calls getJsonObject and returns the result as string
function getTreeDataDynamic return varchar2;

end PKG_EXTJS_JSON;

create or replace package body PKG_EXTJS_JSON is
/*
-- Author : AHILDEBRANDT
-- : TARNHOLD
-- Created : 10.08.2009
-- Updated : 04.02.2010
-- Purpose : check if category has sub-categories
*/
function hasChildren(i_cat_id in number) return boolean is
v_count number:=0;
begin
select nvl(count(*),0) into v_count from tbl_categories where c_par_id=i_cat_id and c_active = 'YES';
if v_count>0 then
return true;
else
return false;
end if;
end;

/*
-- Author : AHILDEBRANDT
-- : TARNHOLD
-- Created : 10.08.2009
-- Updated : 04.02.2010
-- Created : 10.08.2009
-- Purpose : create JSON-Object for category;
-- recursive
*/
function getJsonObject(i_cat_id in number default 0) return json is
v_json json:=json();
v_row_list json_list := json_list();
v_arr_id NUMBER;
v_ele_id NUMBER;
begin

if i_cat_id = 1 then -- if category is root then set root-node
v_json.put(pair_name => 'id', pair_value => i_cat_id);
v_json.put(pair_name => 'text', pair_value => 'Root');
else -- else --> usual node; use category infos
for cat in (select * from tbl_categories where c_id=i_cat_id and c_active = 'YES') loop
v_json.put(pair_name => 'id', pair_value => i_cat_id);
v_json.put(pair_name => 'text', pair_value => cat.c_name);
end loop;
end if;

if not hasChildren(i_cat_id) then -- if node has no children
v_json.put(pair_name => 'leaf', pair_value => json_bool(true)); -- mark as leaf
v_json.put(pair_name => 'href', pair_value => 'f?p=110:1:'||v('APP_SESSION')); -- set a link if needed
-- v_json.put(pair_name => 'href', pair_value => 'javascript:show_cat('||i_cat_id|| ');'); -- set a javascript function
else -- sonst
v_json.put(pair_name => 'leaf', pair_value => json_bool(false)); -- mark as node with children
for child in (select * from tbl_categories where c_par_id=i_cat_id and c_active = 'YES') loop -- loop through all sub-categories
-- create JSON-object for sub-category using recursive call and the append to array
v_row_list.add_elem(getJsonObject(i_cat_id => child.c_id).to_anydata);
end loop;
v_json.put(pair_name => 'children', pair_value => v_row_list); -- add array for subcategories
end if;

return v_json;

end;

/*
-- Author : AHILDEBRANDT
-- : TARNHOLD
-- Created : 10.08.2009
-- Updated : 04.02.2010
-- Purpose : function that calls getJsonObject and returns the result as string
*/
function getTreeDataDynamic return varchar2 is
v_json json:=json();
begin
v_json:=getJsonObject(i_cat_id => 1);
return('['||v_json.to_char||']');
end;

end PKG_EXTJS_JSON;

Utilities like this makes developing much more faster!
APEX-AT-WORK no image

Update of my example application

Von Tobias Arnhold → 10.08.2009
Hi!

Out of some reason Oracle does not provide the applications from the APEX Developer Competition 2009.

Some winners already provided there applications:
Matt Nolan: APEX Plugin Registry Application
Martin Giffy D'Souza: APEX Rules & Guidelines

I just updated my example application as well:

APEX-AT-WORK Developer Competition 2009 Edition
Description: This application is an upgrade of the original APEX-AT-Work Example application. It includes lots of new examples, a new layout, new techniques (like screen casts) and an extended documentation. It is not a normal APEX application which includes lot's of business logic. This application shows how to use the new technologies out there. The core is based on a javascript library called ExtJS. This library creates a completely new look and feel which makes APEX even nicer to use. But also rarely used APEX WEB 2.0 features are integrated based on typical examples.

About the competition:
Oracle.com: Oracle Application Express Developer Competition 2009
David Peake's Blog: Winners of APEX Developer Competition 2009
OTN Blog: Congrats to the Oracle Apex Developer Competition 2009 Winners
Oracle.com: Rules

I must object another behavior what I can't understand. Why aren't there any jury judgments. I really would have loved to know what for example Dimitri thought about my application. I guess all other developers think the same.

Anyway I wish everybody a really exciting OOW.
APEX-AT-WORK no image

APEX navigation concepts

Von Tobias Arnhold → 8.14.2009
Last couple of month I worked on new navigation concepts and wanted to share my ideas and experiences with you.


Download PDF version: APEX_navigation_concepts.pdf

Feel free to share your opinion about APEX navigation concepts!
APEX-AT-WORK no image

ExtJS navigation tree

Von Tobias Arnhold → 6.19.2009
Hi folks,

I added an ExtJS navigation tree to my example application. To get the JSON data out of the database I created a small package which is dynamically creating this data string on every page load.

Take a look at the updated source code: AAW - ExtJS navigation tree

I got some request about the application installation file (application source code). So I decided to publish it to everybody how asks for it via email: tobias-arnhold@hotmail.de
I would use the same procedure as Denes does. You get an developer account and can download the current version yourself.

PS, feedback is always welcome! :D