Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

--- javascript:ajax [15/02/2021 16:39] – Externe Bearbeitung 127.0.0.1
+++ javascript:ajax [15/02/2021 17:17] (aktuell) – Manuel
@@ Zeile 1: / Zeile 1: @@
-====== Joomla - JInput ======
+====== Javascript - Ajax-Request ======
-Zusatzinformationen zu JInput - Joomla-Klasse, um Request-Variablen zu empgangen.
-Offizielle Doku: https://docs.joomla.org/Retrieving_request_data_using_JInput
-===== Klasse =====
-So wird die Klasse aufgerufen:
+===== Fetch =====
-<file php>
+Einen asynchronen Request über Javascript machen mithilfe der Fetch.
-use Joomla\CMS\Factory;
-$input = Factory::getApplication()->input;
-// equivalent of the older format $input = JFactory::getApplication()->input;
-</file>
-==== Eine bestimmte Variable ====
+Docs: https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch
-<file php>
+=== Variablen / Parameter ===
-$name = $input->get('name', 'default', 'filter');
-</file>
-==== Mehrere bestimmte Variablen ====
+<file javascript>
+let formData = new FormData();
+formData.append('input1', 'text1');
+formData.append('input2', 'text2');
-<file php>
+let parameters = {
-$name = $input->getArray(array('p1'=>'int', 'p2'=>'float', 'p3'=>'word'));
+  method: 'POST', // *GET, POST, PUT, DELETE, etc.
-</file>
+  mode: 'same-origin', // no-cors, *cors, same-origin
+  cache: 'default', // *default, no-cache, reload, force-cache, only-if-cached
+  headers: {'Content-Type': 'multipart/form-data'}, // 'Content-Type': 'application/x-www-form-urlencoded',
+  redirect: 'manual', // manual, *follow, error
+  referrerPolicy: 'no-referrer-when-downgrade', // no-referrer, *no-referrer-when-downgrade, origin, ...
+  body: formData // JSON.stringify(data) // (body data type must match "Content-Type" header)
+};
-==== Variablen aus einem Joomla-Formular (JForm) ====
+let url_ident = "https://example.org/path/to/script.php";
-<file php>
-$name = $input->getArray(array( 'jform' => array('title'=>'string', 'quantity'=>'int', 'state'=>'int') ));
 </file>
-==== Eine bestimmte GET-Variable ====
+=== Request ===
-<file php>
+<file javascript>
-$name = $input->get->get('name', 'default', 'filter');
+async function postData(url, parameters) {
-</file>
+  const response = await fetch(url, parameters);
+  if (!response.ok) {
+    if (response.status == 0) {
+      // on network error
+      console.log("Network-Error: " + response.status + ", " + response.statusText);
+    }
+  } else {
+    // on success
+    return response.json();
+  }
+};
-==== Alle vorhandenen Variablen ====
+postData(url_ident, parameters)
+  .then(res => {
-<file php>
+    let data = res.data;
-$name = $input->getArray(array());
+    console.log(data);
+  }
+});
 </file>