Datumseingaben vereinfachen...
von Thomas Fuhr, Oracle Consulting, mailto:Thomas[dot]Fuhr[at]oracle[dot]com

Dieser Beitrag widmet sich dem Thema Vereinfachung von Datumseingaben in Application Express-Formularen mit Hilfe von AJAX.

In MS Excel kennen Sie wahrscheinlich die automatische Vervollständigung eines Datums. Wenn Sie "tt.mm" (z.B. 10.2) eingeben, wird die Eingabe nach Verlassen der Zelle zu einem Datum vervollständigt (z.B. 10.02.2009, wenn das Datumsformat tt.mm.jjjj lautet).

Ein nettes Helferlein. Und wie wäre es mit diesen?

Eingabe vonResultat
h oder HAnzeige des heutigen Datum
m oder MAnzeige des morgigen Datums
u oder UAnzeige des Monatsultimo
ü oder ÜAnzeige des Datums von Übermorgen
g oder GAnzeige des gestrigen Datums
v oder VAnzeige des Datums von Vorgestern
xhAnzeige des aktuellen Datums plus x Stunde(n)
xtAnzeige des aktuellen Datums plus x Tag(e)
xwAnzeige des aktuellen Datums plus x Woche(n)
xmAnzeige des aktuellen Datums plus x Monat(e)
xjAnzeige des aktuellen Datums plus x Jahr(e)
2.9.98Anzeige "02.09.1998"
2.9.07Anzeige "02.09.2007"
31.2Anzeige "falsches Datum"
3.14.09Anzeige "falsches Datum"
3.märAnzeige "falsches Datum"

Dieser Beitrag zeigt, wie Sie diese Helferlein in Ihren APEX-Anwendungen realisieren können.

Erstellen Sie zunächst ein Element auf einer Anwendungsseite. Es sollte zunächst als Textfeld angezeigt werden.

Bearbeiten Sie anschließend das eben erstellte Element und geben folgendes in das Feld HTML-Form-Elementattribute ein:

onBlur="fuelleDatum(this.id,this.value);"

Navigieren Sie nun zu den Eigenschaften der Seite, dort zum Feld HTML-Header und tragen Sie folgenden JavaScript-Code ein:

<script type="text/javascript">
<!--
function fuelleDatum(pId,pValue){
 var lRequest = new apex.ajax.ondemand('fuelleDatum',
                 function(){
                  /* start the return function */
                  var l_s = p.readyState;
                  if(l_s == 1||l_s == 2||l_s == 3){
                  }else if(l_s == 4){
                   gReturn = p.responseText;
                   (gReturn)?json_SetItems(gReturn):null;
                  }else{return false;}
                  /* end the return function */
                 }
                );
 lRequest.ajax.addParam('x01',$v('pFlowStepId'));
 lRequest.ajax.addParam('x02',pId);		
 lRequest.ajax.addParam('x03',pValue);
 lRequest._get();
}
//-->
</script>

Navigieren Sie anschließend zu den Gemeinsamen Komponenten, dort zu den Anwendungsprozessen. Erstellen Sie einen neuen Anwendungsprozeß mit Namen fuelleDatum (achten Sie auf die Groß- und Kleinschreibung). Stellen Sie sicher, dass der Prozeß Bedarfsgesteuert (on Demand) ausgeführt wird und geben Sie folgenden PL/SQL Code ein:

DECLARE
  l_date             DATE;
  l_date_c           VARCHAR2(30);
  l_display_as       VARCHAR2(50);
  l_date_format_mask VARCHAR2(20) DEFAULT 'DD.MM.YYYY';
  l_item_name        VARCHAR2(4000);
  l_page_id          VARCHAR2(4000);
  l_value            VARCHAR2(4000);
BEGIN
  l_page_id := wwv_flow.g_x01;
  l_item_name := wwv_flow.g_x02;
  l_value := wwv_flow.g_x03;
  l_date_c := l_value;
  SELECT display_as INTO l_display_as 
    FROM apex_application_page_items
    WHERE application_id = v('APP_ID') AND
          page_id = l_page_id AND
          item_name = l_item_name;
  IF SUBSTR(UPPER(l_display_as),1,11) = 'DATE PICKER' THEN
     l_date_format_mask := REGEXP_REPLACE(l_display_as,'(.*)(\()(.+)(\))','\3');
  END IF;
  IF REGEXP_LIKE(l_value,'^([+-]?\d+)([hHtTwWmMjJ])$') THEN
    CASE
      WHEN REGEXP_LIKE(l_value,'^([+-]?\d+)[hH]$') THEN
        l_date := SYSDATE + TO_NUMBER(REGEXP_SUBSTR(l_value,'^[+-]?\d+'))/24;
      WHEN REGEXP_LIKE(l_value,'^([+-]?\d+)[tT]$') THEN
        l_date := SYSDATE + TO_NUMBER(REGEXP_SUBSTR(l_value,'^[+-]?\d+'));
      WHEN REGEXP_LIKE(l_value,'^([+-]?\d+)[wW]$') THEN
        l_date := SYSDATE + TO_NUMBER(REGEXP_SUBSTR(l_value,'^[+-]?\d+'))*7;
      WHEN REGEXP_LIKE(l_value,'^([+-]?\d+)[mM]$') THEN
        l_date := ADD_MONTHS(SYSDATE,TO_NUMBER(REGEXP_SUBSTR(l_value,'^[+-]?\d+')));
      WHEN REGEXP_LIKE(l_value,'^([+-]?\d+)[jJ]$') THEN
        l_date := ADD_MONTHS(SYSDATE,TO_NUMBER(REGEXP_SUBSTR(l_value,'^[+-]?\d+'))*12);
    END CASE;
    l_date_c := TO_CHAR(l_date,l_date_format_mask);
  ELSIF REGEXP_LIKE(l_value,'^\d{1,2}.\d{1,2}$') THEN
    BEGIN
      l_date_c := TO_CHAR(TO_DATE(l_value || '.' || TO_CHAR(SYSDATE,'YYYY'),'DD.MM.YYYY'),l_date_format_mask);
    EXCEPTION
      WHEN OTHERS THEN
        l_date_c := 'Datum falsch';
    END;
  ELSIF REGEXP_LIKE(l_value,'^\d{1,2}.\d{1,2}.\d{1,2}$') THEN
    BEGIN
      l_date_c := TO_CHAR(TO_DATE(l_value,'DD.MM.RR'),l_date_format_mask);
    EXCEPTION
      WHEN OTHERS THEN
        l_date_c := 'Datum falsch';
    END;
  ELSIF REGEXP_LIKE(l_value,'^\d{1,2}.[[:alnum:]]{3}$') THEN
    BEGIN
      l_date_c := TO_CHAR(TO_DATE(l_value || '.' || TO_CHAR(SYSDATE,'YYYY'),'DD.MON.YYYY'),l_date_format_mask);
    EXCEPTION
      WHEN OTHERS THEN
        l_date_c := 'Datum falsch';
    END;
  ELSIF UPPER(l_value) LIKE 'H%' THEN -- Heute
    l_date_c := TO_CHAR(SYSDATE,l_date_format_mask);
  ELSIF UPPER(l_value) LIKE 'G%' THEN -- Gestern
    l_date_c := TO_CHAR(SYSDATE-1,l_date_format_mask);
  ELSIF UPPER(l_value) LIKE 'V%' THEN -- Vorgestern
    l_date_c := TO_CHAR(SYSDATE-2,l_date_format_mask);
  ELSIF UPPER(l_value) LIKE 'M%' THEN -- Morgen
    l_date_c := TO_CHAR(SYSDATE+1,l_date_format_mask);
  ELSIF UPPER(l_value) LIKE 'Ü%' THEN -- Übermorgen
    l_date_c := TO_CHAR(SYSDATE+2,l_date_format_mask);
  ELSIF UPPER(l_value) LIKE 'U%' THEN -- Ultimo
    l_date_c := TO_CHAR(LAST_DAY(SYSDATE),l_date_format_mask);
  END IF;

  apex_util.set_session_state(l_item_name,l_date_c);
  apex_util.json_from_items(l_item_name);
END;

Fertig.

Starten Sie die Seite neu. Sobald Sie z.B. "v" in das (Datums-)Feld eingeben und das Feld verlassen, sollte das gestrige Datum angezeigt werden.

Bearbeiten Sie nun das (Datums-)Feld und wählen als Anzeige z.B. "Datumsauswahl (DD-MM-YYYY HH24:MI)". Rufen Sie die Seite erneut auf und geben Sie z.B. "m" in das (Datums-)Feld ein. Nach Verlassen des Feldes sollte das morgige Datum im gewählten Datumsformat angezeigt werden.

Zurück zur Community-Seite