Aufgabe
Zeige eine Liste von Elementen an; die vom Anwender gewählten Elemente werden importiert.
Lösung
Über den APEX API Aufruf „APEX_ITEM.CHECKBOX2“ im SQL einen Classic Report mit einer Checkbox an der entsprechenden Stelle erzeugen.
API siehe ⇒ https://docs.oracle.com/en/database/oracle/application-express/19.2/aeapi/APEX_ITEM.html
SQL:
SELECT apex_item.checkbox2(1,id) AS selected .. FROM my_table
Im Classic Report auf der Spalte über die Eigenschaft „Security / Escape special characters“ auf „No“ erlauben das der mit APEX_ITEM erzeugte HTML Code auch aktiv ausgewertet wird und als Check Box angezeigt wird.
Über den ersten Parameter wird definiert in welcher Collection die Daten später landen sollen.
Mit „apex_item.checkbox2(1,id)“ wird die dann später vom Anwender selektierte ID in der Collection „apex_application.g_f01“ zu finden sein.
Verarbeiten mit:
for i in 1..apex_application.g_f01.count loop v_id:= apex_application.g_f01(i); ..... end loop;
Je nach Bedarf mit Styles das ganze etwas Optisch aufwerten:
/* https://jsfiddle.net/rvgccn5b/ */ input[type=checkbox]{ cursor: pointer; } input[type=checkbox]:checked:before { content: "\2713"; background: #008080; text-shadow: 1px 1px 1px rgba(0, 0, 0, .2); font-size: 20px; text-align: center; line-height: 8px; display: inline-block; width: 22px; height: 22px; color: #FF8C00; border: 1px solid #cdcdcd; border-radius: 4px; margin: -3px -3px; text-indent: 1px; } input[type=checkbox]:before { content: "\202A"; background: #ed813e; text-shadow: 1px 1px 1px rgba(0, 0, 0, .2); font-size: 20px; text-align: center; line-height: 8px; display: inline-block; width: 22px; height: 22px; color: #FF8C00; border: 2px solid #cdcdcd; border-radius: 4px; margin: -3px -3px; text-indent: 1px; }
siehe auch die Orginal Idee unter https://jsfiddle.net/rvgccn5b/
Das sieht dann so aus:
Oracle:
Web:
CSS Beispiel: