Oracle APEX - Display card image from the dynamic list - oracle-apex-5.1

I am displaying a list on my page in the format of cards but the image is not showing up - only a grey circle. Here is my query for the dynamic list:
SELECT null as level_value,
TITLE as label,
null astarget,
null as is_current,
IMG_PATH as image,
'width="40" height="40"' image_attribute,
TITLE as image_alt_attribute,
DECRIPTION as attribute1
FROM TABLE1
ORDER BY TITLE
I also tried:
SELECT null as level_value,
TITLE as label,
null astarget,
null as is_current,
'<img src="' || IMG_PATH || '"/>' as image,
'width="40" height="40"' image_attribute,
TITLE as image_alt_attribute,
DECRIPTION as attribute1
FROM TABLE1
ORDER BY TITLE
I have noticed when inspecting the page that APEX adds my image tag to the class of a span:
<span class="t-Icon <img src='my image path' />">
instead of just adding an image to the card

I found a solution. Actually two solutions.
1) Modify dynamic list to utilize CARD_INITIALS and attributes
SELECT null as level_value,
TITLE as label,
null astarget,
null as is_current,
IMG_PATH as CARD_INITIALS,
'width="40" height="40"' image_attribute,
TITLE as image_alt_attribute,
DECRIPTION as attribute1,
'' as attribute2,
'<img src="' || IMG_PATH || '"/>' as attribute3
FROM TABLE1
ORDER BY TITLE
Setting both CARD_INITIALS and attributes3 that way was necessary - other combinations did not work properly.
Then, in List region attributes, set List template to Cards, style to featured, and Icons to - Display Initials.
2) Classic report - setting its attributes to Cards template and using CARD_INITIALS, CARD_TITLE, and CARD_TEXT as aliases in the source query. Both methods produce desired results

The appearance and structure of these lists are pre-defined. I think this list template understands an image as a css class.
To work, you need to provide a valid css class
list of icons/class: https://apex.oracle.com/pls/apex/f?p=42:icons
EDIT.
Maybe you can copy this list template that you are trying to use and make the modification needed to get the url of an image.
To do this, you need to go to shared components >> Templates >> Find your template list >> click on the last column of the report to copy >> Edit the html to receive the url of an image. On this page you will find several substituition strings.
The one that receives the "image" is something like #ICON_CSS_CLASSES#, but it is by default used in a "span" class, its change would be to create an "img" and put that substituition string in the "src" of that "img", something like
<img src="#ICON_CSS_CLASSES#">

Related

Filter Range Based on Data Validation Dropdown

I have a Google Sheet that has a cell that I want to use as a drop-down filter for another range within the sheet.
You can take a look at the sheet HERE.
Cell G11 is the cell that I wish to have the drop-down filter in.
Range B15:H69 is the range that should be filtered upon using this filter.
So, for example - if I select 'Barbarian' in the G11 drop-down the sheet should go from something like this (cut short for size of post sake):
To something like this:
I've tried using Named Ranges, using a seperate sheet to filter the data, and a couple other methods I found. Nothing seems to work exactly how I want it to, like in picture #2.
try:
=INDEX(LAMBDA(x, SPLIT(FLATTEN(SPLIT(FLATTEN(QUERY(TRANSPOSE(x),,9^9))&"×​", "×")), " "))
(QUERY({ROW(Data!A2:D), SORT(Data!A2:D, 3, 0)},
"select Col1,Col2,'♀',Col3,Col4,'♂',Col5 where Col3 = '"&G11&"' label'♀''','♂'''")))
UPDATE:
=INDEX(LAMBDA(x, SPLIT(FLATTEN(SPLIT(FLATTEN(QUERY(TRANSPOSE(x),,9^9))&"×​", "×")), " "))
(QUERY({ROW(Data!A2:D)-1, SORT(Data!A2:D, 3, 0)},
"select Col1,Col2,'♀',Col3,Col4,'♂',Col5 where 2=2 "&IF(
REGEXMATCH(G11, "(?i)all|n\/a|^$"),," and Col3 = '"&G11&"'")&" label'♀''','♂'''")))

How to insert an image before :topc: of asciidoc?

Using :top: can auto-create table of content following title like this:
Title
content table
But I want to insert an image before :toc: and after title like this:
Title
[logo]
content table
How?
Answer: https://docs.asciidoctor.org/asciidoc/latest/toc/position/
= The Intrepid Chronicles
Kismet Lee; B. Steppenwolf; Pax Draeke
:toc: macro
== Certain Peril
toc::[]
Daylight trickles across the cobblestones...
== Dawn on the Plateau
Hanging from...

making my tabular form dynamic

I have a checkbox on a tabular form. I need to be able to hide it if the submit date is not filled in and show it when a date is there. Once the checkbox has been clicked, I need to update another field based on the checkbox being clicked or when I hit the update button. is this possible on a Oracle Apex tabular form in version 4.2?
You can create dynamic actions on tabular form fields, but you need to know some Javascript / jQuery / DOM stuff as it can't be done declaratively as it can with page items.
As an example, I created a simple tabular form on the EMP table:
Using the browser's Inspect Element tool I can see that the HTML for the Ename field on row 3 looks like this:
<input type="text" name="f03" size="12" maxlength="2000" value="Ben Dev"
class="u-TF-item u-TF-item--text " id="f03_0003" autocomplete="off">
The relevant bits to note are the name "f03" and the ID "f03_0003". For all tabular form fields, the name indicates the column, and is the same for all fields in that column. The ID is made up of the name plus a string to represent the row - in this case "_0003" to represent row 3.
Similarly, the Hiredate fields are all named "f004" and have IDs like "f04_0003".
Armed with this information we can write a dynamic action. For example, let's say that whenever Ename is empty then Hiredate should be hidden, otherwise shown. In pseudo-code:
whenever an element with name "f03" is changed, the element with name "f04" on the same row should be hidden or shown.
So we can create a synamic action with a When condition like this:
Event = Change
Selection type = jQuery selector
jQuery selector = input[name="f03"]
i.e. whenever an input whose name is "f03" is changed, fire this action.
The action performed will have to be "Execute Javascript code", and the code could be:
// Get the ID of this item e.g. f03_0004
var this_id = $(this.triggeringElement).attr('id');
// Derive the ID of the corresponding Hiredate item e.g. f04_0004
var that_id = 'f04'+this_id.substr(3);
if ($(this.triggeringElement).val() == "") {
// Ename is empty so hide Hiredate
$('#'+that_id).closest('span').hide();
} else {
// Ename is not empty so show Hiredate
$('#'+that_id).closest('span').show();
}
Because Hiredate is a date picker, I needed to hide/show both the field itself and its date picker icon. I chose to do this by hiding/showing the span that contains them both. This code could have been written in many different ways.
You could apply similar techniques to achieve your aims, but as you can see it isn't trivially easy.

Show Different category name in tooltip in spotfire bar chart

We have a requirement for showing ID in category axis and description of same ID in tooltip.
I have multiple columns in my data like value 1 ,value2,value 3 etc. value 1, value 2 are columns.
I am putting this on value axis as an expression like Sum([value 1]) as [AC 6076 ], Sum([Value 2]) as [AC 6078 ], etc. that is this will hardcoded as IDs in category axis
So my category axis is column names. that is <[Axis.Default.Names]> .
please see the attached picture. It's the description against a column not a row.
It would be an expression in tooltip which may be something like
First(Case when '${Axis.Y.DisplayName}'='AC 6076' then "description 1" when '${Axis.Y.DisplayName}'='AC 6078 ' then "description 2" else " Description 3" end )
This expression is not showing correct value. it wil always show "Descrition 3"
i want to show this IDs(column names in category axis) and a description for each of these column names in tooltip. please have a look at the picture attached.
Atatched picture
Thanks
First(CASE
WHEN '${Axis.Y.DisplayName}'='AC 6076' THEN "description 1"
WHEN '${Axis.Y.DisplayName}'='AC 6078 ' THEN "description 2"
ELSE " Description 3"
END)
this always evaluates to your ELSE condition because ${Axis.Y.DisplayName} will always be the full display name for the axis, not the individual columns (i.e., "AC 6076, AC 6078").
you will need to add your description text to your data somehow. this is a little convoluted and will require some tweaking on your end, but the principle is the same.
this is assuming your table is something like this:
key val1 val2
a 1 4
b 2 5
c 3 6
from the menu, select File..Add Data Tables...
click Add then select the data table powering your visualization from the From Current Analysis heading
expand the Transformations pane at the bottom of this dialog
choose a Pivot transform and click **Add...*
leave everything default except for Transfer columns..., where you should add only the columns you wish to sum (e.g., [value 1] and [value 2])
OPTIONALLY change the naming scheme to just %T
click OK
your table now looks like (ignoring optional steps):
Sum(val1) Sum(val2)
6 15
choose another transform, this time Unpivot, and click **Add...*
add all columns to Columns to transform
click OK
now you have:
Category Value
Sum(val1) 6
Sum(val2) 15
choose one last transform: Calculate new column and click **Add...*
enter your case statement that will determine the description and name the column "Description" or something
click OK
click OK
your final table will resemble:
Category Value Description
Sum(val1) 6 This is the sum of value 1
Sum(val2) 15 This is the sum of value 2
on your bar chart, the category axis expression should be Category and value should be Sum(Value) (assuming you didn't change the column names in step 9)
add a new line to the tooltip with an expression First([Description]), or whatever you named the new column in step 12
whew. it's a lot of steps but it works. the goal is to get the description data into it's own column so you can put it in the tooltip. since your data is aggregated and doesn't exist in its own column, this is the only way I can think of doing it.

Change Group Labels in AdvancedDataGrid

I'm trying to use an AdvancedDataGrid to display some grouped data. Normally flex displays this in a "tree view" with a folder icon represent the group. I need to group the data based on an integer ID field in my object, but I'd like the label for the folder icon to display the groupName field in my object.
Here's a little example:
{groupName: group1, ID: 1234}
{groupName: group2, ID: 5678}
<mx:grouping>
<mx:Grouping label="Group"> <--- The label of the whole column
<mx:GroupingField name="ID">
</mx:Grouping>
</mx:grouping>
Resulting output:
=== Group ===
+ 1234
- child
- child
+ 5678
...
But I'd really like to output:
=== Group ===
+ group1
- child
- child
+ group2
...
If anyone has any tips I'd appreciate it.
-- Dan
Have a look at GroupingField#groupingFunction. From the adobe docs:
A function that determines the label for this group. By default, the group displays the text for the field in the data that matches the filed specified by the name property. However, sometimes you want to group the items based on more than one field in the data, or group based on something that is not a simple String field. In such a case, you specify a callback function by using the groupingFunction property.
private function myGroupingFunction(value:Object, field:GroupingField):String

Resources