Gunther Oracle APEX und Datenbank Wiki

Diese Seite ist nicht editierbar. Sie können den Quelltext sehen, jedoch nicht verändern. Kontaktieren Sie den Administrator, wenn Sie glauben, dass hier ein Fehler vorliegt.
=====Oracle Apex - Classic Report - Daten mit Checkbox oder Radio Group selektieren=====


<fc #800000>**Aufgabe**</fc>

Zeige eine Liste von Elementen an; die vom Anwender gewählten Elemente werden importiert.


<fc #008000>**Lösung**</fc>

Ü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

----

=== Checkbox in der SQL Abfrage erzeugen===

SQL:
<code sql>

select apex_item.checkbox2(1,id) as selected
      ..
from 
 my_table
</code>


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.



----

=== Zugeordnete Collection auswerten===

Ü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:
<code>
   for i in 1..apex_application.g_f01.count 
      loop
       
       v_id:= apex_application.g_f01(i);
     
      .....
              
      end loop;

</code>

----

=== Checkbox mit Styles anpassen===


Je nach Bedarf mit Styles das ganze etwas Optisch aufwerten:

<code css>
/* 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;
}
</code>
siehe auch die Orginal Idee unter  https://jsfiddle.net/rvgccn5b/


Das sieht dann so aus:

{{ :prog:apex:apex_classic_report_mit_checkbox_v01.png | Classic Report with Checkboxes }}

----

==== Quellen ====

Oracle:

  * https://docs.oracle.com/en/database/oracle/application-express/19.2/aeapi/APEX_ITEM.html
  * https://docs.oracle.com/en/database/oracle/application-express/19.2/aeapi/CHECKBOX2-Function.html

Web:

  * https://jeffkemponoracle.com/2018/09/using-apex_item-checkbox2-with-multiple-identifiers/

CSS Beispiel:

  * https://lokesh-coder.github.io/pretty-checkbox/