Skip to content

Commit

Permalink
working on md for apex expandable page items
Browse files Browse the repository at this point in the history
  • Loading branch information
chipbaber committed Jan 24, 2024
1 parent 868bdcc commit 78d88a1
Show file tree
Hide file tree
Showing 23 changed files with 187 additions and 0 deletions.
118 changes: 118 additions & 0 deletions apex_expandable_pageitem.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,118 @@
### Oracle APEX Expandable Page Item Text
In this tutorial we will illustrate one way to create expand/collapseable text inside a page item in Oracle APEX. The demonstration was developed on Oracle Autonomous Transaction Processing leveraging Oracle APEX 23.2.1. This tutorial assumes some basic APEX knowledge is present. That a user has a workspace, the ability to create an application and page inside the application.

## Step 1: Watch Youtube Demonstration
To start we reccomend watching the following youtube video before following the instructions below.
[ Add Link](Add Label)

## Step 2: Follow Steps to Create Expand/Collapsable page Item

- Access or create a new application and page in APEX. (Assumed knowledge.)

- Create a new region on your page.
![](assets/2024-01-24-08-56-40.png)

- Add a Display Only page item.
![](assets/2024-01-24-08-59-14.png)
![](assets/2024-01-24-09-01-39.png)

- Rename your Region to Article.
![](assets/2024-01-24-09-03-04.png)

- Rename your page item to P7_Article, remove the Label text and set format to HTML.
![](assets/2024-01-24-09-04-50.png)

- Click on the lightning bolt and create a new Page Load dynamic action to seed the default value of the text in the page item.
![](assets/2024-01-24-10-37-35.png)

Name your dynamic action.
![](assets/2024-01-24-10-39-31.png)

- Name the true action "seedArticle" and set the action to set value.
![](assets/2024-01-24-10-42-53.png)

- Set the page item to your text field and make sure your Fire on Inialization is set to true.
![](assets/2024-01-24-10-44-10.png)

- Set the Type to SQL query. We will now create a query to get the first 100 characters of our varchar2 or clob we wish to display. To keep it simple we will select text from dual. But this could be a column in your table.
![](assets/2024-01-24-10-45-07.png)


Paste in this query.

```
select SUBSTR('The Sluggers 2023 fall season was the teams'' seventh together and by far the teams most successful.The 13u Sluggers team began the season by acquiring two new players PW and CJ. The additional OF and IF depth helped early on as the team faced many injuries, and as the team adjusted to the 60-90 field dimensions. The team played in three tournaments along with a full NVTBL season. In tournament play, the team finish with a 8-4 record placing second in both the Zombie Apocalypse and Winchester Field of Screams tournamentsl. For the season the team batted .327 across 26 games scoring a record 220 runs averaging 8.4 per game. The team improved considerable pitching with a team ERA of 4.16 allowing 4.9 runs per game while pitching seven players ten or more innings in the season. The season ended with a 18-8 record setting the stage for a great spring 2024 season.',0,100)||'... '||'<a href="#" onclick="console.log(''More Clicked Firing dynamic action to show all text.'');$.event.trigger(''showFullText'');">Read More</a>' as "Article" from dual
```
Pleae note that this query includes HTML like below that will on-click spawn a Jquery event that will return the full article. We will build this event in a moment.

```
<a href="#" onclick="console.log(''More Clicked Firing dynamic action to show all text.'');$.event.trigger(''showFullText'');">Read More</a>
```

- Run your page in the APEX application. You should see the following.
![](assets/2024-01-24-10-49-31.png)

- Now we will create a new custom action to modify the the page item to display the entire article. Navigate back to your APEX development screen right click on events and create a new Dynamic Action.
![](assets/2024-01-24-10-54-08.png)


- Now we will name the dynamic action "showAllText". Under the When dropdown set the Event type to "Custom", name the custom event "showFullText". Set the Selection Type to "Javascript Expression" and type in the word "document" in the expression field. Please note that the word document apply the Jquery function to the entire document itself when triggers.
![](assets/2024-01-24-10-56-33.png)

The Custom Event name, in this example showFullText is the name we will trigger in our html link.
```
$.event.trigger('showFullText');
```

- Click on your true event. Modify the following fields.
Set the Name to "showAllText".
Set Action to "Set Value".
Make sure the Escape Special Characters is set to false.
Set the Item(s) to be set to your text field, in this example P7_article.
Make sure Fire on Initialization is set to false.
![](assets/2024-01-24-11-04-03.png)

Last but not least paste in the query below. This will query your article and return all the text with a read less link at the bottom to return to the shorter article.

```
select 'The Sluggers 2023 fall season was the teams'' seventh together and by far the teams most successful.The 13u Sluggers
team began the season by acquiring two new players PW and CJ. The additional OF and IF depth helped early on as the team faced
many injuries, and as the team adjusted to the 60-90 field dimensions. The team played in three tournaments along with a full
NVTBL season. In tournament play, the team finish with a 8-4 record placing second in both the Zombie Apocalypse and Winchester
Field of Screams tournamentsl. For the season the team batted .327 across 26 games scoring a record 220 runs averaging 8.4 per game.
The team improved considerable pitching with a team ERA of 4.16 allowing 4.9 runs per game while pitching seven players ten or more innings
in the season. The season ended with a 18-8 record setting the stage for a great spring 2024 season.'
||'<br><a href="#" onclick="console.log(''More Clicked Firing dynamic action to min text.'');$.event.trigger(''showLessText'');">Read Less</a>' as "Article" from dual
```

- Run your page, click on the read more button. You should see the full article appear. Next we will wire our Read Less button to return to the prior state.
![](assets/2024-01-24-11-11-34.png)

- Create another dynamic action.
![](assets/2024-01-24-10-54-08.png)

- Set the name to "showLessText". Set the event type to "custom". Set the Custom Event name to "showLessText". Set the selection type to Javascript Expression and the Javascript Expression field to document.
![](assets/2024-01-24-11-59-26.png)

- Navigate to the true action. Much like before we name it "showLessText". Set the action as set Value. Set both Escape special characters and fire on initialization to false. Set the Item to set to P7_Article.
![](assets/2024-01-24-12-03-32.png)

Last but not least set our query to the one below. Please notice this query matches our intial one on page load, only it fires on-click as opposed to page load.

```
select SUBSTR('The Sluggers 2023 fall season was the teams'' seventh together and by far the teams most successful.
The 13u Sluggers team began the season by acquiring two new players PW and CJ. The additional OF and IF depth helped early
on as the team faced many injuries, and as the team adjusted to the 60-90 field dimensions. The team played in three
tournaments along with a full NVTBL season. In tournament play, the team finish with a 8-4 record placing second in both
the Zombie Apocalypse and Winchester Field of Screams tournamentsl. For the season the team batted .327 across 26 games
scoring a record 220 runs averaging 8.4 per game. The team improved considerable pitching with a team ERA of 4.16 allowing
4.9 runs per game while pitching seven players ten or more innings in the season. The season ended with a 18-8 record
setting the stage for a great spring 2024 season.',0,100)||'... '||
'<a href="#" onclick="console.log(''More Clicked Firing dynamic action to show all text.'');$.event.trigger(''showFullText'');">Read More</a>'
as "Article" from dual
```

- Run your page again. Click Read more, then read less. You should see your page item dynamically refresh.
![](assets/2024-01-24-12-09-54.png)
![](assets/2024-01-24-12-10-16.png)

Binary file added assets/2024-01-24-08-56-40.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/2024-01-24-08-59-14.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/2024-01-24-09-01-39.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/2024-01-24-09-03-04.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/2024-01-24-09-04-50.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/2024-01-24-10-37-35.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/2024-01-24-10-39-31.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/2024-01-24-10-42-53.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/2024-01-24-10-44-10.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/2024-01-24-10-45-07.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/2024-01-24-10-49-31.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/2024-01-24-10-54-08.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/2024-01-24-10-56-33.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/2024-01-24-11-01-07.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/2024-01-24-11-04-03.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/2024-01-24-11-06-56.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/2024-01-24-11-11-34.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/2024-01-24-11-59-26.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/2024-01-24-12-03-32.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/2024-01-24-12-09-54.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/2024-01-24-12-10-16.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
69 changes: 69 additions & 0 deletions ci_sr_add.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,69 @@
```
declare
v_eventdate ci_sessions.EVENT_DATE%type;
v_oppt ci_sessions.OPPT_%type;
v_id ci_sessions.ID%type;
v_count number(4) :=0;
v_countErr number(4) :=0;
--dynamic sql variables
sql_stmt VARCHAR2(700);
sql_update VARCHAR2(700);
v_sr ci_sr_hours.sr_number%TYPE;
v_expFilter varchar2(32000);
--Script to add in or update SR number to weekly stats
--cursor to get all current values is step 1
CURSOR sessions IS
select event_date, oppt_, id from ci_sessions where service_request is null;
begin
dbms_output.put_line('Starting procedure');
v_expFilter := '"DV - SE Team"."Opportunity"."Opportunity ID" in (';
--begin loop
OPEN sessions;
LOOP
FETCH sessions INTO v_eventdate, v_oppt, v_id;
EXIT WHEN sessions%notfound;
--Look for SR with dynamic sql
sql_stmt := 'select sr_number from ci_sr_hours where :v_oppt = opportunity_id and :v_eventdate between first_effort and last_effort';
--Putting Dynamic SQL in error block to check if oddity with SR number so program can proceed.
begin
EXECUTE IMMEDIATE sql_stmt INTO v_sr USING v_oppt, v_eventdate;
dbms_output.put_line('Query Executed results for ID: '||v_id|| chr(10)||' Event Date: '||v_eventdate||' - Oppt ID: '||v_oppt||' - SR: '||v_sr);
begin
-- update row into DB.
sql_update := 'update ci_sessions set service_request = :v_sr where id = :v_id ';
EXECUTE IMMEDIATE sql_update USING v_sr, v_id;
EXCEPTION
WHEN OTHERS THEN
dbms_output.put_line('Error on insert for id: '||v_id);
end;
v_count := v_count+1;
EXCEPTION
WHEN OTHERS THEN
v_countErr := v_countErr+1;
--dbms_output.put_line('Error processing row ID: '||v_id||' in ci_sessions table. Query below.');
--v_expFilter := v_expFilter||' ''' ||v_oppt||''',';
--dbms_output.put_line('select * from ci_sessions where id = '||v_id);
--dbms_output.put_line('select sr_number from ci_sr_hours where '''||v_oppt||''' = opportunity_id and '''||v_eventdate||''' between first_effort and last_effort');
end;
END LOOP;
CLOSE sessions;
-- v_expFilter := substr(v_expFilter, 1, length(v_expFilter)-1) || ')';
commit;
dbms_output.put_line('Rows Updated:' || v_count);
dbms_output.put_line('Rows not Processed:' || v_countErr);
EXCEPTION
WHEN OTHERS THEN
dbms_output.put_line('Other Error occurred: ');
end;
```

0 comments on commit 78d88a1

Please sign in to comment.