Im System EGO CRM werden keine statischen modalen Fenster verwendet, also Fenster, die bereits im HTML-Code gezeichnet und bis zum Öffnen nur versteckt sind. Jedes modale Fenster wird mindestens einmal beim ersten Aufruf gerendert. Das Rendern kann direkt über JS-Code oder via AJAX erfolgen.

Szenarien zum Öffnen eines modalen (aufklappbaren) Fensters:

Bei der Arbeit mit modalen Fenstern werden folgende Parameter verwendet:

Zusätzlich betrachten wir Methoden zum Schließen des modalen Fensters (falls erforderlich):

Zum Anzeigen eines Buttons zum Öffnen eines Modalfensters wird die Methode „btn“ der Klasse „ui::“ verwendet.
Der Methode wird der Parameter „btn_open_modal“ mit einem Array von Parametern für das Modalfenster übergeben oder einfach ein String als Inhalt des Modalfensters.

Ein einfaches Beispiel, wir übergeben dem Parameter «btn_open_modal» einen String – den Inhalt des modalen Fensters.

$args = array();
$args['btn_open_modal'] = '<p>My modal content, only string.</p>';
$args['text'] = 'Open modal';
$args['icon'] = array('window', 'far');
$str .= ui::btn($args);

In diesem Beispiel übergeben wir dem Parameter «btn_open_modal» ein Array mit Parametern des modalen Fensters.

$modal_args = array();
$modal_args['body'] = '<p>My modal content.</p>';
$modal_args['header'] = 'My modal title';
$modal_args['footer'] = 'My footer';
$modal_args['size'] = 'full';
$modal_args['theme'] = 'info';
//===
$args = array();
$args['btn_open_modal'] = $modal_args;
$args['text'] = 'Open modal';
$args['icon'] = array('window', 'far');
$str .= ui::btn($args);

In diesem Beispiel werden auch verwendet:
- draggable: das Fenster kann auf dem Bildschirm verschoben werden
- backdrop=FALSE: das Fenster wird nicht geschlossen, wenn außerhalb geklickt wird.

$modal_args = array();
$modal_args['body'] = '<p>My modal content.</p><p><input name="my_input" class="form-control"></p>';
$modal_args['header'] = 'My modal title';
$modal_args['footer'] = 'My footer';
$modal_args['theme'] = 'warning';
$modal_args['placement'] = 'right';
$modal_args['draggable'] = true;
$modal_args['backdrop'] = false;
//===
$args = array();
$args['btn_open_modal'] = $modal_args;
$args['text'] = 'Open modal';
$args['icon'] = array('window', 'far');
$str .= ui::btn($args);

Dasselbe wie im vorherigen Beispiel, nur mit hinzugefügtem Parameter „oneshot“ mit Wert TRUE.
Beachten Sie, dass bei Verwendung des Parameters „oneshot“ unbedingt ein Parameter „id“ übergeben werden muss.
Verschieben Sie das Fenster an eine andere Position. Geben Sie etwas Text im Eingabefeld des Modalfensters ein, schließen Sie es und öffnen Sie es erneut.

$modal_args = array();
$modal_args['body'] = '<p>My modal content.</p><p><input name="my_input" class="form-control"></p>';
$modal_args['header'] = 'My modal title';
$modal_args['footer'] = 'My footer';
$modal_args['theme'] = 'warning';
$modal_args['placement'] = 'right';
$modal_args['draggable'] = true;
$modal_args['backdrop'] = false;
$modal_args['id'] = set_id('my_modal_with_oneshot_ui');
$modal_args['oneshot'] = true;
//===
$args = array();
$args['btn_open_modal'] = $modal_args;
$args['text'] = 'Open modal';
$args['icon'] = array('window', 'far');
$str .= ui::btn($args);

Öffnen des Modalfensters über JS.
Erstellen eines Buttons und Zuweisen eines Handlers. Im JS-Handler wird der Helfer $$.oj_modal() mit Parametern für das Modalfenster verwendet.

Beachten Sie, dass der Helfer „$$.oj_modal()“ ein jQuery-Objekt des Modalfensters zurückgibt.
Das ist wichtig, falls später noch mit dem Modalfensterobjekt gearbeitet werden soll.
Im Beispiel geben wir das Modalfensterobjekt in der Konsole aus.

$args = array();
$args['handler_click'] = 'my_open_modal';
$args['text'] = 'Open modal';
$args['icon'] = array('blinds-open', 'far');
$str .= ui::btn($args);
$$.my_open_modal = function(){
	var modal_pars={};
	modal_pars.body = 'My content in modal from js.';
	modal_pars.size = 'sm';
	var modalObj = $$.oj_modal(modal_pars);
	console.log('modalObj', modalObj);
	return true;
}
$args = array();
$args['handler_click'] = 'my_open_modal_variant';
$args['text'] = 'Open modal';
$args['icon'] = array('blinds-open', 'far');
$str .= ui::btn($args);
$$.my_open_modal_variant = function(){
	var modal_pars={};
	modal_pars.body = 'My content in modal from js.';
	modal_pars.size = 'lg';
	modal_pars.draggable = true;
	modal_pars.backdrop = false;
	$$.oj_modal(modal_pars);
	return true;
}

In diesem Beispiel schließen wir im js-Handler das Modalfenster nach 1 Sekunde mit dem Helfer „$$.oj_modal_close()“.
Wenn keine Parameter an den Helfer übergeben werden, werden alle Modalfenster geschlossen.
Wenn mehrere Fenster geöffnet sind und nur ein bestimmtes geschlossen werden soll, übergeben Sie dem Helfer die ID des Modalfensters oder ein jQuery-Objekt dieses Fensters.

$args = array();
$args['handler_click'] = 'my_open_modal_and_close';
$args['text'] = 'Open modal';
$args['icon'] = array('blinds-open', 'far');
$str .= ui::btn($args);
$$.my_open_modal_and_close = function(){
	var modal_pars={};
	modal_pars.body = 'My content in modal from js.';
	modal_pars.theme = 'info';
	var modalObj = $$.oj_modal(modal_pars);
	setTimeout(function(){
		$$.oj_modal_close(modalObj);
	}, 1000);
	return true;
}

Der Inhalt des zukünftigen Modalfensters befindet sich in einem versteckten HTML-Element.
Anstelle des Parameters „body“ im Parameter-Array des Modalfensters wird der Parameter „body_from“ verwendet, dem die ID des DOM-Elements mit dem Modalfensterinhalt übergeben wird.

In diesem Beispiel erstellen wir den Button zum Öffnen des Modalfensters mit der Klasse

My modal content from hidden block.

Doppelklick zum Löschen des Feldes ausführenENTER zum Speichern drücken
//=== Hidden block with content for modal
$str .= '<div id="'.set_id('my_modal_content').'" class="d-none">';
	$str .= e_p('My modal content from hidden block.', 'mb-3');
	$args = array();
	$args['name'] = 'my_input';
	$str .= ui::input_with_save($args);
$str .= '</div>';

//=== Button
$modal_args = array();
$modal_args['body_from'] = find_ele('my_modal_content');
$modal_args['header'] = 'My modal title';
$modal_args['draggable'] = true;
//===
$args = array();
$args['btn_open_modal'] = $modal_args;
$args['text'] = 'Open modal';
$args['icon'] = array('code', 'far');
$str .= ui::btn($args);

Im Beispiel öffnen wir das modale Fenster mit JS.

My modal content from hidden block.

Doppelklick zum Löschen des Feldes ausführenENTER zum Speichern drücken
//=== Hidden block with content for modal
$str .= '<div id="'.set_id('my_modal_content').'" class="d-none">';
	$str .= e_p('My modal content from hidden block.', 'mb-3');
	$args = array();
	$args['name'] = 'my_input';
	$str .= ui::input_with_save($args);
$str .= '</div>';

//=== Button
$args = array();
$args['handler_click'] = 'my_open_modal_body_from';
$args['text'] = 'Open modal';
$args['icon'] = array('code', 'far');
$str .= ui::btn($args);
$$.my_open_modal_body_from = function(){
	var modal_pars={};
	modal_pars.body_from = $$.find_ele('my_modal_content');
	modal_pars.size = false;
	modal_pars.theme = 'secondary';
	$$.oj_modal(modal_pars);
	return true;
}

Der Inhalt des Modalfensters wird auf dem Server im PHP-Code generiert.
Dem Button wird ein Handler zugewiesen.
Im Handler auf dem Server wird der Helfer „oj_modal()“ verwendet, um den vorbereiteten Inhalt für das Modalfenster zurückzugeben.

Im Server-Handler erstellen wir den String des modalen Fensters und übergeben dem Helfer «oj_modal()» ein Array mit Parametern des modalen Fensters.

$args = array();
$args['handler_click'] = 'my_open_modal_ajax';
$args['text'] = 'Open modal';
$args['icon'] = array('server', 'far');
$str .= ui::btn($args);
public function my_open_modal_ajax() {
	$str = '';
	$str .= e_p('Modal content');
	$str .= e_p('Time: '.time());
	$header_str = mlang('my_header', 1);
	//===
	$modal_pars = array(
			'body'=>$str
		, 'header'=>$header_str
		, 'size'=>'lg'
		, 'theme'=>'primary'
		, 'draggable'=>true
	);
	oj_modal($modal_pars);
}

Dasselbe, nur mit hinzugefügtem Parameter „oneshot“.
Beachten Sie, dass bei Verwendung des Parameters „oneshot“ unbedingt ein Parameter „id“ übergeben werden muss.
Beachten Sie die Zeit im Modalfenster nach dem Schließen und erneuten Öffnen des Fensters.

$args = array();
$args['handler_click'] = 'my_open_modal_ajax_oneshot';
$args['text'] = 'Open modal';
$args['icon'] = array('server', 'far');
$str .= ui::btn($args);
public function my_open_modal_ajax_oneshot() {
	$str = '';
	$str .= e_p('Modal content');
	$str .= e_p('Time: '.time());
	$header_str = mlang('my_header', 1);
	//===
	$modal_pars = array(
			'body'=>$str
		, 'header'=>$header_str
		, 'size'=>'lg'
		, 'theme'=>'primary'
		, 'draggable'=>true
		, 'id'=>set_id('my_modal_with_oneshot_ajax')
		, 'oneshot'=>true
	);
	oj_modal($modal_pars);
}

Im Server-Handler erstellen wir den String des modalen Fensters und übergeben dem Helfer «oj_modal()» nur den erstellten String.

$args = array();
$args['handler_click'] = 'my_open_modal_ajax_only_string';
$args['text'] = 'Open modal';
$args['icon'] = array('server', 'far');
$str .= ui::btn($args);
public function my_open_modal_ajax_only_string() {
	$str = '';
	$str .= e_p('Modal content');
	$str .= e_p('Time: '.time());
	oj_modal($str);
}

Wir verwenden den Parameter «_close_parent_modal» in verschiedenen Szenarien, um das übergeordnete modale Fenster zu schließen, in dem sich die Schaltfläche oder das Feld mit dem Handler befindet, wenn der Handler ausgeführt wird.

In diesem Beispiel verwenden wir Ajax zur Erstellung des Modalfensterinhalts.
Im Modalfenster erstellen wir ein Feld mit der Klasse „ui::“ und übergeben der Methode zur Erstellung des Feldes den Parameter „_close_parent_modal“.
Das Modalfenster wird nur geschlossen, wenn kein Fehler vorliegt.
Versuchen Sie, ein leeres Feld zu speichern.

$args = array();
$args['handler_click'] = 'my_open_modal_close_parent_modal_1';
$args['text'] = 'Open modal';
$args['icon'] = array('eye', 'far');
$str .= ui::btn($args);
public function my_open_modal_close_panent_modal_1() {
	$str = '';
	$args = array();
	$args['name'] = 'my_input_1';
	$args['_close_parent_modal'] = true;
	$str .= ui::input_with_save($args);
	//===
	oj_modal($str);
}
public function save_my_input_1() {
	$val = ui::get_post_VAL();
	if(!empty($val)) {
		$success_text = 'VALUE: '.$val;
		//===
		ojsucc($success_text);
	}
	else ojerr(mlang('s_error__field_empty_warn', 1));
}

In diesem Beispiel verwenden wir ebenfalls Ajax zur Erstellung des Modalfensterinhalts.
Allerdings verwenden wir beim Erstellen des Feldes für das Modalfenster mit der Klasse „ui::“ den Parameter „_close_parent_modal“ nicht.
Wir verwenden den Parameter „_close_parent_modal“ im zurückgegebenen Helfer „oj_ret()“ direkt im Speichervorgang des Feldes.
Das Modalfenster wird somit nur geschlossen, wenn in den zurückgegebenen Daten nach der Verarbeitung eine Anweisung zum Schließen vorliegt.
In diesem Beispiel schließen wir das Fenster nur bei erfolgreicher Operation.

$args = array();
$args['handler_click'] = 'my_open_modal_close_parent_modal_2';
$args['text'] = 'Open modal';
$args['icon'] = array('eye', 'far');
$str .= ui::btn($args);
public function my_open_modal_close_panent_modal_2() {
	$str = '';
	$args = array();
	$args['name'] = 'my_input_2';
	$str .= ui::input_with_save($args);
	//===
	oj_modal($str);
}
public function save_my_input_2() {
	$val = ui::get_post_VAL();
	if(!empty($val)) {
		$success_text = 'VALUE: '.$val;
		//===
		oj_ret('_close_parent_modal', true);
		//===
		ojsucc($success_text);
	}
	else ojerr(mlang('s_error__field_empty_warn', 1));
}

Das Gleiche wie im vorherigen Beispiel, nur verwenden wir jetzt «oj_ret('_close_parent_modal')», um das modale Fenster in jedem Fall zu schließen, auch bei Fehlern.

$args = array();
$args['handler_click'] = 'my_open_modal_close_parent_modal_3';
$args['text'] = 'Open modal';
$args['icon'] = array('eye', 'far');
$str .= ui::btn($args);
public function my_open_modal_close_panent_modal_3() {
	$str = '';
	$args = array();
	$args['name'] = 'my_input_3';
	$str .= ui::input_with_save($args);
	//===
	oj_modal($str);
}
public function save_my_input_3() {
	$val = ui::get_post_VAL();
	//===
	oj_ret('_close_parent_modal', true);
	//===
	if(!empty($val)) {
		$success_text = 'VALUE: '.$val;
		//===
		ojsucc($success_text);
	}
	else ojerr(mlang('s_error__no_data', 1));
}

Spezielle Parameter, ähnlich wie «btn_open_modal», zum Öffnen von Mediendateien (Audio, Video, Text und PDF) im modalen Fenster unter Berücksichtigung des Medientyps.

Öffnen eines Bildes im Modalfenster.
Wir verwenden dieselben Parameter für das Modalfenster im Array für den Parameter „btn_open_img“, außer:
„body“ und „body_from“. Stattdessen muss der Parameter „src“ mit dem Bildlink übergeben werden (siehe Dokumentation zum Bildlink).

Wir verwenden einen Button, der mit der Klasse „ui::“ erstellt wurde.
Dem Parameter „btn_open_img“ übergeben wir ein Array mit Parametern für das Modalfenster.

$img_args = array();
$img_args['src'] = media_link('3e1861d3864ba55b27a8');
$img_args['theme'] = 'primary';
$img_args['draggable'] = true;
$img_args['id'] = set_id('my_modal_100');
$img_args['oneshot'] = true;
//===
$args = array();
$args['btn_open_img'] = $img_args;
$args['text'] = 'Open image';
$args['icon'] = array('image', 'far');
$str .= ui::btn($args);

Wir verwenden einen Button, der mit der Klasse „ui::“ erstellt wurde.
Dem Parameter „btn_open_img“ übergeben wir nur einen String mit dem Link.

$args = array();
$args['btn_open_img'] = media_link('c1c3ad469424684ae939');
$args['text'] = 'Open image';
$args['icon'] = array('image', 'far');
$str .= ui::btn($args);

Wir verwenden eine Ajax-Anweisung zum Öffnen eines Bildes im Modalfenster. Im Handler auf dem Server verwenden wir den Helfer „oj_img()“.
In diesem Beispiel übergeben wir dem Helfer ein Array mit Parametern für das Modalfenster.
Beachten Sie, dass der Helfer „oj_img()“ bedingt finalisierend ist, d. h. standardmäßig beendet er das Skript und sendet die Daten via Ajax (exit). Um das Skript nicht zu beenden, übergeben Sie als zweiten Parameter FALSE, wie in diesem Beispiel gezeigt, um nach dem Helfer auch eine Meldung (ojsucc()) zu senden.

$args = array();
$args['handler_click'] = 'my_handler_and_open_img_3';
$args['text'] = 'Action';
$args['icon'] = array('image', 'far');
$str .= ui::btn($args);
public function my_handler_and_open_img_3() {
	$img_pars = array(
			'src'=>media_link('674f1e5c680c360b6d64')
		, 'header'=>'My image'
		, 'size'=>'lg'
		, 'theme'=>'warning'
		, 'draggable'=>true
		, 'auto_close'=>1200
	);
	oj_img($img_pars, false);
	ojsucc(true, 1200);
}

Wie im vorherigen Beispiel verwenden wir den Helfer „oj_img()“.
Allerdings übergeben wir in diesem Beispiel dem Helfer nur den Bildlink.

$args = array();
$args['handler_click'] = 'my_handler_and_open_img_4';
$args['text'] = 'Action';
$args['icon'] = array('image', 'far');
$str .= ui::btn($args);
public function my_handler_and_open_img_4() {
	oj_img(media_link('011ab21242e86e7d7635'));
}

Öffnen eines Bildes direkt aus dem JS-Code.
Dazu verwenden wir im js-Handler den Helfer „$$.oj_img()“.
Dem Helfer kann entweder ein Objekt mit Parametern für das Modalfenster oder nur der Bildlink übergeben werden.

$args = array();
$args['handler_click'] = 'my_open_img_in_js';
$args['text'] = 'Open image';
$args['icon'] = array('image', 'far');
$str .= ui::btn($args);
$$.my_open_img_in_js = function(){
	var img_pars={};
	img_pars.src = $$.media_link('d0123b5368a11f8fed76');
	img_pars.theme = 'secondary';
	img_pars.draggable = true;
	img_pars.id = $$.set_id('my_modal_img_js');
	img_pars.oneshot = true;
	$$.oj_img(img_pars);
	return true;
}

Öffnen eines Youtube-Videos im Modalfenster.
Wir verwenden dieselben Parameter für das Modalfenster im Array für den Parameter „btn_open_youtube“, außer:
„body“ und „body_from“. Stattdessen muss der Parameter „src“ mit der Youtube-Video-ID übergeben werden.

Spezielle zusätzliche Parameter.

  • Seitenverhältnis des Videos, Parameter «aspect_ratio». In diesen Parameter können Sie einen der folgenden Werte übergeben:

    «21by9», «16by9», «4by3», «1by1» Standard: «16by9».

  • Parameter des Youtube-Players. Informationen zu den Parametern finden Sie in der Youtube-Player-Dokumentation.

    Diese Parameter umfassen:

    «youtube_autoplay», «youtube_cc_load_policy», «youtube_controls», «youtube_disablekb», «youtube_end», «youtube_fs», «youtube_iv_load_policy», «youtube_rel», «youtube_showinfo», «youtube_start»

Wir verwenden einen Button, der mit der Klasse „ui::“ erstellt wurde.
Dem Parameter „btn_open_youtube“ übergeben wir ein Array mit Parametern für das Modalfenster.

$youtube_args = array();
$youtube_args['src'] = 'zpOULjyy-n8';
$youtube_args['draggable'] = true;
$youtube_args['youtube_disablekb'] = true;
//===
$args = array();
$args['btn_open_youtube'] = $youtube_args;
$args['text'] = 'Open youtube video';
$args['icon'] = array('tv', 'far');
$str .= ui::btn($args);

Wir verwenden einen Button, der mit der Klasse „ui::“ erstellt wurde.
Dem Parameter „btn_open_youtube“ übergeben wir nur die Youtube-Video-ID.

$args = array();
$args['btn_open_youtube'] = 'zpOULjyy-n8';
$args['text'] = 'Open youtube video';
$args['icon'] = array('tv', 'far');
$str .= ui::btn($args);

Wir verwenden eine Ajax-Anweisung zum Öffnen eines Youtube-Videos im Modalfenster. Im Handler auf dem Server verwenden wir den Helfer „oj_youtube()“.
In diesem Beispiel übergeben wir dem Helfer ein Array mit Parametern für das Modalfenster.
Beachten Sie, dass der Helfer „oj_youtube()“ bedingt finalisierend ist, d. h. standardmäßig beendet er das Skript und sendet die Daten via Ajax (exit). Um das Skript nicht zu beenden, übergeben Sie als zweiten Parameter FALSE, wie in diesem Beispiel gezeigt, um nach dem Helfer auch eine Meldung (ojsucc()) zu senden.

$args = array();
$args['handler_click'] = 'my_handler_and_open_youtube_3';
$args['text'] = 'Action';
$args['icon'] = array('tv', 'far');
$str .= ui::btn($args);
public function my_handler_and_open_youtube_3() {
	$youtube_pars = array(
			'src'=>'zpOULjyy-n8'
		, 'header'=>'My Youtube video'
		, 'size'=>'lg'
		, 'theme'=>'warning'
		, 'draggable'=>true
		, 'auto_close'=>2500
		, 'youtube_autoplay'=>false
	);
	oj_youtube($youtube_pars, false);
	ojsucc(true, 1200);
}

Wie im vorherigen Beispiel verwenden wir den Helfer „oj_youtube()“.
Allerdings übergeben wir in diesem Beispiel dem Helfer nur die Youtube-Video-ID.

$args = array();
$args['handler_click'] = 'my_handler_and_open_youtube_4';
$args['text'] = 'Action';
$args['icon'] = array('tv', 'far');
$str .= ui::btn($args);
public function my_handler_and_open_youtube_4() {
	oj_youtube('zpOULjyy-n8');
}

Öffnen des Youtube-Videos direkt aus dem JS-Code.
Dafür verwenden wir im JS-Handler den Helfer «$$.oj_youtube()».
Dem Helfer kann analog zu den vorherigen Beispielen ein Objekt mit Parametern des modalen Fensters oder nur die Youtube-Video-ID übergeben werden.
Beachten Sie, dass in diesem Beispiel auch der Parameter «oneshot» verwendet wird (ebenfalls muss der Parameter «id» übergeben werden), weshalb das Youtube-Video-Fenster nicht zerstört, sondern nur geschlossen wird, wodurch die Wiedergabe pausiert wird.

$args = array();
$args['handler_click'] = 'my_open_youtube_in_js';
$args['text'] = 'Open youtube video';
$args['icon'] = array('tv', 'far');
$str .= ui::btn($args);
$$.my_open_youtube_in_js = function(){
	var youtube_pars={};
	youtube_pars.src = 'zpOULjyy-n8';
	youtube_pars.id = $$.set_id('my_modal_youtube_oneshot');
	youtube_pars.oneshot = true;
	youtube_pars.theme = 'secondary';
	youtube_pars.draggable = true;
	$$.oj_youtube(youtube_pars);
	return true;
}

Öffnet je nach Typ Audio-, Video- oder Textdateien.
Wir verwenden dieselben Parameter für das Modalfenster im Array für den Parameter „btn_open_youtube“, außer:
„body“ und „body_from“. Stattdessen muss der Parameter „src“ mit dem Link zur Datei übergeben werden.

Spezielle zusätzliche Parameter.

  • * Pflichtparameter, Medientyp «media_ident». Dieser Parameter erklärt den Skripten, wie die Datei geöffnet werden soll. Verwenden Sie einen der folgenden Typen:

    • audio: öffnen zum Abspielen einer Audiodatei
    • video: öffnen zum Ansehen einer Videodatei
    • text: öffnen zum Ansehen einer Textdatei
    • pdf: öffnen zum Ansehen einer PDF-Datei

Dem Parameter «btn_open_media» kann daher nur ein Array übergeben werden, das zwei Pflichtparameter enthält: «src» und «media_ident».

Wir verwenden einen Button, der mit der Klasse „ui::“ erstellt wurde.
In diesem Beispiel hören wir Audio.

$media_args = array();
$media_args['src'] = media_link('dffe554669f542d8c1d2');
$media_args['media_ident'] = 'audio';
$media_args['theme'] = 'primary';
$media_args['draggable'] = true;
$media_args['id'] = set_id('my_modal_audio');
$media_args['oneshot'] = true;
//===
$args = array();
$args['btn_open_media'] = $media_args;
$args['text'] = 'Open audio';
$args['icon'] = array('music', 'far');
$str .= ui::btn($args);

Wir verwenden einen Button, der mit der Klasse „ui::“ erstellt wurde.
In diesem Beispiel öffnen wir eine Textdatei.

$media_args = array();
$media_args['src'] = media_link('11a22a2a4488978d63a2');
$media_args['media_ident'] = 'text';
$media_args['size'] = 'lg';
//===
$args = array();
$args['btn_open_media'] = $media_args;
$args['text'] = 'Open text file';
$args['icon'] = array('file-alt', 'far');
$str .= ui::btn($args);

Wir verwenden eine Ajax-Anweisung zum Öffnen einer Mediendatei im Modalfenster. Im Handler auf dem Server verwenden wir den Helfer „oj_media()“.
Beachten Sie, dass der Helfer „oj_media()“ bedingt finalisierend ist, d. h. standardmäßig beendet er das Skript und sendet die Daten via Ajax (exit). Um das Skript nicht zu beenden, übergeben Sie als zweiten Parameter FALSE, wie in diesem Beispiel gezeigt, um nach dem Helfer auch eine Meldung (ojsucc()) zu senden.
In diesem Beispiel öffnen wir eine pdf-Datei.

$args = array();
$args['handler_click'] = 'my_handler_and_open_media_3';
$args['text'] = 'Open PDF-file';
$args['icon'] = array('file-pdf', 'far');
$str .= ui::btn($args);
public function my_handler_and_open_media_3() {
	$media_pars = array(
			'src'=>media_link('1e43b08a10407efcc57a')
		, 'media_ident'=>'pdf'
		, 'header'=>'My PDF'
		, 'theme'=>'primary'
		, 'draggable'=>true
	);
	oj_media($media_pars, false);
	ojsucc(true, 1200);
}

Öffnen einer Mediendatei direkt aus dem JS-Code.
Dazu verwenden wir im js-Handler den Helfer „$$.oj_media()“.
In diesem Beispiel öffnen wir ein Video.

$args = array();
$args['handler_click'] = 'my_handler_and_open_media_4';
$args['text'] = 'Open video file';
$args['icon'] = array('video', 'far');
$str .= ui::btn($args);
$$.my_handler_and_open_media_4 = function(){
	var media_pars={};
	media_pars.src = $$.media_link('a83d9e3079530dc4edc2');
	media_pars.media_ident = 'video';
	media_pars.theme = 'secondary';
	media_pars.id = $$.set_id('my_media_video');
	media_pars.oneshot = true;
	$$.oj_media(media_pars);
	return true;
}