Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? – SELFHTML-Forum Forum als Ergänzung zum SELFHTML-Wiki und zur Dokumentation SELFHTML https://forum.selfhtml.org/self Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Fri, 04 Mar 22 22:09:15 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1796934#m1796934 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1796934#m1796934 <p>Hallo, ich habe bei einem älteren Beitrag dargestellt, wie ich Tabs erstellt habe, die mithilfe von AJAX dynamisch den Content wechseln. Diese Methode ist für mich aus zwei Gründen suboptimal: 1. Die Browser-Funktion <em>Seitenquelltext anzeigen</em> zeigt mir den dynamisch geladenen Content nicht an. 2. Der Tab-Content lässt sich nicht gezielt über die URL aufrufen (wobei dies sicherlich auch noch irgendwie zu lösen wäre).</p> <p>Stattdessen hätte ich gerne, dass z.B. die URL …/games/demons-souls?mods mir auch direkt als Tab-Content den Inhalt von mods.php anzeigt.</p> <p>Zwar weiß ich, dass das mit URL-Parametern gehen soll, aber leider haben meine bisherigen Recherchen mir nicht sagen können, wie genau ich das bewerkstelligen kann. Falls jemand einen Tipp für mich hat, wo ich ein Tutorial dazu finde, wäre ich sehr dankbar.</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Sat, 05 Mar 22 06:48:06 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1796944#m1796944 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1796944#m1796944 <p>Hello,</p> <p>ich habe deinen Beitrag jetzt mindestens fünfmal gelesen und versucht, ihn auch mit Hilfe der verlinkten Seite zu verstehen.</p> <p>Die macht leider erstmal meinen ganzen Browserinhalt (Hintergrund nebst Navigation) schwarz, was ich auf den Tod nicht leiden kann.</p> <p>Da auch noch niemand Anderes geantwortet hat, schlage ich vor, dass Du uns ein paar Skizzen zeichnest, scannst und uploadest und den zeitlichen Ablauf dazwischen markierst.</p> <p>Was soll</p> <ul> <li>wann</li> <li>wie</li> <li>wodurch (welche Benutzerhandlungen, welche Daten, ...)</li> </ul> <p>aussehen?</p> <p>Das ist jetzt kein Joke, sondern ein praktikabler Weg, seine Ziele zu formulieren, um dann zu Lösungsvorschlägen zu kommen.</p> <p>Die Aufteilung der Requests in POST, GET, URL oder AJAX im Hintergund will durchaus intelligent geplant sein, und dass Du <strong>jetzt</strong> danach fragst, wie das geht, ist durchaus intelligent!</p> <blockquote> <p>Stattdessen hätte ich gerne, dass z.B. die URL …/games/demons-souls?mods mir auch direkt als Tab-Content den Inhalt von mods.php anzeigt.</p> </blockquote> <p>Glück Auf<br> Tom vom Berg</p> <div class="signature">-- <br> Es gibt nichts Gutes, außer man tut es!<br> Das Leben selbst ist der Sinn. </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Sat, 05 Mar 22 07:04:42 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1796946#m1796946 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1796946#m1796946 <p>Tach!</p> <blockquote> <ol> <li>Die Browser-Funktion <em>Seitenquelltext anzeigen</em> zeigt mir den dynamisch geladenen Content nicht an.</li> </ol> </blockquote> <p>Ja, das ist der Quelltext, der vom Server kam. Daraus erzeugt der Browser das DOM und rendert es anschließend zu dem, was man sieht. Bereits Fehlerkorrekturen der Browser können das DOM anders aussehen lassen als was du im Quelltext stehen hattest.</p> <p>Wenn du das DOM manipulierst, was du durch das Nachladen und Einfügen von Inhalt machst, ändert sich nicht der Quelltext, und er wird auch nicht zurückgerechnet. Wenn du dir was anschauen willst, kannst du in den Entwickler-Tools den jeweiligen Stand des DOM inspizieren. Wenn du sehen möchtest, was dein Browser anfragt und was dein Server antwortet, kannst du das im Netzwerk-Tab der Entwickler-Tools untersuchen.</p> <blockquote> <ol start="2"> <li>Der Tab-Content lässt sich nicht gezielt über die URL aufrufen (wobei dies sicherlich auch noch irgendwie zu lösen wäre).</li> </ol> </blockquote> <p>Ja, das ist erstmal so, solange du die <a href="https://wiki.selfhtml.org/wiki/JavaScript/History" rel="nofollow noopener noreferrer">History</a> nicht entsprechend anpasst. Der Browser weiß ja ncht, wie relevant deine Manipulationen für die Navigation durch deine Inhalte sind.</p> <p>dedlfix.</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Sat, 05 Mar 22 09:54:02 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1796954#m1796954 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1796954#m1796954 <p>Hallo borisbaer,</p> <blockquote> <p>Stattdessen hätte ich gerne, dass z.B. die URL …/games/demons-souls?mods mir auch direkt als Tab-Content den Inhalt von mods.php anzeigt.</p> </blockquote> <p>Das setzt voraus, dass mods.php keine vollständige HTML Seite liefert, sondern nur das HTML Fragment, das in den Tab hinein soll.</p> <p>Im Haupt-PHP Script, das die Rahmenseite liefert, kannst Du mit isset($_GET['mods']) abfragen, ob ein Parameter namens mods vorhanden ist. Das ist allerdings umständlich, weil Du für jede Page eine eigene Abfrage brauchst. Wenn Du <strong>nur</strong> den Pagename angeben willst, guck Dir $_SERVER['QUERY_STRING'] an und prüfe, ob der Wert in einer Liste erlaubter Pages steht, bevor Du die Page inkludierst.</p> <p>Wenn der Parameter dann identifiziert ist, kannst Du im PHP an der Stelle, wo die Page eingebunden werden muss, sie einfach mit include hereinholen.</p> <p>Clientseitig kannst Du, wie Dedlfix sagte, durch Zugriffe auf das History-API dafür sorgen, dass ein Page-Wechsel sich in URL und URL-Historie niederschlägt.</p> <h3>ABER</h3><p>Ich würde das nicht tun. Bei einer Ajax-getriebenen Seite kannst Du auch URLs mit Hash-Teil vewenden: …/games/demons-souls#mods</p> <p>Diesen Hash-Teil kannst Du am Client auswerten und die Page per AJAX hereinholen. Das musst Du beim Start der Seite tun, und bei URL-Änderungen die Page anpassen. Dazu gibt's die <a href="https://wiki.selfhtml.org/wiki/JavaScript/DOM/Event/hashchange" rel="nofollow noopener noreferrer">hashchange</a> und <a href="https://wiki.selfhtml.org/wiki/JavaScript/DOM/Event/popstate" rel="nofollow noopener noreferrer">popstate</a> Events auf dem window Objekt.</p> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Tue, 08 Mar 22 13:40:33 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797118#m1797118 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797118#m1797118 <p>Entschuldige bitte die späte Antwort, bei meiner Familie und mir ist Corona ausgebrochen mitsamt Grippe-Symptomen.</p> <blockquote> <p>Die macht leider erstmal meinen ganzen Browserinhalt (Hintergrund nebst Navigation) schwarz, was ich auf den Tod nicht leiden kann.</p> </blockquote> <p>Das habe ich nun geändert, danke für den Hinweis!</p> <blockquote> <p>Da auch noch niemand Anderes geantwortet hat, schlage ich vor, dass Du uns ein paar Skizzen zeichnest, scannst und uploadest und den zeitlichen Ablauf dazwischen markierst.</p> <p>Was soll</p> <ul> <li>wann</li> <li>wie</li> <li>wodurch (welche Benutzerhandlungen, welche Daten, ...)</li> </ul> <p>aussehen?</p> </blockquote> <p>Für Skizzen fehlt mir momentan die Energie, aber ich versuche es besser zu erklären: Ich möchte, dass jeder Tab (Spiel, Releases, Merchandise, Guides usw.) der jeweilige Inhalt aus einer separaten .php-Datei in demselben Ordner geladen wird. Wenn ich also auf <em>Releases</em> klicke, dann soll in ein bestimmtes <em>div</em> der Inhalt der Datei <em>releases.php</em> geladen werden. Bisher funktioniert das mit einem AJAX-Script bei mir, nämlich dem Folgenden:</p> <pre><code class="block language-javascript"><span class="token comment">// A J A X - T A B S</span> <span class="token function">$</span><span class="token punctuation">(</span> <span class="token string">"#tabs .tab"</span> <span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">click</span><span class="token punctuation">(</span><span class="token keyword">function</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token comment">// h i g h l i g h t - c u r r e n t - t a b</span> <span class="token function">$</span><span class="token punctuation">(</span> <span class="token keyword">this</span> <span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">addClass</span><span class="token punctuation">(</span> <span class="token string">"current"</span> <span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">siblings</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">removeClass</span><span class="token punctuation">(</span> <span class="token string">"current"</span> <span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// m a i n : a d d - c u r r e n t - i d</span> <span class="token keyword">var</span> main <span class="token operator">=</span> <span class="token function">$</span><span class="token punctuation">(</span> <span class="token string">"#tabs a[href].current"</span> <span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">attr</span><span class="token punctuation">(</span> <span class="token string">"href"</span> <span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token function">$</span><span class="token punctuation">(</span> <span class="token string">"main"</span> <span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">attr</span><span class="token punctuation">(</span> <span class="token string">"id"</span><span class="token punctuation">,</span> main <span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// l o a d - a j a x - c o n t e n t</span> $<span class="token punctuation">.</span><span class="token function">ajax</span><span class="token punctuation">(</span> <span class="token punctuation">{</span> <span class="token literal-property property">url</span><span class="token operator">:</span> <span class="token keyword">this</span><span class="token punctuation">.</span>href<span class="token punctuation">,</span> <span class="token function-variable function">success</span><span class="token operator">:</span> <span class="token keyword">function</span><span class="token punctuation">(</span> <span class="token parameter">html</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token function">$</span><span class="token punctuation">(</span> <span class="token string">"#append"</span> <span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">empty</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">append</span><span class="token punctuation">(</span> html <span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">return</span> <span class="token boolean">false</span><span class="token punctuation">;</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// A C T I V E - A J A X - T A B</span> <span class="token keyword">var</span> url <span class="token operator">=</span> <span class="token function">$</span><span class="token punctuation">(</span> <span class="token string">"#tabs a[href].current"</span> <span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">attr</span><span class="token punctuation">(</span> <span class="token string">"href"</span> <span class="token punctuation">)</span><span class="token punctuation">;</span> $<span class="token punctuation">.</span><span class="token function">ajax</span><span class="token punctuation">(</span> <span class="token punctuation">{</span> <span class="token literal-property property">url</span><span class="token operator">:</span> url<span class="token punctuation">,</span> <span class="token function-variable function">success</span><span class="token operator">:</span> <span class="token keyword">function</span><span class="token punctuation">(</span> <span class="token parameter">html</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token comment">// m a i n : a d d - c u r r e n t - i d</span> <span class="token keyword">var</span> main <span class="token operator">=</span> <span class="token function">$</span><span class="token punctuation">(</span> <span class="token string">"#tabs a[href].current"</span> <span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">attr</span><span class="token punctuation">(</span> <span class="token string">"href"</span> <span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token function">$</span><span class="token punctuation">(</span> <span class="token string">"main"</span> <span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">attr</span><span class="token punctuation">(</span> <span class="token string">"id"</span><span class="token punctuation">,</span> main <span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// l o a d - a j a x - c o n t e n t</span> <span class="token function">$</span><span class="token punctuation">(</span> <span class="token string">"#append"</span> <span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">empty</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">append</span><span class="token punctuation">(</span> html <span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre> <blockquote> <p>Die Aufteilung der Requests in POST, GET, URL oder AJAX im Hintergund will durchaus intelligent geplant sein, und dass Du <strong>jetzt</strong> danach fragst, wie das geht, ist durchaus intelligent!</p> </blockquote> <p>Momentan läuft mehr oder weniger nur diese eine Seite zum Testen. Ich versuche herauszufinden, wie ich den Inhalt der Webseite so strukturieren kann, dass die einzelnen Elemente möglichst dynamisch sind. Sie soll darauf ausgelegt sein, potenziell mehrere hundert Einzelseiten zu beinhalten (sehr ambitioniert, ich weiß).</p> <p>Wenn ich dann ein Element irgendwann doch gerne ändern wollte (z.B. dass ich an der Stelle, an der <em>Veröffentlichung</em> steht, doch lieber den Begriff <em>Erscheinungsdatum</em> verwenden möchte), ich diese Änderung nicht bei allen hundert Seiten durchführen muss.</p> <p>Leider bin ich echt ein Noob in puncto Programmiersprachen. Ich bin froh, dass ich überhaupt so weit gekommen bin bisher. Ich versuche meine Kenntnisse zu PHP und JavaScript mit der Zeit auszubauen, aber es läuft eher schleppend. War jetzt sehr viel learning by doing. Ich weiß nicht mal genau, was URL Parameter genau sind (sie wurden mir von Rolf B als bessere Lösung zu AJAX vorgeschlagen) und die Tutorials, die ich bisher gesehen bzw. gelesen habe, hinterlassen viele Fragezeichen. Wie dem auch sei, ich hoffe, dass ich irgendwann durchsteige.</p> <p>Gruß Boris</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Tue, 08 Mar 22 13:52:54 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797120#m1797120 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797120#m1797120 <blockquote> <p>Wenn du das DOM manipulierst, was du durch das Nachladen und Einfügen von Inhalt machst, ändert sich nicht der Quelltext, und er wird auch nicht zurückgerechnet. Wenn du dir was anschauen willst, kannst du in den Entwickler-Tools den jeweiligen Stand des DOM inspizieren. Wenn du sehen möchtest, was dein Browser anfragt und was dein Server antwortet, kannst du das im Netzwerk-Tab der Entwickler-Tools untersuchen.</p> </blockquote> <p>Ja, untersuchen kann ich die Seite schon mit den Entwickler-Tools, aber wenn ich <a href="view-source:http://54598532.swh.strato-hosting.eu/games/demons-souls/" rel="nofollow noopener noreferrer">view-source:</a> vor die URL schreibe, wir der dynamisch hinzugefügte Inhalt natürlich nicht angezeigt. Ich dachte, das wäre vielleicht anders, wenn man URL-Parameter verwendet.</p> <blockquote> <blockquote> <ol start="2"> <li>Der Tab-Content lässt sich nicht gezielt über die URL aufrufen (wobei dies sicherlich auch noch irgendwie zu lösen wäre).</li> </ol> </blockquote> </blockquote> <p>Ja, ich glaube mit der Verwendung von # kann man es irgendwie einrichten, dass z.B. die URL <em>/games/demons-souls#mods</em> auch immer automatisch die dazugehörige Datei <em>mods.php</em> lädt. Leider weiß ich aber nicht, wie genau das zu programmieren wäre.</p> <blockquote> <p>Ja, das ist erstmal so, solange du die <a href="https://wiki.selfhtml.org/wiki/JavaScript/History" rel="nofollow noopener noreferrer">History</a> nicht entsprechend anpasst. Der Browser weiß ja ncht, wie relevant deine Manipulationen für die Navigation durch deine Inhalte sind.</p> </blockquote> <p>Ich muss gestehen, von so was habe ich gar keine Ahnung. Der Link hat mir leider nicht viel sagen können, da fehlt mir wohl das Grundverständnis …</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Tue, 08 Mar 22 14:08:22 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797122#m1797122 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797122#m1797122 <blockquote> <p>Das setzt voraus, dass mods.php keine vollständige HTML Seite liefert, sondern nur das HTML Fragment, das in den Tab hinein soll.</p> </blockquote> <p>Genau so ist es auch.</p> <blockquote> <p>Im Haupt-PHP Script, das die Rahmenseite liefert, kannst Du mit isset($_GET['mods']) abfragen, ob ein Parameter namens mods vorhanden ist. Das ist allerdings umständlich, weil Du für jede Page eine eigene Abfrage brauchst. Wenn Du <strong>nur</strong> den Pagename angeben willst, guck Dir $_SERVER['QUERY_STRING'] an und prüfe, ob der Wert in einer Liste erlaubter Pages steht, bevor Du die Page inkludierst.</p> </blockquote> <p>Tut mir echt leid, leider verstehe ich nur Bahnhof. Bisher kenne ich nur zwei Methoden, Inhalte dynamisch zu laden, nämlich über ein AJAX-Script oder über den PHP-Befehl<code><?php $path = $_SERVER['DOCUMENT_ROOT']; $path .= "/placeholder.php"; include($path); ?></code>. Ich habe bisher nicht verstehen können, wie man URL-Parameter überhaupt einsetzt, wo man sie im Code hinschreibt, das ganze Prinzip im Grunde nicht. Und die bisherigen Tutorials, die ich mir angeschaut habe, haben mir da auch irgendwie nicht weitergeholfen. Ich bräuchte ein Tutorial für richtige Dummies.</p> <blockquote> <p>Wenn der Parameter dann identifiziert ist, kannst Du im PHP an der Stelle, wo die Page eingebunden werden muss, sie einfach mit include hereinholen.</p> </blockquote> <p>Siehe oben.</p> <blockquote> <p>Clientseitig kannst Du, wie Dedlfix sagte, durch Zugriffe auf das History-API dafür sorgen, dass ein Page-Wechsel sich in URL und URL-Historie niederschlägt.</p> </blockquote> <p>Ich möchte das auch eigentlich nicht über eine URL-Historie lösen, sondern …</p> <blockquote> <h3>ABER</h3><p>Ich würde das nicht tun. Bei einer Ajax-getriebenen Seite kannst Du auch URLs mit Hash-Teil vewenden: …/games/demons-souls#mods</p> </blockquote> <p>… wenn schon AJAX, dann so, wie du das hier geschrieben hast, nämlich mit Hash.</p> <blockquote> <p>Diesen Hash-Teil kannst Du am Client auswerten und die Page per AJAX hereinholen. Das musst Du beim Start der Seite tun, und bei URL-Änderungen die Page anpassen. Dazu gibt's die <a href="https://wiki.selfhtml.org/wiki/JavaScript/DOM/Event/hashchange" rel="nofollow noopener noreferrer">hashchange</a> und <a href="https://wiki.selfhtml.org/wiki/JavaScript/DOM/Event/popstate" rel="nofollow noopener noreferrer">popstate</a> Events auf dem window Objekt.</p> </blockquote> <p>Unter den Beitrag von TS habe ich den kompletten Code kopiert, der für das dynamische Laden der Seitenteile zuständig ist. Könntest du mir sagen, wie ich hier mit den von dir genannten Events es so einrichte, dass der Hash-Teil automatisch den entsprechenden Seitenteil lädt?</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Wed, 09 Mar 22 06:58:32 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797145#m1797145 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797145#m1797145 <p>Hallo borisbaer!</p> <p>Ich schreib jetzt mal was zu URL-Parametern.</p> <p>Allgemein ist ein URL-Parameter etwas, was hinter der Adresse der Seite steht und mit <code>?</code> anfängt. Als gutes Beispiel können wir die Suche von Suchmaschinen verwenden.<br> Auch wenn ich Google hasse, werde ich Google als Beispiel verwenden, einfach, weil es immer noch ( ) die populärste Suchmaschine ist.<br> Unser erstes Beispiel wird sein: <a href="https://google.com/search?q=selfhtml" rel="nofollow noopener noreferrer">https://google.com/search?q=selfhtml</a>. Dabei ist das URL-Parameter das <code>?q=selfhtml</code>. Wie wir sehen, ist das <code>q</code> der „Schlüssel“, und das <code>selfhtml</code> der Wert.<br> Bei der Google Suche habe ich die URL direkt aufgerufen. Sie kann aber auch durch ein Formular entstehen. Für eine einfache Google Suche würde das dann so aussehen:</p> <pre><code class="block language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>form</span> <span class="token attr-name">action</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>https://google.com/search<span class="token punctuation">"</span></span> <span class="token attr-name">method</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>GET<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>label</span> <span class="token attr-name">for</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>suchbegriff<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Suchbegriff: <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>label</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>input</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>q<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>suchbegriff<span class="token punctuation">"</span></span><span class="token punctuation">/></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>br</span><span class="token punctuation">/></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>button</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>submit<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Suchen<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>button</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>form</span><span class="token punctuation">></span></span> </code></pre> <p>Das ganze habe ich in einem schönen kleinen <a href="https://jsfiddle.net/Samuel_fiedler/cz3ge6vL/1/" rel="noopener noreferrer">Fiddle</a> online gestellt. Dort funktioniert das Formularabsenden aber leider nicht, wahrscheinlich erlaubt es Google nicht, in ein iFrame (oder Frame) eingebettet zu sein.<br> Wenn man mehr als ein URL-Parameter mitliefern möchte, geht es nicht mit <code>?</code> weiter, sondern mit <code>&</code>.<br> Auch da gibt es das Google-Beispiel: Wenn ich auf die Google Startseite gehe und dort nach „selfhtml“ suche, dann sieht die ganze URL viel komplizierter aus: <a href="https://www.google.com/search?q=selfhtml&source=hp&ei=ekkoYpj9DO6Hxc8P2tGR8AM&iflsig=AHkkrS4AAAAAYihXinLuiThCTkx3kUv_6l_KpzG50Hq3&ved=0ahUKEwiYorTZs7j2AhXuQ_EDHdpoBD4Q4dUDCAg&uact=5&oq=selfhtml&gs_lcp=Cgdnd3Mtd2l6EAMyBQgAEIAEMgUIABCABDIFCAAQgAQyBQgAEIAEMgUIABCABDIFCAAQgAQyBQgAEIAEMgUIABCABDIFCAAQgAQyBQgAEIAEOgsILhCABBDHARCjAjoUCC4QgAQQsQMQgwEQxwEQ0QMQ1AI6EQguEIAEELEDEIMBEMcBENEDOggIABCxAxCDAToLCAAQgAQQsQMQgwE6CAguELEDEIMBOgsILhCABBDHARCvAToICC4QgAQQ1AI6CAgAEIAEELEDOgUILhCABDoOCC4QgAQQsQMQgwEQ1AI6DgguEIAEELEDEMcBENEDOgsILhCABBCxAxCDAToICC4QgAQQsQM6CwguEIAEELEDENQCOg4ILhCABBCxAxDHARCjAjoOCC4QgAQQsQMQxwEQrwE6BwgAEIAEEApQ_QJYjAlgyw1oAXAAeACAAWCIAboEkgEBOJgBAKABAbABAA&sclient=gws-wiz" rel="nofollow noopener noreferrer">https://www.google.com/search?q=selfhtml&source=hp&ei=ekkoYpj9DO6Hxc8P2tGR8AM&iflsig=AHkkrS4AAAAAYihXinLuiThCTkx3kUv_6l_KpzG50Hq3&ved=0ahUKEwiYorTZs7j2AhXuQ_EDHdpoBD4Q4dUDCAg&uact=5&oq=selfhtml&gs_lcp=Cgdnd3Mtd2l6EAMyBQgAEIAEMgUIABCABDIFCAAQgAQyBQgAEIAEMgUIABCABDIFCAAQgAQyBQgAEIAEMgUIABCABDIFCAAQgAQyBQgAEIAEOgsILhCABBDHARCjAjoUCC4QgAQQsQMQgwEQxwEQ0QMQ1AI6EQguEIAEELEDEIMBEMcBENEDOggIABCxAxCDAToLCAAQgAQQsQMQgwE6CAguELEDEIMBOgsILhCABBDHARCvAToICC4QgAQQ1AI6CAgAEIAEELEDOgUILhCABDoOCC4QgAQQsQMQgwEQ1AI6DgguEIAEELEDEMcBENEDOgsILhCABBCxAxCDAToICC4QgAQQsQM6CwguEIAEELEDENQCOg4ILhCABBCxAxDHARCjAjoOCC4QgAQQsQMQxwEQrwE6BwgAEIAEEApQ_QJYjAlgyw1oAXAAeACAAWCIAboEkgEBOJgBAKABAbABAA&sclient=gws-wiz</a></p> <p>Nehmen wir das mal auseinander:</p> <pre><code class="block">q selfhtml source hp ei kkoYpj9DO6Hxc8P2tGR8AM iflsig AHkkrS4AAAAAYihXinLuiThCTkx3kUv_6l_KpzG50Hq3 ved 0ahUKEwiYorTZs7j2AhXuQ_EDHdpoBD4Q4dUDCAg uact 5 oq selfhtml gs_lcp Cgdnd3Mtd2l6EAMyBQgAEIAEMgUIABCABDIFCAAQgAQyBQgAEIAEMgUIABCABDIFCAAQgAQyBQgAEIAEMgUIABCABDIFCAAQgAQyBQgAEIAEOgsILhCABBDHARCjAjoUCC4QgAQQsQMQgwEQxwEQ0QMQ1AI6EQguEIAEELEDEIMBEMcBENEDOggIABCxAxCDAToLCAAQgAQQsQMQgwE6CAguELEDEIMBOgsILhCABBDHARCvAToICC4QgAQQ1AI6CAgAEIAEELEDOgUILhCABDoOCC4QgAQQsQMQgwEQ1AI6DgguEIAEELEDEMcBENEDOgsILhCABBCxAxCDAToICC4QgAQQsQM6CwguEIAEELEDENQCOg4ILhCABBCxAxDHARCjAjoOCC4QgAQQsQMQxwEQrwE6BwgAEIAEEApQ_QJYjAlgyw1oAXAAeACAAWCIAboEkgEBOJgBAKABAbABAA sclient gws-wiz </code></pre> <p>Frage mich bitte nicht, was das alles bedeutet, aber alle diese Daten empfängt Google über die URL-Parameter.<br> Diese URL-Parameter kann man natürlich auslesen.<br> Vorher eine kleine Bemerkung: Das, was im view-source steht, ist NUR das, was der Browser von Server empfängt.<br> Wenn du alles über A<strong>J</strong>AX machst, ist das <strong>J</strong>avaScript. Das läuft (normalerweise <sup class="footnote-ref"><a href="#fn1" id="fnref1">[1]</a></sup>) im Browser. Logischerweise kann JavaScript also <strong>auf keinem Weg</strong> den view-source ändern <sup class="footnote-ref"><a href="#fn2" id="fnref2">[2]</a></sup>. Er kann vielleicht das Aussehen der Seite ändern, aber das kannst du ja nur im Seiteninspektor sehen.<br> Wenn du das aber über PHP machst, sieht das ganze etwas anders aus. PHP läuft nämlich (normalerweise <sup class="footnote-ref"><a href="#fn3" id="fnref3">[3]</a></sup>) auf dem Server. Dann empfängt der Browser die Ergebnisse schon so.<br> Es ist allerdings schwierig (<strong>SEHR</strong> schwierig, eigentlich unmöglich), mit PHP den Buttonklick eines Anwenders (oder die Textauswahl) ohne weitere Hilfen festzustellen. Deswegen mein ganzes Gefasel über URL-Parameter.<br> Du kannst dein Problem tatsächlich mit URL-Parametern lösen. Dafür musst du aber wissen, wie du sie empfangen kannst.<br> Vielleicht sollte ich noch sagen, dass du auch mit <code><a href="https://google.com/search?q=selfhtml"></a></code> URL-Parameter empfangen kannst.</p> <p>In PHP kannst du alle URL-Parameter mit <code>$_GET</code> empfangen. Vielleicht findet Google den Suchbegriff über <code>$_GET['q']</code> heraus.<br> Jedenfalls könntest du eine PHP-Datei bauen, die mit URL-Parametern funktioniert. Wenn du dann <code>https://example.com/test.php?mode=games</code> hast, dann kannst du mit PHP <code>$_GET['mode']</code> machen.<br> Weiter kannst du das dann mit <code>$modus = $_GET['mode'];</code> in einer Variablen speichern.<br> Den Rest darfst du selber konstruieren, da ich mit meiner Tastatur so langsam durchdrehe.</p> <p>Ich hoffe, du konntest mir folgen und hast sowohl mich als auch einen neuen Begriff verstanden!</p> <p>Au revoir,<br> Samuel Fiedler</p> <div class="signature">-- <br> Wie wir ja alle wissen, steht das D in Google für Datenschutz und das v für vertrauenswürdig, siehe <a href="https://forum.selfhtml.org/cites/2337" rel="noopener noreferrer">Zitat #2337</a>.<br> Ich würde noch hinzufügen, dass die Gs in Google für Geld stehen! </div> <hr class="footnotes-sep"> <section class="footnotes"> <ol class="footnotes-list"> <li id="fn1" class="footnote-item"><p>Es gibt „node.js“. Das soll auf dem Server laufen. Da ich mich damit jedoch nicht beschäftige, kann ich darüber nichts schreiben. <a href="#fnref1" class="footnote-backref">↩︎</a></p> </li> <li id="fn2" class="footnote-item"><p>Genau genommen kann JavaScript nur das DOM manipulieren, aber eben nicht den view-source. Von allem, was sich im DOM ändert, hat der view-source keinen blassen Schimmer. <a href="#fnref2" class="footnote-backref">↩︎</a></p> </li> <li id="fn3" class="footnote-item"><p>Keine Ahnung, ob es das auch für PHP gibt, aber es gibt <a href="https://webperl.zero-g.net/" rel="nofollow noopener noreferrer">WebPerl</a>. <a href="#fnref3" class="footnote-backref">↩︎</a></p> </li> </ol> </section> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Tue, 08 Mar 22 15:04:19 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797127#m1797127 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797127#m1797127 <p>Hallo borisbaer,</p> <p>ich finde deinen Code durch die Doppelzeiligkeit schwer lesbar. Aber ok, jedem sein Stil.</p> <p>URL Parameter am Server interessieren Dich zur Zeit nicht, wenn ich das richtig verstehe. Darum schreibe ich dazu jetzt nichts. Wichtig sind die Hashes.</p> <p>Was mir nicht klar ist: Auf der Savegame Seite hast Du eine Subnavigation, bei der Beute. Möchtest Du deren Seiten dauerhaft komplett laden, oder soll das auf AJAX umgestellt werden? In dem Fall wird die Hash-Behandlung etwas schwieriger. Nicht viel, aber doch. Ich gehe erstmal davon aus, dass Du das nicht machst.</p> <p>Mein Vorschlag wäre:</p> <ul> <li>Mach ein Backup von dem, was Du hast…</li> <li>Ergänze deine Links um ein #, also href="#game" statt href="game"</li> <li>Reagiere nicht auf den Klick des Links, sondern auf das hashchange Event des window-Objekts</li> <li>Bau dein Script in etwa so:</li> </ul> <pre><code class="block language-js"><span class="token function">$</span><span class="token punctuation">(</span><span class="token keyword">function</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">let</span> currentHash <span class="token operator">=</span> <span class="token string">''</span><span class="token punctuation">;</span> <span class="token comment">// loadCurrentPage als hashchange-Handler registrieren</span> window<span class="token punctuation">.</span><span class="token function">addEventListener</span><span class="token punctuation">(</span><span class="token string">"hashchange"</span><span class="token punctuation">,</span> loadCurrentPage<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// und gleich beim Start der Seite aufrufen um die Default-Page zu laden</span> <span class="token function">loadCurrentPage</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">function</span> <span class="token function">loadCurrentPage</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">let</span> newHash <span class="token operator">=</span> window<span class="token punctuation">.</span>location<span class="token punctuation">.</span>hash<span class="token punctuation">;</span> <span class="token keyword">let</span> $newTab<span class="token punctuation">;</span> <span class="token keyword">if</span> <span class="token punctuation">(</span>newHash<span class="token punctuation">.</span>length <span class="token operator">==</span> <span class="token number">0</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> $newTab <span class="token operator">=</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#tabs .tab:first-child"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> newHash <span class="token operator">=</span> $newTab<span class="token punctuation">.</span><span class="token function">attr</span><span class="token punctuation">(</span><span class="token string">"href"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token keyword">else</span> <span class="token punctuation">{</span> $newTab <span class="token operator">=</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#tabs .tab[href="</span><span class="token operator">+</span>newHash<span class="token operator">+</span><span class="token string">"]"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">if</span> <span class="token punctuation">(</span>$newTab<span class="token punctuation">.</span>length <span class="token operator">==</span> <span class="token number">0</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token comment">// Fehler, den Tab gibt's nicht</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> <span class="token keyword">if</span> <span class="token punctuation">(</span>newHash <span class="token operator">!=</span> currentHash<span class="token punctuation">)</span> <span class="token punctuation">{</span> currentHash <span class="token operator">=</span> newHash<span class="token punctuation">;</span> $newTab<span class="token punctuation">.</span><span class="token function">addClass</span><span class="token punctuation">(</span><span class="token string">"current"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">siblings</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">removeClass</span><span class="token punctuation">(</span><span class="token string">"current"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">let</span> tabName <span class="token operator">=</span> newHash<span class="token punctuation">.</span><span class="token function">substr</span><span class="token punctuation">(</span><span class="token number">1</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// das # steht in newHash drin</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"main"</span><span class="token punctuation">.</span><span class="token function">attr</span><span class="token punctuation">(</span><span class="token string">"id"</span><span class="token punctuation">,</span> tabName<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token function">$ajax</span><span class="token punctuation">(</span>tabName<span class="token punctuation">)</span> <span class="token punctuation">.</span><span class="token function">then</span><span class="token punctuation">(</span><span class="token keyword">function</span><span class="token punctuation">(</span><span class="token parameter">html</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#append"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">html</span><span class="token punctuation">(</span>html<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre> <p>Das ist jetzt so aus der Hüfte geschossen und ungetestet. Teils habe ich Code von Dir übernommen. Geändert habe ich:</p> <ul> <li><code>$(document).ready(function() { ... })</code> ist in jQuery missbilligt, die einzig korrekte Installation eines Ready-Handlers erfolgt mit <code>$(function() { ... })</code></li> <li>Der aktuelle Tab-Link wird in einer Variablen ($newTab) gespeichert. Diese Variable beginnt mit einem $, das ist meine Methode, um darzustellen, dass hier ein jQuery Set drin ist.</li> <li>Statt des success-Callback verwende ich die modernere Deferred-technik von jQuery (in vanilla javascript auch Promise genannt)</li> <li>statt .empty().append(html) verwende ich .html(html), das tut das gleiche in einem Schritt.</li> </ul> <p>Das sollte die Zeilen 65-114 deines main.js abdecken. Durch die Navigation mittels hashchange entfällt die Reaktion auf eine click der Links.</p> <p>Was fehlt, ist die Behandlung des Fehlers, wenn der genannte Hash nicht existiert. Das kann passieren, wenn der User den Hash editiert oder Du Dich vertippst hast.</p> <p>Man könnte auch ganz auf jQuery verzichten, aber da Du ein Freund davon bist, habe ich es dringelassen.</p> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Tue, 08 Mar 22 19:02:38 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797135#m1797135 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797135#m1797135 <p>Hallo Rolf,</p> <blockquote> <p>Was mir nicht klar ist: Auf der Savegame Seite hast Du eine Subnavigation, bei der Beute. Möchtest Du deren Seiten dauerhaft komplett laden, oder soll das auf AJAX umgestellt werden? In dem Fall wird die Hash-Behandlung etwas schwieriger. Nicht viel, aber doch. Ich gehe erstmal davon aus, dass Du das nicht machst.</p> </blockquote> <p>nein, das soll nicht auf AJAX umgestellt werden.</p> <blockquote> <p>Das sollte die Zeilen 65-114 deines main.js abdecken. Durch die Navigation mittels hashchange entfällt die Reaktion auf eine click der Links.</p> </blockquote> <p>Einige Syntax-Fehler waren scheinbar drin, habe sie hoffentlich alle korrigiert, ansonsten läuft dein Code jetzt so:</p> <pre><code class="block language-javascript"><span class="token keyword">let</span> currentHash <span class="token operator">=</span> <span class="token string">''</span><span class="token punctuation">;</span> <span class="token comment">// loadCurrentPage als hashchange-Handler registrieren</span> window<span class="token punctuation">.</span><span class="token function">addEventListener</span><span class="token punctuation">(</span><span class="token string">"hashchange"</span><span class="token punctuation">,</span> loadCurrentPage<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// und gleich beim Start der Seite aufrufen um die Default-Page zu laden</span> <span class="token function">loadCurrentPage</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">function</span> <span class="token function">loadCurrentPage</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">let</span> newHash <span class="token operator">=</span> window<span class="token punctuation">.</span>location<span class="token punctuation">.</span>hash<span class="token punctuation">;</span> <span class="token keyword">let</span> $newTab<span class="token punctuation">;</span> <span class="token keyword">if</span> <span class="token punctuation">(</span>newHash<span class="token punctuation">.</span>length <span class="token operator">==</span> <span class="token number">0</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> $newTab <span class="token operator">=</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#tabs .tab:first-child"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> newHash <span class="token operator">=</span> $newTab<span class="token punctuation">.</span><span class="token function">attr</span><span class="token punctuation">(</span><span class="token string">"href"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token keyword">else</span> <span class="token punctuation">{</span> $newTab <span class="token operator">=</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#tabs .tab[href="</span><span class="token operator">+</span>newHash<span class="token operator">+</span><span class="token string">"]"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">if</span> <span class="token punctuation">(</span>$newTab<span class="token punctuation">.</span>length <span class="token operator">==</span> <span class="token number">0</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token comment">// Fehler, den Tab gibt's nicht</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> <span class="token keyword">if</span> <span class="token punctuation">(</span>newHash <span class="token operator">!=</span> currentHash<span class="token punctuation">)</span> <span class="token punctuation">{</span> currentHash <span class="token operator">=</span> newHash<span class="token punctuation">;</span> $newTab<span class="token punctuation">.</span><span class="token function">addClass</span><span class="token punctuation">(</span><span class="token string">"current"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">siblings</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">removeClass</span><span class="token punctuation">(</span><span class="token string">"current"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">let</span> tabName <span class="token operator">=</span> newHash<span class="token punctuation">.</span><span class="token function">substr</span><span class="token punctuation">(</span><span class="token number">1</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// das # steht in newHash drin</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"main"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">attr</span><span class="token punctuation">(</span><span class="token string">"id"</span><span class="token punctuation">,</span> tabName<span class="token punctuation">)</span><span class="token punctuation">;</span> $<span class="token punctuation">.</span><span class="token function">ajax</span><span class="token punctuation">(</span>tabName<span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">then</span><span class="token punctuation">(</span><span class="token keyword">function</span><span class="token punctuation">(</span><span class="token parameter">html</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#append"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">html</span><span class="token punctuation">(</span>html<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> </code></pre> <p>Es funktioniert, dass die erste Unterseite (game) jetzt direkt angezeigt wird. Was jedoch nicht funktioniert, ist das Umschalten auf einen neuen Tab. Es erscheint die Fehlermeldung: <code>Uncaught Error: Syntax error, unrecognized expression: #tabs .tab[href=#releases]</code></p> <p>In der URL-Leiste steht z.B.: http://localhost/games/demons-souls/#releases</p> <p>Ich schätze mal, htaccess schießt hier irgendwie quer? Der eigentliche Pfad lautet nämlich: http://localhost/pages/games/demons-souls/index.php#releases</p> <p>Ich habe htaccess so eingestellt:</p> <pre><code class="block">Options +MultiViews RewriteEngine On # Rewrite "/games/<anything>" to "/pages/games/<anything>" RewriteCond %{REQUEST_URI} !^/pages/games RewriteRule ^games($|/.*) pages/$0 [L] # Remove .php extension from URL RewriteCond %{REQUEST_FILENAME} !-d RewriteCond %{REQUEST_FILENAME}\.php -f RewriteRule ^([^\.]+)/$ $1.php </code></pre> <blockquote> <p>Was fehlt, ist die Behandlung des Fehlers, wenn der genannte Hash nicht existiert. Das kann passieren, wenn der User den Hash editiert oder Du Dich vertippst hast.</p> </blockquote> <p>Ja, so was wollte ich auch noch einbauen, danke!</p> <blockquote> <p>Man könnte auch ganz auf jQuery verzichten, aber da Du ein Freund davon bist, habe ich es dringelassen.</p> </blockquote> <p>Was meinst du damit? Lieber nur Standard-Javascript verwenden?</p> <p>Boris</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Tue, 08 Mar 22 21:56:26 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797142#m1797142 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797142#m1797142 <p>Hallo borisbaer,</p> <blockquote> <p>Was meinst du damit? Lieber nur Standard-Javascript verwenden?</p> </blockquote> <p>Ja. Das meiste, was Du da tust, geht heute auch mit vanilla DOM Methoden - außer der .siblings-Nummer. Aber dafür kann man zur Not auch ein Schleifchen klöppeln. Es ist aber deine Entscheidung, welchen Toolstack Du nutzen willst. Wenn du mit jQuery zufrieden bist, nimm es. Statt $.ajax kannst Du auch das fetch-API benutzen, wenn Du auf den IE verzichten kannst.</p> <blockquote> <p>Uncaught Error: Syntax error, unrecognized expression: #tabs .tab[href=#releases]</p> </blockquote> <p>Ugh, ja, das hab ich verpennt. Das # ist in einem CSS Selektor ein Zeichen mit spezieller Bedeutung, so wie auch Punkt oder eckige Klammern, und muss in maskiert werden. Dafür gibt's eine Funktion, sie heißt CSS.escape. Nicht im Internet Explorer - dem schlägst Du damit einen weiteren Nagel in den Sarg.</p> <pre><code class="block good language-js">$newTab <span class="token operator">=</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#tabs .tab[href="</span><span class="token operator">+</span><span class="token constant">CSS</span><span class="token punctuation">.</span><span class="token function">escape</span><span class="token punctuation">(</span>newHash<span class="token punctuation">)</span><span class="token operator">+</span><span class="token string">"]"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre> <p>Wenn Du auf den IE nicht verzichten kannst, mach es so:</p> <pre><code class="block language-js">$newTab <span class="token operator">=</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#tabs .tab[href="</span><span class="token operator">+</span>newHash<span class="token punctuation">.</span><span class="token function">replace</span><span class="token punctuation">(</span><span class="token string">"#"</span><span class="token punctuation">,</span> <span class="token string">"\\#"</span><span class="token punctuation">)</span><span class="token operator">+</span><span class="token string">"]"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre> <p>Wichtig ist der doppelte Backslash, weil JavaScript den selbst schon zum Escapen nutzt.</p> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Wed, 09 Mar 22 16:02:26 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797178#m1797178 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797178#m1797178 <p>Hallo Rolf,</p> <blockquote> <p>Ja. Das meiste, was Du da tust, geht heute auch mit vanilla DOM Methoden - außer der .siblings-Nummer. Aber dafür kann man zur Not auch ein Schleifchen klöppeln. Es ist aber deine Entscheidung, welchen Toolstack Du nutzen willst. Wenn du mit jQuery zufrieden bist, nimm es.</p> </blockquote> <p>jQuery kann ich leichter nachvollziehen.</p> <blockquote> <p>Statt $.ajax kannst Du auch das fetch-API benutzen, wenn Du auf den IE verzichten kannst.</p> </blockquote> <p>Welchen Vorteil bietet das? Ist es schwierig? Schreibe ich dann einfach nur <code>fetch(tabName) { $(".append").html(html); };</code> stattdessen hin?</p> <p>Hier noch einmal der vollständige, funktionierende Code:</p> <pre><code class="block language-javascript"><span class="token function">$</span><span class="token punctuation">(</span><span class="token keyword">function</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">let</span> currentHash <span class="token operator">=</span> <span class="token string">''</span><span class="token punctuation">;</span> window<span class="token punctuation">.</span><span class="token function">addEventListener</span><span class="token punctuation">(</span><span class="token string">"hashchange"</span><span class="token punctuation">,</span> loadCurrentPage<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token function">loadCurrentPage</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">function</span> <span class="token function">loadCurrentPage</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">let</span> newHash <span class="token operator">=</span> window<span class="token punctuation">.</span>location<span class="token punctuation">.</span>hash<span class="token punctuation">;</span> <span class="token keyword">let</span> $newTab<span class="token punctuation">;</span> <span class="token keyword">if</span> <span class="token punctuation">(</span>newHash<span class="token punctuation">.</span>length <span class="token operator">==</span> <span class="token number">0</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> $newTab <span class="token operator">=</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#tabs .tab:first-child"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> newHash <span class="token operator">=</span> $newTab<span class="token punctuation">.</span><span class="token function">attr</span><span class="token punctuation">(</span><span class="token string">"href"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token keyword">else</span> <span class="token punctuation">{</span> $newTab <span class="token operator">=</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#tabs .tab[href="</span><span class="token operator">+</span><span class="token constant">CSS</span><span class="token punctuation">.</span><span class="token function">escape</span><span class="token punctuation">(</span>newHash<span class="token punctuation">)</span><span class="token operator">+</span><span class="token string">"]"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">if</span> <span class="token punctuation">(</span>$newTab<span class="token punctuation">.</span>length <span class="token operator">==</span> <span class="token number">0</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token comment">// e r r o r</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> <span class="token keyword">if</span> <span class="token punctuation">(</span>newHash <span class="token operator">!=</span> currentHash<span class="token punctuation">)</span> <span class="token punctuation">{</span> currentHash <span class="token operator">=</span> newHash<span class="token punctuation">;</span> $newTab<span class="token punctuation">.</span><span class="token function">addClass</span><span class="token punctuation">(</span><span class="token string">"current"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">siblings</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">removeClass</span><span class="token punctuation">(</span><span class="token string">"current"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">let</span> tabName <span class="token operator">=</span> newHash<span class="token punctuation">.</span><span class="token function">substr</span><span class="token punctuation">(</span><span class="token number">1</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"main"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">attr</span><span class="token punctuation">(</span><span class="token string">"id"</span><span class="token punctuation">,</span> tabName<span class="token punctuation">)</span><span class="token punctuation">;</span> $<span class="token punctuation">.</span><span class="token function">ajax</span><span class="token punctuation">(</span>tabName<span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">then</span><span class="token punctuation">(</span><span class="token keyword">function</span><span class="token punctuation">(</span><span class="token parameter">html</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">".append"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">html</span><span class="token punctuation">(</span>html<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre> <p>Wofür ist denn in <code>let tabName = newHash.substr(1);</code> das <em><strong>substr(1)</strong></em> da? Was würde passieren, wenn man den Teil weglässt?</p> <hr> <p>Ich habe endlich das Grundprinzip von URL Parametern nachvollziehen können. Im Grunde können Variablen in der URL einen bestimmten PHP-Code auf der Seite auslösen.</p> <p>In ganz einfacher Form habe ich mal eine Testseite erstellt: <a href="http://54598532.swh.strato-hosting.eu/" rel="nofollow noopener noreferrer">http://54598532.swh.strato-hosting.eu/</a></p> <p>Im <em>div</em> mit der class <em>append</em> steht folgender PHP-Code:</p> <pre><code class="block language-php"><span class="token php language-php"><span class="token delimiter important"><?php</span> <span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string single-quoted-string">'subpage'</span><span class="token punctuation">]</span> <span class="token operator">==</span> <span class="token string single-quoted-string">'foo'</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token variable">$path</span> <span class="token operator">=</span> <span class="token variable">$_SERVER</span><span class="token punctuation">[</span><span class="token string single-quoted-string">'DOCUMENT_ROOT'</span><span class="token punctuation">]</span><span class="token punctuation">;</span> <span class="token variable">$path</span> <span class="token operator">.=</span> <span class="token string double-quoted-string">"foo.php"</span><span class="token punctuation">;</span> <span class="token keyword">include</span><span class="token punctuation">(</span><span class="token variable">$path</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token keyword">else</span> <span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string single-quoted-string">'subpage'</span><span class="token punctuation">]</span> <span class="token operator">==</span> <span class="token string single-quoted-string">'bar'</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token variable">$path</span> <span class="token operator">=</span> <span class="token variable">$_SERVER</span><span class="token punctuation">[</span><span class="token string single-quoted-string">'DOCUMENT_ROOT'</span><span class="token punctuation">]</span><span class="token punctuation">;</span> <span class="token variable">$path</span> <span class="token operator">.=</span> <span class="token string double-quoted-string">"bar.php"</span><span class="token punctuation">;</span> <span class="token keyword">include</span><span class="token punctuation">(</span><span class="token variable">$path</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token keyword">else</span> <span class="token punctuation">{</span> <span class="token keyword">echo</span> <span class="token string double-quoted-string">" Startseite "</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token delimiter important">?></span></span> </code></pre> <p>Seltsamerweise funktioniert das auf meinem lokalen Server, aber auf dem Strato-Server plötzlich nicht mehr. Hast du eine Ahnung, warum?</p> <p>Dafür zeigt mir die Seite auf dem lokalen Server folgende Fehlermeldung an:</p> <pre><code class="block">Warning: Undefined array key "subpage" in E:\Webseiten\games\index.php on line 37 Warning: Undefined array key "subpage" in E:\Webseiten\games\index.php on line 41 </code></pre> <p>Auf dem Strato-Server hingegen erscheint diese Fehlermeldung nicht …</p> <p><strong>Edit:</strong> Es lag am Pfad. Ich musste ein slash bei /foo.php und /bar.php setzen, damit es den ROOT-Ordner anpeilt. Die Fehlermeldung auf dem lokalen Server bleibt aber.</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Wed, 09 Mar 22 08:32:36 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797148#m1797148 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797148#m1797148 <p>Hallo Samuel,</p> <p>ergänzend zu deinen Ausführungen:</p> <blockquote> <p>Allgemein ist ein URL-Parameter etwas, was hinter der Adresse der Seite steht und mit <code>?</code> anfängt.</p> </blockquote> <p>Genaugenommen ist das Fragezeichen nur ein Trenner. Es trennt die URL-Parameter vom Rest ab (so wie das et-Zeichen mehrere URL-Parameter voneinander trennt), ist aber selbst nicht Teil davon.</p> <blockquote> <p>In PHP kannst du alle URL-Parameter mit <code>$_GET</code> empfangen.</p> </blockquote> <p>Naja, <em>empfangen</em> ist vielleicht eine unglückliche Wortwahl.<br> Ich hätte eher gesagt "darauf zugreifen", denn empfangen sind sie ja längst.</p> <blockquote> <p>Weiter kannst du das dann mit <code>$modus = $_GET['mode'];</code> in einer Variablen speichern.</p> </blockquote> <p>Das sollte man aber nicht. Das bloße Umkopieren bringt keinen Mehrwert, es verschleiert nur die Herkunft der Daten. Schließlich ist $_GET['mode'] auch schon eine Variable - aber man sieht ihr auf den ersten Blick an, dass es eine Benutzereingabe ist.</p> <p>Einen schönen Tag noch<br>  Martin</p> <div class="signature">-- <br> Мир для України. </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Wed, 09 Mar 22 08:54:58 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797150#m1797150 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797150#m1797150 <p>Hallo Samuel,</p> <p>ein paar Hinweise noch dazu. Beim Nachlesen stelle ich fest, dass das Posting etwas wirr scheint - tatsächlich diskutiere ich diverse Optionen, die man wählen kann und aus denen man auswählen muss.</p> <p>Es gibt übrigens tatsächlich ein "PHP in Browser" Projekt: <a href="https://github.com/oraoto/pib" rel="noopener noreferrer">https://github.com/oraoto/pib</a>, um <script type="text/php"> ausführen zu können. Was genau er da treibt, scheint intransparent, er erzählt was von Docker und verwendet emscripten, den C/C++ to WASM Compiler. Für Anna Normalprogramiererin ist das aber sicherlich der Overkill, und es auch noch Version 0.04, a.k.a. als experimentell zu sehen.</p> <p>Wenn ich URL Parameter mit PHP verarbeite, geschieht das am Server. Man müsste also nach Erkennen des Parameters am Server dies tun</p> <pre><code class="block language-php"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>append<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token php language-php"><span class="token delimiter important"><?php</span> <span class="token keyword">include</span> <span class="token string double-quoted-string">"<span class="token interpolation"><span class="token variable">$module</span></span>.php"</span><span class="token punctuation">;</span> <span class="token delimiter important">?></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> </code></pre> <p>oder, schlechter:</p> <pre><code class="block language-php"><span class="token php language-php"><span class="token delimiter important"><?php</span> <span class="token keyword">echo</span> <span class="token string single-quoted-string">'<div id="append">'</span><span class="token punctuation">;</span> <span class="token keyword">include</span> <span class="token string double-quoted-string">"<span class="token interpolation"><span class="token variable">$module</span></span>.php"</span><span class="token punctuation">;</span> <span class="token keyword">echo</span> <span class="token string single-quoted-string">'</div>'</span><span class="token punctuation">;</span> <span class="token delimiter important">?></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> </code></pre> <p>Um das nutzen zu können, muss jeder Tab-Wechsel über den Server laufen, das ist dann kein Ajax mehr. Es ist aber für den initialen Seitenaufruf interessant, wenn jemand die URL für ein bestimmtes TAB in einem Bookmark hat.</p> <p>Wenn man mit URL-Parametern arbeiten will, hätte man in der Adresszeile URLs wie</p> <p>http://.../pages/games/demons-souls/<br> http://.../pages/games/demons-souls/?game<br> http://.../pages/games/demons-souls/?savegame</p> <p>Die vorhandene .htaccess Einstellung führt dazu, dass alle diese Abrufe auf der index.php landen. URLs 2 und 3 mit einem entsprechenden Query String, den PHP dann einliest.</p> <p>Der Standardfall ist, dass die /games/demons-souls Seite abgerufen wird. Die index.php kann loslaufen und per Default das game.php inkludieren. Wenn der User auf der Seite nun ein anderes Tab klickt, z.B. dieses:</p> <pre><code class="block language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>?savegame<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Savegame<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>a</span><span class="token punctuation">></span></span> </code></pre> <p>steht der Link auf /games/demons-souls/?savegame im Raum. Den kann man mit einem Click-Handler im Javascript abfangen und einen Ajax-Request auf savegame.php machen. Und mittels History-API in die Adresszeile pushen:</p> <pre><code class="block language-js">window<span class="token punctuation">.</span>history<span class="token punctuation">.</span><span class="token function">pushState</span><span class="token punctuation">(</span>state<span class="token punctuation">,</span> <span class="token string">""</span><span class="token punctuation">,</span> <span class="token keyword">new</span> <span class="token class-name">URL</span><span class="token punctuation">(</span>href<span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre> <p>state ist ein beliebiges Objekt, das man zum Hinterlegen von Daten nutzen kann (oder halt ein Leerstring). Der 2. Parameter ist ein Dummy, den gab's mal in der Spec und nun kriegt man ihn nicht mehr weg. Der dritte Parameter ist die URL, die in die Browser-Historie soll und dann auch in der Adresszeile steht, nämlich:</p> <p>http://.../pages/games/demons-souls/?savegame</p> <p>Wird die gebookmarked und später aufgerufen, bekommt index.php diesen Parameter als Query-String.</p> <p>Serverseitig ist index.php?savegame aber nicht so leicht zu erkennen. Denn PHPs $_GET Array geht von URL Parametern in der Form name=value aus. Einen "name only" Parameter findet man zwar in $_GET, aber mit einem NULL Wert. Man kann ihn nur mit isset($_GET["savegame"]) entdecken - und das ist lästig, wenn es eine größere Zahl von Tabs gibt. Aber am sichersten, weil gefakte Parameter kein Unheil anrichten können.</p> <p>Man könnte auch in $_SERVER['QUERY_STRING'] schauen. Dort würde man "?savegame" finden, könnte das ? entfernen, ein ".php" anhängen und das inkludieren. Whoa - STOP - das ist ein Hackerfest. Vorher ist zu prüfen, ob der so übergebene Modulname auch erlaubt ist, denn man könnte dort auch Namen von php Sourcen einsteuern, gerne auch mit .. und \ angereichert, die niemals nicht ein Tab-Modul sind.</p> <p>Auf diese Weise hätte man die aktuelle Seite als serverseitigen URL-Parameter "versorgt". Dies ist auch die sicherste Implementierung, denn wenn JavaScript nicht läuft, wird einfach über den Server das richtige Tab aktiviert. Progressive Enhancement at work.</p> <p>Aber ist das schick, dem Anwender eine URL wie /games/demons-souls/?savegame anzuzeigen? Und wo ich gerade dabei bin - /games/demons-souls/#savegame ist auch nicht wirklich schick. Es hat nur den Vorteil, clientseitig mittels hashchange Event die Navigation steuern zu können.</p> <p>Die Variante /games/demons-souls/savegame ist eigentlich viel schicker, nur führt die dazu, dass direkt savegame.php abgerufen wird; und das liefert ja nur das Tab aus.</p> <p>Das kann man unterschiedlich lösen. Der typische Apache-Ansatz ist ein Eingriff in die .htaccess, um mit mod_rewrite aus /games/<em>game</em>/<em>page</em> den Abruf von /games/<em>game</em>/index.php?<em>page</em> zu machen - wobei man sich in dem Fall auch das Leben erleichtern und den Parameter als ?tab=<em>page</em> generieren kann. Dann muss man im PHP nur $_GET['tab'] abfragen.</p> <p>Also - best practice wäre:</p> <ul> <li>die URLs in den Tabs ohne Fragezeichen und ohne # notieren. Also genau so, wie sie jetzt sind.</li> <li>am Server in der .htaccess per mod_rewrite dafür sorgen, dass Tab-Namen als ?tab=... an index.php angehängt werden. Falls irgendein Heini direkt die index.php abruft, kommt halt index.php?tab=index.php an. Ja und? Ist ein ungültiger Tab-Name, und:</li> <li>in index.php den tab-Parameter verarbeiten <strong>und auf gültige Tab-Namen validieren</strong>. Für ungültige oder fehlende Tabnamen das Default-Tab includen</li> <li>als progressive enhancement einen click-Handler auf die Tabs legen, der die Page per Ajax holt und per pushState so tut, als wär's über den Server gelaufen.</li> </ul> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Wed, 09 Mar 22 19:05:46 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797194#m1797194 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797194#m1797194 <p>Huch, entschuldige, hätte ich nur früher gesehen, dass hier noch ein Beitrag kam. Also, super erklärt, konnte alles gut nachvollziehen. Jetzt weiß ich immerhin, dass man URL-Parameter mit PHP verarbeiten kann. Wie das im Einzelfall genau geht, finde ich hoffentlich bald heraus.</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Wed, 09 Mar 22 19:26:46 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797195#m1797195 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797195#m1797195 <p>Genau das, was du hier beschreibst (mit Ausnahme der Sicherheitsaspekte, von denen ich leider keine Ahnung habe), wollte ich von Anfang an umsetzen.</p> <blockquote> <ul> <li>in index.php den tab-Parameter verarbeiten und auf gültige Tab-Namen validieren. Für ungültige oder fehlende Tabnamen das Default-Tab includen</li> </ul> </blockquote> <p>Ich frage ganz blöd: <strong>Wie geht das?</strong></p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Wed, 09 Mar 22 16:47:48 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797180#m1797180 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797180#m1797180 <p>Hallo borisbaer,</p> <blockquote> <p>fetch(tabName) { $(".append").html(html); };</p> </blockquote> <p>Du schreibst</p> <pre><code class="block">fetch(tabName) .then(function(response) { if (response.ok) return response.text(); else throw 'Tab konnte nicht geladen werden'; }) .then(function(html) { $(".append").html(html); }) .catch(function(message) { // Fehlerbehandlung }); </code></pre> <p>Fetch funktioniert in 3 Schritten. jQuery kapselt Dir das.</p> <p>Schritt 1: Absenden des HTTP Requests. Das macht fetch(tabName). Du bekommst ein <strong>Promise</strong> zurück; ein Objekt, das Dir das Versprechen macht, irgendwann Daten zu liefern.</p> <p>Auf diesem Promise rufst Du die Methode <strong>.then()</strong> auf. Mit then registrierst Du eine Funktion - einen Callback - der aufgerufen wird, wenn das Versprechen eingelöst wird.</p> <p>Schritt 2: Dieser Callback bekommt aber noch nicht die fertigen Daten übergeben, sondern erstmal nur ein "Response" Objekt. Je nachdem, ob der Server mit HTTP 200 oder 40x geantwortet hat, ist die ok Eigenschaft der Response auf true oder false. Das fragst Du ab, und wenn es ok war, DANN kannst Du den Text der Response lesen. Das geschieht wiederum asynchron (weil erstmal von Netzwerk gelesen werden muss), und response.text() liefert Dir ein neues Promise, mit dem Versprechen auf den Text, den der Server geliefert hat.</p> <p>Schritt 3: Und DER geht dann an den Callback des zweiten .then Aufrufs.</p> <p>Das ist ein Grundsatzmechanismus von Promises. Die .then Methode liefert <strong>immer</strong> ein neues Promise zurück, d.h. Du kannst .then Aufrufe aneinander hängen. Genau das passiert oben:</p> <pre><code class="block language-js"><span class="token function">fetch</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">then</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">then</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre> <p>Es ist nur anders aufgeschrieben, so dass die .then jeweils am Zeilenanfang stehen. Deswegen gibt's auch kein Semikolon hinter fetch(...).</p> <p>Wenn ein then Handler einfach nur einen Wert zurückliefert, geht der 1:1 weiter an den nächsten then. Aber wenn ein Promise zurückkommt, dann wird das Ergebnis dieses Promise an den nächsten then Handler übergeben, sobald sich das Promise erfüllt. Man kann auf diese Weise also mehrere asynchrone Abläufe aneinander koppeln.</p> <p>Im Fehlerfall steht da throw Error(). Das ist der JavaScript Exception-Mechanismus. Eine mit throw geworfener Wert kann mit einem try-catch Konstrukt gefangen werden (<a href="https://wiki.selfhtml.org/wiki/JavaScript/Tutorials/Fehlerbehandlung" rel="nofollow noopener noreferrer">-> Selfwiki</a>). Darum kümmert sich bei Promises die then-Funktion (then selbst, nicht dein Callback, den Du then übergeben hast). Sie fängt den geworfenen Wert und bricht die then-Kette ab. Um den Error verarbeiten zu können, brauchst Du noch einen .catch Aufruf auf der Promise-Kette, um einen Callback für den Fehlerfall zu registrieren.</p> <pre><code class="block language-js"><span class="token function">fetch</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">.</span><span class="token function">then</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">.</span><span class="token function">then</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">.</span><span class="token function">catch</span><span class="token punctuation">(</span><span class="token keyword">function</span><span class="token punctuation">(</span><span class="token parameter">error</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token operator">...</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre> <p>Den .catch-Handler musst Du nicht registrieren. Lässt Du ihn weg, wird ein Error in der Konsole der Entwicklerwerkzeuge notiert, aber das Programm läuft weiter. Aber wenn doch, bekommst Du genau das Ding übergeben, das mit throw geworfen wurde.</p> <blockquote> <p>Warning: Undefined array key "subpage" in E:\Webseiten\games\index.php on line 37</p> </blockquote> <p>Das sollte nur kommen, wenn der subpage Parameter nicht bei PHP ankommt. Kommt das nur, wenn Du die Seite ohne Parameter aufrufst? Wenn ja, und es bei Strato nicht kommt, kann das auch am unterschiedlichen error reporting der PHP Installationen liegen. Zeigt PHP auf dem Server überhaupt Warnungen an? Was liefert Dir die Funktion error_reporting(), bzw. ini_get("error_reporting") - vergleiche das mal mit deiner lokalen Kiste.</p> <blockquote> <p>$_SERVER['DOCUMENT_ROOT']</p> </blockquote> <p>Musst Du das überhaupt tun? Ein include sollte doch, meine ich, zuerstmal in dem Ordner schauen, in dem das PHP Script gestartet wurde. Wenn also Includierer und Includierter im gleichen Ordner stehen, müsste es auch ohne expliziten Pfad klappen. Das PHP Handbuch schreibt:</p> <blockquote> <p>Dateien werden unter dem angegebenen Pfad gesucht oder, wenn keiner gegeben ist, im include_path. Wenn die Datei auch im include_path nicht gefunden werden kann, sucht include noch im Verzeichnis der aufrufenden Datei und im aktuellen Arbeitsverzeichnis.</p> </blockquote> <p>include_path ist eine Einstellung in der php.ini.</p> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Wed, 09 Mar 22 18:17:38 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797190#m1797190 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797190#m1797190 <blockquote> <p>Das ist ein Grundsatzmechanismus von Promises.</p> </blockquote> <p>Vielen Dank für die Erklärung!</p> <blockquote> <p>Kommt das nur, wenn Du die Seite ohne Parameter aufrufst?</p> </blockquote> <p>Ja.</p> <blockquote> <p>Wenn ja, und es bei Strato nicht kommt, kann das auch am unterschiedlichen error reporting der PHP Installationen liegen. Zeigt PHP auf dem Server überhaupt Warnungen an? Was liefert Dir die Funktion error_reporting(), bzw. ini_get("error_reporting") - vergleiche das mal mit deiner lokalen Kiste.</p> </blockquote> <p>Okay, also jetzt zeigt es auf Strato auch folgenden Fehler an:</p> <pre><code class="block">Warning: Undefined array key "subpage" in /mnt/web521/b1/32/54598532/htdocs/index.php on line 42 Warning: Undefined array key "subpage" in /mnt/web521/b1/32/54598532/htdocs/index.php on line 44 </code></pre> <blockquote> <blockquote> <p>$_SERVER['DOCUMENT_ROOT']</p> </blockquote> <p>Musst Du das überhaupt tun? Ein include sollte doch, meine ich, zuerstmal in dem Ordner schauen, in dem das PHP Script gestartet wurde. Wenn also Includierer und Includierter im gleichen Ordner stehen, müsste es auch ohne expliziten Pfad klappen. Das PHP Handbuch schreibt:</p> </blockquote> <p>Nein, da hast du recht, das ist nur ein Überbleibsel. Ich habe es wieder entfernt.</p> <hr> <p>Wie ist das denn, wenn ich jetzt einen URL-Parameter als Variable für den <em>path</em> haben möchte? Ist das möglich?</p> <p>Boris</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Wed, 09 Mar 22 18:24:58 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797192#m1797192 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797192#m1797192 <p>Hallo borisbaer,</p> <p>was ich vergaß zu schreiben:</p> <pre><code class="block language-php"><span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token operator">!</span><span class="token keyword">empty</span><span class="token punctuation">(</span><span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string single-quoted-string">'subpage'</span><span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token comment">// prüfe parameterwert</span> <span class="token punctuation">}</span> </code></pre> <p>beseitigt die Warnung. Entweder empty, oder isset.</p> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Wed, 09 Mar 22 18:56:47 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797193#m1797193 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797193#m1797193 <p>Hat geklappt, danke für die Hilfe, Rolf!</p> <p>Es scheint mir tatsächlich die bessere Lösung zu sein, Tabs mit URL-Parametern abzurufen.</p> <p>Wie du bereits oben sagtest, müsste ich halt für jeden Tab-Namen einen Befehl mit <em>if</em> bzw. <em>else if</em> schreiben. Du erwähntest <code>$_SERVER['QUERY_STRING']</code> als Workaround? Ich habe nur leider nicht verstanden, wie genau das funktionieren soll. Könntest du genauer erklären, wie das gemeint war? Und mal wirklich ein großes Dankeschön, dass du mir hier so weiterhilfst. Ich bin dir echt sehr dankbar!</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Wed, 09 Mar 22 21:41:32 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797199#m1797199 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797199#m1797199 <p>Hallo borisbaer,</p> <p>was jetzt genau? Die Verarbeitung des Parameters in index.php hast Du doch schon in deiner Demoseite drin.</p> <p>Die mod_rewrite-Konfiguration in der .htaccess? Letztlich definierst Du da, dass eine hereinkommende URL x/y/z irgendwie umgebaut werden soll, bevor der Server sie verarbeitet. Der Servername ist nicht mehr Teil dieser URL.</p> <p>In deinen /games Ordner kannst Du eine .htaccess Datei stellen, die so aussieht:</p> <pre><code class="block">RewriteEngine On RewriteRule suchmuster ersetzungsmuster flags </code></pre> <p>Das Suchmuster ist eine Regex, mit der auf die URL gematcht wird, und zwar ab dem Ordner, in dem die .htaccess Datei steht. Also: Wenn die .htaccess im <code>/games</code> Ordner steht und die URL <code>/games/demons-souls/mods</code> abgerufen wird, wird die Regex auf <code>demons-souls/mods</code> angewendet.</p> <p>Man kann mehrere RewriteRules angeben, und sie werden von oben nach unten verarbeitet. Wenn Du meinst, dass eine Rule die URL abschließend verarbeitet, gibt ihr das L Flag ("Last"), dann werden die folgenden Rules nicht mehr verarbeitet. Man kann auch so eine Art von IF-Blöcken bauen, das geht mit RewriteCond, aber das lass ich jetzt mal weg.</p> <p>Wenn Du dies hier schreibst:</p> <pre><code class="block">RewriteRule ^([^/]*)/([^/]*)$ $1/index.php?tab=$2 [L,QSA] </code></pre> <p>dann würden alle URLs nach dem Muster /games/<em>spiel</em>/<em>tabname</em> aufgebaut sind, als /games/<em>spiel</em>/index.php?tab=<em>tabname</em> verarbeitet. Alle anderen URLs bleiben unverändert.</p> <p>Wieso ist das so? Schauen wir uns das Suchmuster an. Es sieht wüst aus:</p> <pre><code class="block">^([^/]+)/([^/]+)$ </code></pre> <p>Ich schiebe es mal etwas auseinander.</p> <pre><code class="block">^ ([^/]+) / ([^/]+) $ </code></pre> <p>Regexe sind eine Nichtwissenschaft für sich. Wären sie eine Wissenschaft, gäbe es bspw. diese Mehrdeutigkeit des ^ Zeichens nicht.</p> <p>Der Begriff "games" taucht im Suchmuster nicht auf. Siehe oben, dieser Teil der URL kommt beim Suchmuster gar nicht an.</p> <p>Das erste ^ ist ein <strong>Anker</strong>. Steht es am Anfang der Regex, verankert es die Suche am Beginn des zu durchsuchenden Strings. Die Regex "ha" würde zwei Treffer in "haha" finden, aber "^ha" nur das erste ha.</p> <p>Dann kommt eine Suche nach einer Folge von Zeichen. Dazu wird eine <strong>Klasse von Zeichen</strong> verwendet, das macht man mit den eckigen Klammern. Innerhalb der Klammern kann man verschiedenes angeben, z.B. <code>[aeiou]</code> für die Standardvokale. Man kann es aber auch andersrum sagen: Alles außer diesem hier, dafür verwendet man - blöderweise - das ^ Zeichen. <code>[^aeiou]</code> findet alles außer Vokalen, und <code>[^/]</code> heißt: Jedes Zeichen, das nicht / ist. Hinter dieser Zeichenklasse steht ein Plus. Das ist eine Wiederholungsangabe und bedeutet: Das, was links vom Plus ist, soll im duchsuchten String einmal bis beliebig oft vorkommen. <code>[^/]+</code> findet also die Teile einer URL zwischen den / Zeichen.</p> <p>Dieses Teilmuster ist in Klammern gesetzt und bildet damit eine <strong>Gruppe</strong>. Die brauchen wir nachher beim Ersetzen, denn den Inhalt einer gefundenen Gruppe kann man im Ersetzungsmuster einfügen.</p> <p>Es folgt ein / - das ist ein Zeichen ohne Sonderbedeutung und verlangt an dieser Stelle einfach ein /.</p> <p>Dahinter wird ein weiterer Pfadanteil in einer Gruppe abgefragt und zum Schluss kommt das $. Das $ ist wieder ein Anker, diesmal für das Ende der Zeichenkette.</p> <p>Damit passt das Muster auf foo/bar oder f/b, nicht aber auf f oder foo/bar/baz. Diese blieben unverändert. Ein Abruf von /games/demons würde damit funktionieren wie bisher, und /games/demons/versus/zombies würde wohl auf HTTP Status 404 laufen. Wenn Du solche URLs an dein index.php übergeben willst, verwende als Suchmuster <code>^([^/]*)/(.*)</code> - das .* am Ende sagt: Nimm Alles Was Kommt.</p> <p>Nun zum Ersetzungsmuster. Da steht $1/index.php?tab=$2. Das kannst Du sicherlich selbst einordnen. $1 und $2 sind die Inhalte der Gruppen 1 und 2 aus dem Suchmuster, d.h. der Spielname und der Tabname.</p> <p>Zum Schluss folgt noch [L,QSA]. Das sind Flags für die RewriteRule. L heißt "Last", d.h. wenn das Suchmuster zutrifft, ist dies die letzte verarbeitete Rewrite-Regel. QSA heißt "Query String Append" - ob Du das brauchst, weiß ich nicht. Was ist mit einer URL wie <code>/games/demons/achievements?mode=3</code> - das wäre der Wunsch für das Spiel demons das tab achievements zu sehen, und bei diesem Abruf noch einen zusätzlichen URL-Parameter mode=3 zu nutzen. Ohne QSA würde dieser Extraparameter verloren gehen. Mit QSA würde er an deine generierte URL angehängt.</p> <p>Ich hoffe, das war verständlich und auch das, was Du wissen wolltest.</p> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Thu, 10 Mar 22 16:15:42 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797234#m1797234 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797234#m1797234 <p>Hallo Rolf,</p> <p>vielen Dank für die ausführliche Erklärung des Ganzen. Ich muss mir das noch ein paar mal durchlesen, um es wirklich nachvollziehen zu können. Momentan ist mein Kopf wegen Corona total zu. Ich wollte noch sagen, dass ich schon eine htaccess-Datei habe:</p> <pre><code class="block">Options +MultiViews RewriteEngine On # Rewrite "/games/<anything>" to "/pages/games/<anything>" RewriteCond %{REQUEST_URI} !^/pages/games RewriteRule ^games($|/.*) pages/$0 [L] # Remove .php extension from URL RewriteCond %{REQUEST_FILENAME} !-d RewriteCond %{REQUEST_FILENAME}\.php -f RewriteRule ^([^\.]+)/$ $1.php </code></pre> <p>Alle Seiten sind bei mir erst mal unter games/<strong>pages</strong> gespeichert, also wäre der eigentliche Pfad, der umgeschrieben werden müsste nicht /games/demons-souls/, sondern /pages/games/demons-souls/.</p> <p>Eigentlich wollte ich auch eher wissen, wie ich denn diesen PHP-Code</p> <pre><code class="block language-php"><span class="token php language-php"><span class="token delimiter important"><?php</span> <span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token keyword">isset</span><span class="token punctuation">(</span><span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string single-quoted-string">'page'</span><span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string single-quoted-string">'page'</span><span class="token punctuation">]</span> <span class="token operator">==</span> <span class="token string single-quoted-string">'game'</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token variable">$path</span> <span class="token operator">=</span> <span class="token string double-quoted-string">"game.php"</span><span class="token punctuation">;</span> <span class="token keyword">include</span><span class="token punctuation">(</span><span class="token variable">$path</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token keyword">else</span> <span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string single-quoted-string">'page'</span><span class="token punctuation">]</span> <span class="token operator">==</span> <span class="token string single-quoted-string">'releases'</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token variable">$path</span> <span class="token operator">=</span> <span class="token string double-quoted-string">"releases.php"</span><span class="token punctuation">;</span> <span class="token keyword">include</span><span class="token punctuation">(</span><span class="token variable">$path</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token keyword">else</span> <span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string single-quoted-string">'page'</span><span class="token punctuation">]</span> <span class="token operator">==</span> <span class="token string single-quoted-string">'mods'</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token variable">$path</span> <span class="token operator">=</span> <span class="token string double-quoted-string">"mods.php"</span><span class="token punctuation">;</span> <span class="token keyword">include</span><span class="token punctuation">(</span><span class="token variable">$path</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> <span class="token keyword">else</span> <span class="token punctuation">{</span> <span class="token variable">$path</span> <span class="token operator">=</span> <span class="token string double-quoted-string">"game.php"</span><span class="token punctuation">;</span> <span class="token keyword">include</span><span class="token punctuation">(</span><span class="token variable">$path</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token delimiter important">?></span></span> </code></pre> <p>so umschreibe, damit ich nicht jedes Mal ein if ergänzen muss, sobald ein neues Tab hinzukommt, wenn du verstehst, was ich meine.</p> <p>Boris</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Thu, 10 Mar 22 18:00:53 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797237#m1797237 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797237#m1797237 <p>Hallo borisbaer,</p> <p>hm, deine Rewrite-Regeln will ich dann nicht weiter anfassen. Wärest Du denn zufrieden, wenn Du mit /games/demons-souls/?tab=dings auf den Tab namens "dings" kommst? Oder möchtest Du sehr gerne URLs wie /games/demons-souls/dings unterstützen können? Dann müsste man sich passende Rewrites überlegen und könnte vielleicht sogar die Prüfung auf gültige Tab-Namen in der .htaccess durchführen </p> <blockquote> <p>damit ich nicht jedes Mal ein if ergänzen muss, wenn du verstehst, was ich meine.</p> </blockquote> <p>ja, schon.</p> <p>Meine Emfehlung wäre, die PHP Scripte für die Tabs so zu benennen, dass sie am Dateinamen als Tab erkennbar sind. Das kann man entweder so machen, dass sie in einen tabs-Unterordner kommen, oder bspw. als game.tab.php benannt werden.</p> <p>Wenn Du dann in %_GET['page'] etwas findest, kannst du:</p> <p>(1) Prüfen, ob der gefundene Wert nur aus Buchstaben besteht (preg_match) (2) Prüfen, ob die .tab.php-Datei dazu existiert (3) Tab laden</p> <pre><code class="block language-php"><span class="token variable">$page_found</span> <span class="token operator">=</span> <span class="token constant boolean">false</span><span class="token punctuation">;</span> <span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token operator">!</span><span class="token keyword">empty</span><span class="token punctuation">(</span><span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string double-quoted-string">"page"</span><span class="token punctuation">]</span><span class="token punctuation">)</span> <span class="token operator">&&</span> <span class="token function">preg_match</span><span class="token punctuation">(</span><span class="token string double-quoted-string">"/^[a-z]+$/i"</span><span class="token punctuation">,</span> <span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string double-quoted-string">"page"</span><span class="token punctuation">]</span><span class="token punctuation">)</span> <span class="token operator">==</span> <span class="token number">1</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token variable">$pageFile</span> <span class="token operator">=</span> <span class="token string double-quoted-string">".\" . <span class="token interpolation"><span class="token variable">$_GET</span></span>["</span>page<span class="token string double-quoted-string">"] . "</span><span class="token operator">.</span>tab<span class="token operator">.</span>php<span class="token string double-quoted-string">"; if (file_exists(<span class="token interpolation"><span class="token variable">$pageFile</span></span>)) { include <span class="token interpolation"><span class="token variable">$pageFile</span></span>; <span class="token interpolation"><span class="token variable">$page_found</span></span> = true; } } if (!<span class="token interpolation"><span class="token variable">$page_found</span></span>) { include "</span><span class="token operator">.</span>\game<span class="token operator">.</span>tab<span class="token operator">.</span>php"<span class="token punctuation">;</span> <span class="token punctuation">}</span> </code></pre> <p>Das ist die ausführliche Version, die man gut lesen kann.<br> Meine persönliche Version sähe so aus - ich schäme mich ja auch beinahe </p> <pre><code class="block language-php"><span class="token variable">$pageFile</span><span class="token punctuation">)</span> <span class="token operator">=</span> <span class="token string double-quoted-string">".\" . (empty(<span class="token interpolation"><span class="token variable">$_GET</span></span>["</span>page<span class="token string double-quoted-string">"] || !preg_match("</span><span class="token operator">/</span><span class="token operator">^</span><span class="token punctuation">[</span>a<span class="token operator">-</span>z<span class="token punctuation">]</span><span class="token operator">+</span>$<span class="token operator">/</span>i<span class="token string double-quoted-string">", <span class="token interpolation"><span class="token variable">$_GET</span></span>["</span>page<span class="token string double-quoted-string">"]) ? "</span>game<span class="token string double-quoted-string">" : <span class="token interpolation"><span class="token variable">$_GET</span></span>["</span>page<span class="token string double-quoted-string">"]) . "</span><span class="token operator">.</span>tab<span class="token operator">.</span>php"<span class="token punctuation">;</span> <span class="token function">file_exists</span><span class="token punctuation">(</span><span class="token variable">$pageFile</span><span class="token punctuation">)</span> <span class="token operator">&&</span> <span class="token keyword">include</span> <span class="token variable">$pageFile</span><span class="token punctuation">;</span> </code></pre> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Thu, 10 Mar 22 21:49:26 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797238#m1797238 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797238#m1797238 <blockquote> <p>Wärest Du denn zufrieden, wenn Du mit /games/demons-souls/?tab=dings auf den Tab namens "dings" kommst? Oder möchtest Du sehr gerne URLs wie /games/demons-souls/dings unterstützen können? Dann müsste man sich passende Rewrites überlegen und könnte vielleicht sogar die Prüfung auf gültige Tab-Namen in der .htaccess durchführen </p> </blockquote> <p>Ja, die schickere Variante wäre mir schon sehr lieb, aber das mit den Rewrites hat noch keine Priorität für mich.</p> <blockquote> <p>Meine Emfehlung wäre, die PHP Scripte für die Tabs so zu benennen, dass sie am Dateinamen als Tab erkennbar sind. Das kann man entweder so machen, dass sie in einen tabs-Unterordner kommen, oder bspw. als game.tab.php benannt werden.</p> <p>Wenn Du dann in %_GET['page'] etwas findest, kannst du:</p> <p>(1) Prüfen, ob der gefundene Wert nur aus Buchstaben besteht (preg_match) (2) Prüfen, ob die .tab.php-Datei dazu existiert (3) Tab laden</p> <pre><code class="block language-php"><span class="token variable">$page_found</span> <span class="token operator">=</span> <span class="token constant boolean">false</span><span class="token punctuation">;</span> <span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token operator">!</span><span class="token keyword">empty</span><span class="token punctuation">(</span><span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string double-quoted-string">"page"</span><span class="token punctuation">]</span><span class="token punctuation">)</span> <span class="token operator">&&</span> <span class="token function">preg_match</span><span class="token punctuation">(</span><span class="token string double-quoted-string">"/^[a-z]+$/i"</span><span class="token punctuation">,</span> <span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string double-quoted-string">"page"</span><span class="token punctuation">]</span><span class="token punctuation">)</span> <span class="token operator">==</span> <span class="token number">1</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token variable">$pageFile</span> <span class="token operator">=</span> <span class="token string double-quoted-string">".\" . <span class="token interpolation"><span class="token variable">$_GET</span></span>["</span>page<span class="token string double-quoted-string">"] . "</span><span class="token operator">.</span>tab<span class="token operator">.</span>php<span class="token string double-quoted-string">"; if (file_exists(<span class="token interpolation"><span class="token variable">$pageFile</span></span>)) { include <span class="token interpolation"><span class="token variable">$pageFile</span></span>; <span class="token interpolation"><span class="token variable">$page_found</span></span> = true; } } if (!<span class="token interpolation"><span class="token variable">$page_found</span></span>) { include "</span><span class="token operator">.</span>\game<span class="token operator">.</span>tab<span class="token operator">.</span>php"<span class="token punctuation">;</span> <span class="token punctuation">}</span> </code></pre> </blockquote> <p><a href="/images/b3329d6e-a0bb-11ec-b0d4-b42e9947ef30.jpg" rel="noopener noreferrer"><img src="/images/b3329d6e-a0bb-11ec-b0d4-b42e9947ef30.jpg?size=medium" alt="error" title="error" loading="lazy"></a></p> <p>Irgendwie hat er ein Problem mit dem Code.</p> <blockquote> <p>Das ist die ausführliche Version, die man gut lesen kann.<br> Meine persönliche Version sähe so aus - ich schäme mich ja auch beinahe </p> <pre><code class="block language-php"><span class="token variable">$pageFile</span><span class="token punctuation">)</span> <span class="token operator">=</span> <span class="token string double-quoted-string">".\" . (empty(<span class="token interpolation"><span class="token variable">$_GET</span></span>["</span>page<span class="token string double-quoted-string">"] || !preg_match("</span><span class="token operator">/</span><span class="token operator">^</span><span class="token punctuation">[</span>a<span class="token operator">-</span>z<span class="token punctuation">]</span><span class="token operator">+</span>$<span class="token operator">/</span>i<span class="token string double-quoted-string">", <span class="token interpolation"><span class="token variable">$_GET</span></span>["</span>page<span class="token string double-quoted-string">"]) ? "</span>game<span class="token string double-quoted-string">" : <span class="token interpolation"><span class="token variable">$_GET</span></span>["</span>page<span class="token string double-quoted-string">"]) . "</span><span class="token operator">.</span>tab<span class="token operator">.</span>php"<span class="token punctuation">;</span> <span class="token function">file_exists</span><span class="token punctuation">(</span><span class="token variable">$pageFile</span><span class="token punctuation">)</span> <span class="token operator">&&</span> <span class="token keyword">include</span> <span class="token variable">$pageFile</span><span class="token punctuation">;</span> </code></pre> </blockquote> <p>Auch diese Version will er mir leider nicht als validen Code annehmen. </p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Thu, 10 Mar 22 22:26:42 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797240#m1797240 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797240#m1797240 <p>Hallo borisbaer,</p> <p>ich könnt' ja sagen: Find's raus, ist eine gute Lektion wenn Du es erkennst . Aber ich hab es ja selbst auch nicht gesehen beim Schreiben.</p> <pre><code class="block bad language-php"><span class="token variable">$pageFile</span> <span class="token operator">=</span> <span class="token string double-quoted-string">".\" . <span class="token interpolation"><span class="token variable">$_GET</span></span>["</span>page<span class="token string double-quoted-string">"] . "</span><span class="token operator">.</span>tab<span class="token operator">.</span>php"<span class="token punctuation">;</span> </code></pre> <p>Sorry. \ ist ein Escapezeichen und maskiert deshalb das ". Das kommt davon, wenn man Code direkt vom Hirn in den Editor dumpt und nicht PHP befragt, was es davon hält. Das \ muss verdoppelt werden, um sich selbst zu maskieren.</p> <pre><code class="block good language-php"><span class="token variable">$pageFile</span> <span class="token operator">=</span> <span class="token string double-quoted-string">".\\"</span> <span class="token operator">.</span> <span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string double-quoted-string">"page"</span><span class="token punctuation">]</span> <span class="token operator">.</span> <span class="token string double-quoted-string">".tab.php"</span><span class="token punctuation">;</span> </code></pre> <p>Das gleiche Problem besteht natürlich in dem write-only Einzeiler.</p> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Thu, 10 Mar 22 23:27:30 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797242#m1797242 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797242#m1797242 <blockquote> <p>ich könnt' ja sagen: Find's raus, ist eine gute Lektion wenn Du es erkennst . Aber ich hab es ja selbst auch nicht gesehen beim Schreiben.</p> </blockquote> <p>Und ich würde es dir sicher auch sagen können, nachdem ich noch ein Zweitstudium in Informatik absolviert habe. Wenn ich mir normale PHP-Tutorials anschaue, werden nie solche Probleme angesprochen, sondern immer alles sehr basal gehalten.</p> <p>Wenn ich dich mal fragen darf: Wie hast du dir das alles angeeignet?</p> <blockquote> <p>Das gleiche Problem besteht natürlich in dem write-only Einzeiler.</p> </blockquote> <p>Den möchte er trotzdem nicht annehmen, es kommt die Fehlermeldung <code>Parse error: Unmatched ')'</code>. Da der Einzeiler für mich absolut kryptisch ist, versuche ich erst gar nicht den Fehler zu suchen.</p> <p>Wie müsste denn der Code aussehen, damit er nicht auf das <em><strong>.tab</strong></em> im Datei-Namen reagiert, sondern z.B. auf einen Unterordner namens <em><strong>tabs</strong></em>?</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Fri, 11 Mar 22 07:51:26 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797245#m1797245 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797245#m1797245 <p>Moin,</p> <blockquote> <p>Sorry. \ ist ein Escapezeichen und maskiert deshalb das ". Das kommt davon, wenn man Code direkt vom Hirn in den Editor dumpt und nicht PHP befragt, was es davon hält. Das \ muss verdoppelt werden, um sich selbst zu maskieren.</p> </blockquote> <p>Besser wäre es einen normalen Slash („<code>/</code>“) zu verwenden: der Backslash ist Windows-only, ein Slash funktioniert überall. Alternativ gibt es noch die Konstante <code>DIRECTORY_SEPARATOR</code>, die zu verwenden ist aber nicht notwendig, <code>/</code> funktioniert immer (Windows kommt auch mit einer Mischung aus <code>/</code> und <code>\</code> zurecht).</p> <p>Ich würde auch generell mit absoluten Pfaden verwenden, also:</p> <pre><code class="block language-php"><span class="token variable">$pageFile</span> <span class="token operator">=</span> <span class="token constant">__DIR__</span> <span class="token operator">.</span> <span class="token string double-quoted-string">"/"</span> <span class="token operator">.</span> <span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string double-quoted-string">"page"</span><span class="token punctuation">]</span> <span class="token operator">.</span> <span class="token string double-quoted-string">".tab.php"</span><span class="token punctuation">;</span> </code></pre> <p>Damit funktioniert das Script nämlich auch wenn das Arbeitsverzeichnis mal ein anderes ist, z.B. wenn das Script von einem anderen Verzeichnis aus eingebunden wird.</p> <p>Gruß<br> Tobias</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Fri, 11 Mar 22 08:06:28 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797248#m1797248 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797248#m1797248 <p>Moin,</p> <blockquote> <blockquote> <p>Das gleiche Problem besteht natürlich in dem write-only Einzeiler.</p> </blockquote> <p>Den möchte er trotzdem nicht annehmen, es kommt die Fehlermeldung <code>Parse error: Unmatched ')'</code>. Da der Einzeiler für mich absolut kryptisch ist, versuche ich erst gar nicht den Fehler zu suchen.</p> </blockquote> <p>Wie sieht dein Code aktuell aus? Im zweiten Code aus dem Rolfs Posting von <a href="https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797237#m1797237" rel="noopener noreferrer">19:00 Uhr</a> ist nach $pageFile noch eine schließende Klammer zu viel.</p> <blockquote> <p>Wie müsste denn der Code aussehen, damit er nicht auf das <em><strong>.tab</strong></em> im Datei-Namen reagiert, sondern z.B. auf einen Unterordner namens <em><strong>tabs</strong></em>?</p> </blockquote> <p>Du musst eben in $pageFile den Pfad zu den Dateien richtig zusammenbauen, evtl. sowas in die Richtung:</p> <pre><code class="block language-php"><span class="token variable">$pageFile</span> <span class="token operator">=</span> <span class="token constant">__DIR__</span> <span class="token operator">.</span> <span class="token string double-quoted-string">"/tabs/"</span> <span class="token operator">.</span> <span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string double-quoted-string">"page"</span><span class="token punctuation">]</span> <span class="token operator">.</span> <span class="token string double-quoted-string">".php"</span><span class="token punctuation">;</span> </code></pre> <p>(bezüglich <a href="https://www.php.net/language.constants.magic" rel="nofollow noopener noreferrer"><code>__DIR__</code></a> siehe <a href="https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797245#m1797245" rel="noopener noreferrer">meine Antwort an Rolf</a>)</p> <p>Gruß<br> Tobias</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Fri, 11 Mar 22 08:11:41 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797249#m1797249 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797249#m1797249 <p>Hallo borisbaer,</p> <p>ein Zweitstudium in Informatik hilft Dir da weniger, die lernten früher mal Pascal und heute Java. Mit so ekligen Dingen wie PHP gibt sich doch kein hehrer Prof ab. Da musst Du Dir schon jahrelang die Finger in Niederungen wie Selfhtml schmutzig machen, lesen lesen lesen, und hinreichend oft selbst Fehler machen <strong>und selbst finden</strong>. Programmieren lernen ist wie ein verstauchter Knöchel. Tut weh und braucht Zeit. Und wenn er dann heile ist, rennst Du wie ein junger Gott - bis zum nächsten Stolperstein (d.h. der nächsten SuperDuper Library, die grunzend durch's Dorf gehyped wird) - echt erstaunlich, wie weit diese Metapher reicht .</p> <p>Mein Stolperstein war das \ - Tobias hat ganz recht, das gehört da überhaupt nicht hin weil es nur unter Windows funktioniert. Das universell nutzbare Verzeichnistrennzeichen ist das /</p> <p>Mit welchen Stringoperationen Du einen Pfadnamen mit Unterverzeichnis zusammensetzt - muss ich Dir das wirklich erklären ? Du hast das Verzeichnis deines aktuellen Scripts in <strong>DIR</strong>, du hast den Basisnamen der Page, du möchtest einen Verzeichnisnamen dazwischen schieben und .php hinten anhängen. Das kannst Du <strong>bestimmt</strong> selbst.</p> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Fri, 11 Mar 22 08:03:26 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797247#m1797247 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797247#m1797247 <p>Hallo Tobias,</p> <p>du hast natürlich recht, das \ ist ein Windowsismus und <strong>DIR</strong> ist für eine Adressierung relativ zum einbindenden File eine gute Lösung.</p> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Fri, 11 Mar 22 12:43:16 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797267#m1797267 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797267#m1797267 <p>Schau mal, das Ganze sieht jetzt so bei mir aus:</p> <pre><code class="block language-php"><span class="token variable">$page_found</span> <span class="token operator">=</span> <span class="token constant boolean">false</span><span class="token punctuation">;</span> <span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token operator">!</span><span class="token keyword">empty</span><span class="token punctuation">(</span><span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string double-quoted-string">"page"</span><span class="token punctuation">]</span><span class="token punctuation">)</span> <span class="token operator">&&</span> <span class="token function">preg_match</span><span class="token punctuation">(</span><span class="token string double-quoted-string">"/^[a-z]+$/i"</span><span class="token punctuation">,</span> <span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string double-quoted-string">"page"</span><span class="token punctuation">]</span><span class="token punctuation">)</span> <span class="token operator">==</span> <span class="token number">1</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token variable">$pageFile</span> <span class="token operator">=</span> <span class="token constant">__DIR__</span> <span class="token operator">.</span> <span class="token string double-quoted-string">"/page/"</span> <span class="token operator">.</span> <span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string double-quoted-string">"page"</span><span class="token punctuation">]</span> <span class="token operator">.</span> <span class="token string double-quoted-string">".php"</span><span class="token punctuation">;</span> <span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token function">file_exists</span><span class="token punctuation">(</span><span class="token variable">$pageFile</span><span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">include</span> <span class="token variable">$pageFile</span><span class="token punctuation">;</span> <span class="token variable">$page_found</span> <span class="token operator">=</span> <span class="token constant boolean">true</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> <span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token operator">!</span><span class="token variable">$page_found</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">include</span> <span class="token constant">__DIR__</span> <span class="token operator">.</span> <span class="token string double-quoted-string">"/page/game.php"</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> </code></pre> <p>Ich glaube, ich habe jetzt auch einigermaßen den Aufbau dieses Scripts verstanden. Ich versuche das mal in Worten zu formulieren und würde gerne noch einige Rückfragen stellen.</p> <pre><code class="block language-php"><span class="token variable">$page_found</span> <span class="token operator">=</span> <span class="token constant boolean">false</span><span class="token punctuation">;</span> </code></pre> <p>Erst mal wir die Variable auf <em>false</em> gestellt, damit ihr Status später vom Script abgefragt werden kann.</p> <pre><code class="block language-php"><span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token operator">!</span><span class="token keyword">empty</span><span class="token punctuation">(</span><span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string double-quoted-string">"page"</span><span class="token punctuation">]</span><span class="token punctuation">)</span> <span class="token operator">&&</span> <span class="token function">preg_match</span><span class="token punctuation">(</span><span class="token string double-quoted-string">"/^[a-z]+$/i"</span><span class="token punctuation">,</span> <span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string double-quoted-string">"page"</span><span class="token punctuation">]</span><span class="token punctuation">)</span> <span class="token operator">==</span> <span class="token number">1</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> </code></pre> <p>Wenn der URL-Parameter nicht leer ist, stelle die Bedingung auf, dass der URL-Parameter nach der Variable <strong>?page=</strong> nur aus Buchstaben von A bis Z besteht. Wozu wird das gemacht? Sicherheit?</p> <p>Das <strong>^</strong> ist ein Anker und setzt, denke ich, dort an, wo der URL-Parameter beginnt, nämlich nach dem <strong>?page=</strong>. Ich schätze, das <strong>+$</strong> steht wohl für die Dateiendung (also in dem Fall .php), aber was soll das <strong>/i</strong> bedeuten?</p> <pre><code class="block language-php"><span class="token punctuation">{</span> <span class="token variable">$pageFile</span> <span class="token operator">=</span> <span class="token constant">__DIR__</span> <span class="token operator">.</span> <span class="token string double-quoted-string">"/page/"</span> <span class="token operator">.</span> <span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string double-quoted-string">"page"</span><span class="token punctuation">]</span> <span class="token operator">.</span> <span class="token string double-quoted-string">".php"</span><span class="token punctuation">;</span> <span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token function">file_exists</span><span class="token punctuation">(</span><span class="token variable">$pageFile</span><span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">include</span> <span class="token variable">$pageFile</span><span class="token punctuation">;</span> <span class="token variable">$page_found</span> <span class="token operator">=</span> <span class="token constant boolean">true</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> </code></pre> <p>Danach wird die Variable <strong>$pageFile</strong> als Pfad definiert. <strong>DIR</strong> bedeutet, man geht vom aktuellen Verzeichnis aus und hängt dann den Unterordner <em>page</em> dran, dann den Namen des URL-Paramters, der durch den Link aufgerufen wird und schließlich die Datei-Endung.</p> <p>Wenn die Datei existiert, schreibe das <em>include</em> und setze die anfängliche Variable auf true. An dieser Stelle endet das Script, wenn die Datei bzw. Seite gefunden wurde.</p> <pre><code class="block language-php"><span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token operator">!</span><span class="token variable">$page_found</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">include</span> <span class="token constant">__DIR__</span> <span class="token operator">.</span> <span class="token string double-quoted-string">"/page/game.php"</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> </code></pre> <p>Sollte die Datei nicht gefunden werden und bleibt die Variable <strong>$page_found</strong> deshalb auf <em>false</em>, dann wird standardmäßig die Seite game.php aufgerufen.</p> <p>Hier könnte man es wohl noch so schreiben, dass es nicht immer nur mit der Datei <em>game.php</em> funktioniert, sondern z.B. die Datei aufgerufen wird, die den Zusatz <em>.default</em> enthält, also etwa <em>game.default.php</em>, dann wäre man nicht so limitiert, wäre mal keine game.php da.</p> <p>Wie müsste man denn den Einzeiler umschreiben, damit das obige (ausführliche) Script ausgeführt wird. Momentan sieht er so aus:</p> <pre><code class="block language-php"><span class="token variable">$pageFile</span> <span class="token operator">=</span> <span class="token string double-quoted-string">".//"</span> <span class="token operator">.</span> <span class="token punctuation">(</span><span class="token keyword">empty</span><span class="token punctuation">(</span><span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string double-quoted-string">"page"</span><span class="token punctuation">]</span><span class="token punctuation">)</span> <span class="token operator">||</span> <span class="token operator">!</span><span class="token function">preg_match</span><span class="token punctuation">(</span><span class="token string double-quoted-string">"/^[a-z]+$/i"</span><span class="token punctuation">,</span> <span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string double-quoted-string">"page"</span><span class="token punctuation">]</span><span class="token punctuation">)</span> <span class="token operator">?</span> <span class="token string double-quoted-string">"game"</span> <span class="token punctuation">:</span> <span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string double-quoted-string">"page"</span><span class="token punctuation">]</span><span class="token punctuation">)</span> <span class="token operator">.</span> <span class="token string double-quoted-string">".page.php"</span><span class="token punctuation">;</span> <span class="token function">file_exists</span><span class="token punctuation">(</span><span class="token variable">$pageFile</span><span class="token punctuation">)</span> <span class="token operator">&&</span> <span class="token keyword">include</span> <span class="token variable">$pageFile</span><span class="token punctuation">;</span> </code></pre> <p>Meine Versuche haben bisher leider nicht geklappt.</p> <hr> <p>Entschuldigt den langen Posting, aber ich wollte noch auf etwas zurückkommen. Oben hast du als best practice Folgendes geschrieben:</p> <blockquote> <p>Also - best practice wäre:</p> <ul> <li><s>die URLs in den Tabs ohne Fragezeichen und ohne # notieren. Also genau so, wie sie jetzt sind.</s></li> <li>am Server in der .htaccess per mod_rewrite dafür sorgen, dass Tab-Namen als ?tab=... an index.php angehängt werden. Falls irgendein Heini direkt die index.php abruft, kommt halt index.php?tab=index.php an. Ja und? Ist ein ungültiger Tab-Name, und:</li> <li><s>in index.php den tab-Parameter verarbeiten <strong>und auf gültige Tab-Namen validieren</strong>. Für ungültige oder fehlende Tabnamen das Default-Tab includen</s></li> <li>als progressive enhancement einen click-Handler auf die Tabs legen, der die Page per Ajax holt und per pushState so tut, als wär's über den Server gelaufen.</li> </ul> </blockquote> <p>Ich habe mal gestrichen, was ich bereits leisten kann.</p> <p>Übrig bleibt also die Geschichte mit <em><strong>.htaccess</strong></em> (würde ich zum Schluss angehen) und das mit dem <em><strong>pushState</strong></em>. Ich habe nicht ganz verstande, wie das funktioniert und wozu das gut ist (Sicherheit?).</p> <p>Boris</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Fri, 11 Mar 22 11:50:09 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797262#m1797262 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797262#m1797262 <blockquote> <p>Wie sieht dein Code aktuell aus?</p> </blockquote> <pre><code class="block language-php"><span class="token variable">$pageFile</span> <span class="token operator">=</span> <span class="token string double-quoted-string">".\\"</span> <span class="token operator">.</span> <span class="token punctuation">(</span><span class="token keyword">empty</span><span class="token punctuation">(</span><span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string double-quoted-string">"page"</span><span class="token punctuation">]</span><span class="token punctuation">)</span> <span class="token operator">||</span> <span class="token operator">!</span><span class="token function">preg_match</span><span class="token punctuation">(</span><span class="token string double-quoted-string">"/^[a-z]+$/i"</span><span class="token punctuation">,</span> <span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string double-quoted-string">"page"</span><span class="token punctuation">]</span><span class="token punctuation">)</span> <span class="token operator">?</span> <span class="token string double-quoted-string">"game"</span> <span class="token punctuation">:</span> <span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string double-quoted-string">"page"</span><span class="token punctuation">]</span><span class="token punctuation">)</span> <span class="token operator">.</span> <span class="token string double-quoted-string">".page.php"</span><span class="token punctuation">;</span> <span class="token function">file_exists</span><span class="token punctuation">(</span><span class="token variable">$pageFile</span><span class="token punctuation">)</span> <span class="token operator">&&</span> <span class="token keyword">include</span> <span class="token variable">$pageFile</span><span class="token punctuation">;</span> </code></pre> <p>Danke! Funktioniert jetzt auch so! Musste zudem noch die Klammer vor <code>empty</code> schließen.</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Fri, 11 Mar 22 11:58:58 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797263#m1797263 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797263#m1797263 <blockquote> <p>ein Zweitstudium in Informatik hilft Dir da weniger, die lernten früher mal Pascal und heute Java. Mit so ekligen Dingen wie PHP gibt sich doch kein hehrer Prof ab. Da musst Du Dir schon jahrelang die Finger in Niederungen wie Selfhtml schmutzig machen, lesen lesen lesen, und hinreichend oft selbst Fehler machen <strong>und selbst finden</strong>. Programmieren lernen ist wie ein verstauchter Knöchel. Tut weh und braucht Zeit. Und wenn er dann heile ist, rennst Du wie ein junger Gott - bis zum nächsten Stolperstein (d.h. der nächsten SuperDuper Library, die grunzend durch's Dorf gehyped wird) - echt erstaunlich, wie weit diese Metapher reicht .</p> </blockquote> <p>Tja, ich schätze, wenn man ein so komisches Hobby hat wie ich und auch noch eine Webseite dazu erstellen möchte, dann muss man wohl da durch. Vor 5 oder 6 Jahren wusste ich noch nicht mal, was ein div ist. Es gibt furchtbar viel zu wissen und zu lernen. Ich schätze, die nächste große Hürde wird für mich die Suchfunktion und dann evtl. noch das Erstellen von Accounts (phpMyAdmin?) sein. Na ja, zum Glück gibt es ja Menschen wie euch hier, die einem helfen. Ich sollte mir auch möglicherweise mal Bücher zu bestimmten Programmiersprachen kaufen.</p> <blockquote> <p>Mein Stolperstein war das \ - Tobias hat ganz recht, das gehört da überhaupt nicht hin weil es nur unter Windows funktioniert. Das universell nutzbare Verzeichnistrennzeichen ist das /</p> </blockquote> <p>Das habe ich geändert! Danke für den Hinweis von Tobias.</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Fri, 11 Mar 22 12:13:54 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797264#m1797264 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797264#m1797264 <p>Hallo borisbaer,</p> <blockquote> <p>das Erstellen von Accounts</p> </blockquote> <p>Dafür brauchst Du eine eigene Userverwaltung, eine Login-Seite und eine Kontrolle des Logins über die Session. Die Userverwaltung kann in einer Datei oder einer Datenbank liegen. Wichtig ist nur: Speichere keine Klartextpassworte. <a href="https://www.php.net/manual/de/function.password-hash" rel="nofollow noopener noreferrer">Passworte werden gehasht</a> und man speichert nur den Hash. Beim Loginversucht wird das Passwort <a href="https://www.php.net/manual/de/function.password-verify.php" rel="nofollow noopener noreferrer">gegen den Hash geprüft</a>. Das verhindert, dass jemand deinen Passwortspeicher abgreift. Heißt auch: Wenn Du die User in einer Datei speicherst, darf diese Datei nicht über das Web downloadbar sein. Das kann man durch Ablage außerhalb des Web-Root oder durch eine Sperre desw Ablageordners mittels .htaccess erreichen.</p> <p>Ein Login-System hatten wir mal im Wiki, es wurde aber <a href="https://wiki.selfhtml.org/wiki/PHP/Tutorials/Loginsystem#Kein_fertiges_Loginsystem" rel="nofollow noopener noreferrer">aus Gründen depubliziert</a>. Hinter dem Link findest Du Tipps und Verweise auf Quellen.</p> <blockquote> <p>Ich sollte mir auch möglicherweise mal Bücher zu bestimmten Programmiersprachen kaufen.</p> </blockquote> <p>Jo, PHP, SQL, HTML, CSS, JavaScript - Literatur dazu veraltet allerdings schneller, als sich ein <a href="https://www.thediscworld.de/index.php/B%C3%BCcherwurm_.303" rel="nofollow noopener noreferrer">Bücherwurm .303</a> durchfressen kann. Du musst immer auch ein Auge auf die Onlinequellen behalten.</p> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Fri, 11 Mar 22 13:46:00 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797270#m1797270 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797270#m1797270 <p>Hallo,</p> <blockquote> <pre><code class="block language-php"><span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token operator">!</span><span class="token keyword">empty</span><span class="token punctuation">(</span><span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string double-quoted-string">"page"</span><span class="token punctuation">]</span><span class="token punctuation">)</span> <span class="token operator">&&</span> <span class="token function">preg_match</span><span class="token punctuation">(</span><span class="token string double-quoted-string">"/^[a-z]+$/i"</span><span class="token punctuation">,</span> <span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string double-quoted-string">"page"</span><span class="token punctuation">]</span><span class="token punctuation">)</span> <span class="token operator">==</span> <span class="token number">1</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> </code></pre> <p>Wenn der URL-Parameter nicht leer ist, stelle die Bedingung auf, dass der URL-Parameter nach der Variable <strong>?page=</strong> nur aus Buchstaben von A bis Z besteht. Wozu wird das gemacht? Sicherheit?</p> </blockquote> <p>in gewisser Weise ja. Damit ist sichergestellt, dass der Parameter nicht irgendwelche Zeichen enthält (Slash, Punkte o.ä.), mit denen man im Verzeichnisbaum rumwandern und ganz superinteressante Daten abgreifen könnte.</p> <blockquote> <p>Das <strong>^</strong> ist ein Anker und setzt, denke ich, dort an, wo der URL-Parameter beginnt, nämlich nach dem <strong>?page=</strong>.</p> </blockquote> <p>Einfacher gesagt: Am Stringanfang.</p> <blockquote> <p>Ich schätze, das <strong>+$</strong> steht wohl für die Dateiendung (also in dem Fall .php)</p> </blockquote> <p>Nein. Das Pluszeichen bezieht sich auf das verhergehende Zeichen (in diesem Fall die Zeichenklasse [a-z]) und bedeutet: Mindestens eins davon, gern aber auch mehr.</p> <blockquote> <p>aber was soll das <strong>/i</strong> bedeuten?</p> </blockquote> <p>Case <strong>i</strong>nsensitive, so dass dein Suchmuster auch Großbuchstaben matcht.</p> <blockquote> <p>Sollte die Datei nicht gefunden werden und bleibt die Variable <strong>$page_found</strong> deshalb auf <em>false</em>, dann wird standardmäßig die Seite game.php aufgerufen.</p> </blockquote> <p>Und warum so umständlich? Ein einfaches <strong>else</strong> würde genügen, und du bräuchtest dich und andere Leser nicht mit einer zusätzlichen Flag-Variablen zu verwirren.</p> <p>Einen schönen Tag noch<br>  Martin</p> <div class="signature">-- <br> Мир для України. </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Sun, 13 Mar 22 06:52:45 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797315#m1797315 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797315#m1797315 <p>Hallo,</p> <blockquote> <p>An dieser Stelle endet das Script, wenn die Datei bzw. Seite gefunden wurde.</p> </blockquote> <p>Diese Formulierung stört mich.</p> <p>Vielleicht meinst das richtige, aber das Script weiß nicht, dass du jetzt zufrieden bist und endet deshalb, sondern läuft brav bis zum Schluss, auch wenns da nix mehr zu tun gibt.</p> <p>Gruß<br> Kalk</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Fri, 11 Mar 22 15:17:17 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797274#m1797274 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797274#m1797274 <p>Hallo Martin,</p> <blockquote> <p>Ein einfaches else würde genügen,</p> </blockquote> <p>nein, genügt nicht, weil es ja ein zweistufiges if ist. Es gibt unterschiedliche Auslöser für den Einsatz des Default-Tab.</p> <p>Wenn man auf Flags verzichten will, und mindestens PHP 7 hat, könnte man mit Hilfe des null coalescing Operator ?? die Sache schick machen. Ich würde dann aber auch noch ein paar Funktionen benutzen.</p> <pre><code class="block language-php"><span class="token keyword">function</span> <span class="token function-definition function">getTabFile</span><span class="token punctuation">(</span><span class="token variable">$pageName</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token variable">$pageName</span> <span class="token operator">==</span> <span class="token constant">null</span><span class="token punctuation">)</span> <span class="token keyword">return</span> <span class="token constant">null</span><span class="token punctuation">;</span> <span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token function">preg_match</span><span class="token punctuation">(</span><span class="token string double-quoted-string">"/^[a-z]+$/i"</span><span class="token punctuation">,</span> <span class="token variable">$pageName</span><span class="token punctuation">)</span> <span class="token operator">!=</span> <span class="token number">1</span><span class="token punctuation">)</span> <span class="token keyword">return</span> <span class="token constant">null</span><span class="token punctuation">;</span> <span class="token variable">$fileName</span> <span class="token operator">=</span> <span class="token function">getTabFileName</span><span class="token punctuation">(</span><span class="token variable">$pageName</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token function">file_exists</span><span class="token punctuation">(</span><span class="token variable">$fileName</span><span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token keyword">return</span> <span class="token variable">$fileName</span><span class="token punctuation">;</span> <span class="token keyword">return</span> <span class="token constant">null</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token keyword">function</span> <span class="token function-definition function">getDefaultTabFile</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">return</span> <span class="token function">getTabFileName</span><span class="token punctuation">(</span><span class="token string single-quoted-string">'default'</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token keyword">function</span> <span class="token function-definition function">getTabFileName</span><span class="token punctuation">(</span><span class="token variable">$tab</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">return</span> <span class="token constant">__DIR__</span> <span class="token operator">.</span> <span class="token string double-quoted-string">"/page/<span class="token interpolation"><span class="token variable">$tab</span></span>.php"</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token keyword">include</span> <span class="token punctuation">(</span><span class="token function">getTabFile</span><span class="token punctuation">(</span><span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string single-quoted-string">'page'</span><span class="token punctuation">]</span> <span class="token operator">??</span> <span class="token constant">null</span><span class="token punctuation">)</span> <span class="token operator">??</span> <span class="token function">getDefaultTabFile</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre> <p>Von innen nach außen:</p> <p><code>$x = $_GET['page'] ?? null</code> ist die Kurzfassung von</p> <pre><code class="block language-php"><span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token keyword">empty</span><span class="token punctuation">(</span><span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string single-quoted-string">'page'</span><span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token variable">$x</span> <span class="token operator">=</span> <span class="token constant">null</span><span class="token punctuation">;</span> <span class="token keyword">else</span> <span class="token variable">$x</span> <span class="token operator">=</span> <span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string single-quoted-string">'page'</span><span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre> <p>Man nennt das ?? den "null coalescing operator" - der kommt aus C# und Java und ist eine kompakte Methode, für NULL einen Alternativwert zu erzeugen. In diesem Fall ist die Alternative wieder <code>null</code>, der Zweck des ?? ist lediglich, einen fehlenden <code>page</code> Eintrag im $_GET nicht als Fehler aufscheinen zu lassen.</p> <p>Die Funktion getTabFile bekommt den so ermittelten Tab-Namen als Parameter und prüft der Reihe nach:</p> <ul> <li>ist er null - gib null zurück. Was dann passiert, schreibe ich gleich.</li> <li>passt er auf das zulässige Namensmuster. Wenn nicht, gib null zurück</li> <li>Bilde nun den Dateinamen für den Tab. Gibt's die Datei, gib den Namen zurück. Der Dateiname wird mit Hilfe einer Funktion gebildet, weil das in der nächsten Funktion auch gebraucht wird. DRY Code - Don't Repeat Yourself.</li> <li>Sonst gib Null zurück</li> </ul> <p>Heißt also: getTabFile liefert entweder den Namen einer zulässigen Tab-Datei, oder NULL. Und nun kommt ein weiterer ?? Operator, der das behandelt:</p> <p><code>getTabFile(...) ?? getDefaultTab()</code></p> <p>Die Funktion getDefaultTab() hat die Aufgabe, den Namen des Default-Tabs zurückzugeben. Im einfachsten Fall ist das eine Konstante, wie oben gezeigt. Im Ergebnis habe ich also nun den vom Client angegebenen Tab-Namen validiert und als Dateiname umgewandelt, oder den Default-Tab als Dateinamen. Und das wird dann an include weitergegeben.</p> <p><code>include ( getTabFile(...) ?? getDefaultTab() );</code></p> <p>Wenn man den Default-Tab flexibler benennen möchte, wird es komplizierter. Wenn der Default-Name bspw. <code>game.default.tab</code> ist, dann muss <code>getTabFile</code> damit umgehen können. Der Browser würde das <code>game</code> Tab anfordern, und der Dateiname könnte nun <code>game.default.php</code> oder <code>game.php</code> heißen. Man müsste nun beide Dateinamen abfragen. Und getDefaultTab müsste im page-Ordner mit <code>glob</code> oder <code>scandir</code> oder <code>opendir</code>/<code>readdir</code>/<code>closedir</code> nach einer Datei zum Muster "*.default.php" suchen. Geht natürlich, ist aber lästig. Ich persönlich würde das nicht tun. Der Client kann ja gerne ein Tab namens 'game' anfordern. Aber eine game.php Datei gibt's nicht, und er bekommt die default.php - fertig.</p> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Fri, 11 Mar 22 16:30:39 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797277#m1797277 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797277#m1797277 <p>Sieh mal: <a href="http://54598532.swh.strato-hosting.eu/games/demons-souls/savegame" rel="nofollow noopener noreferrer">http://54598532.swh.strato-hosting.eu/games/demons-souls/savegame</a></p> <p>Jetzt funktioniert es sowohl mit den URL-Parametern als auch mit der RewriteRule für den Query-String. Also erst mal: Yay~! Ein großes Stück bewältigt! Vielen, vielen Dank! </p> <p>Nun habe ich jedoch das Problem, dass die class <em>.current</em> nicht mehr an die Tabs gehängt wird, um den jeweils aktiven Tab hervorzuheben.</p> <p>Für deine Best-Practice-Lösung fehlt dann eigentlich nur noch eine Sache:</p> <blockquote> <ul> <li>als progressive enhancement einen click-Handler auf die Tabs legen, der die Page per Ajax holt und per pushState so tut, als wär's über den Server gelaufen.</li> </ul> </blockquote> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Fri, 11 Mar 22 16:52:42 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797278#m1797278 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797278#m1797278 <p>Hallo Rolf,</p> <blockquote> <blockquote> <p>Ein einfaches else würde genügen,</p> </blockquote> <p>nein, genügt nicht, weil es ja ein zweistufiges if ist. Es gibt unterschiedliche Auslöser für den Einsatz des Default-Tab.</p> </blockquote> <p>ja, du formulierst insgesamt drei Bedingungen, die alle erfüllt sein müssen. Aber du verteilst sie auf zwei if-Statements anstatt eine UND-Verknüpfung aller drei Bedingungen in einem if-Ausdruck zu formulieren.</p> <p>Ich würde das daher zusammenfassen und vereinfachen:</p> <blockquote> <pre><code class="block language-php"><span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token operator">!</span><span class="token keyword">empty</span><span class="token punctuation">(</span><span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string double-quoted-string">"page"</span><span class="token punctuation">]</span><span class="token punctuation">)</span> <span class="token operator">&&</span> <span class="token function">preg_match</span><span class="token punctuation">(</span><span class="token string double-quoted-string">"/^[a-z]+$/i"</span><span class="token punctuation">,</span> <span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string double-quoted-string">"page"</span><span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token operator">==</span><span class="token number">1</span> <span class="token operator">&&</span> <span class="token function">file_exists</span><span class="token punctuation">(</span><span class="token variable">$pageFile</span> <span class="token operator">=</span> <span class="token constant">__DIR__</span> <span class="token operator">.</span> <span class="token string double-quoted-string">"/page/"</span> <span class="token operator">.</span> <span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string double-quoted-string">"page"</span><span class="token punctuation">]</span> <span class="token operator">.</span> <span class="token string double-quoted-string">".php"</span><span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">include</span> <span class="token variable">$pageFile</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token keyword">else</span> <span class="token punctuation">{</span> <span class="token keyword">include</span> <span class="token constant">__DIR__</span> <span class="token operator">.</span> <span class="token string double-quoted-string">"/page/game.php"</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> </code></pre> </blockquote> <p>Das könnte man unter Verwendung des ternären Operators sogar noch zu <strong>einem</strong> Ausdruck aufhübschen.</p> <p>Einen schönen Tag noch<br>  Martin</p> <div class="signature">-- <br> Мир для України. </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Fri, 11 Mar 22 17:08:41 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797280#m1797280 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797280#m1797280 <p>Hallo borisbaer,</p> <blockquote> <p>Nun habe ich jedoch das Problem, dass die class .current nicht mehr an die Tabs gehängt wird,</p> </blockquote> <p>Es gibt da zwei Aspekte.</p> <p>(1) Wenn die Seite initial per URL geladen wird, muss das .current vom PHP an das Tab gesetzt werden.</p> <p>Alternativ müsstest Du JavaScript laufen lassen, das das beim Laden der Seite tut, was aber nicht trivial ist; du müsstest dann aus der URL auf das Tab rückschließen. In PHP ist es einfacher.</p> <p>In PHP heißt das auch: Du musst den angeforderten Tab-Namen ermitteln, bevor Du die Links ausgibst, sonst weißt Du bei deren Ausgabe nicht, wo das class='current' hingehört. Beim bisher diskutierten Code wurde das nicht bedacht. D.h. da steht ein Umbau an. Good Luck!</p> <p>(2) Derzeit ist dein Ajax außer Funktion, der Tabwechsel erfolgt rein über PHP. Dein click-Handler auf den Links wird nicht aufgerufen. Warum?</p> <pre><code class="block language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>nav</span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>tabs<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>a</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>tab<span class="token punctuation">"</span></span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>game<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Spiel<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>a</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>a</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>tab<span class="token punctuation">"</span></span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>releases<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Releases<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>a</span><span class="token punctuation">></span></span> ... <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>nav</span><span class="token punctuation">></span></span> </code></pre> <pre><code class="block language-js"><span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"body"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">on</span><span class="token punctuation">(</span><span class="token string">"click"</span><span class="token punctuation">,</span> <span class="token string">".tabs .tab"</span><span class="token punctuation">,</span> <span class="token keyword">function</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token operator">...</span> <span class="token punctuation">}</span> <span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre> <p>Na? Verdien Dir ein Fleißkärtchen. Was ist falsch? Warum wird die Funktion nicht aufgerufen?</p> <p>Der jetztige click-Handler ergibt auch keinen Sinn mehr. Er setzt die current-Class als Reaktion auf einen Klick auf einen Link, was bedeutet: gleich als nächstes lädt der Browser die Seite neu und dein Werk löst sich in Staub auf. Ohne den Ajax-Call kannst Du die Reaktion auf click auch weglassen.</p> <p>Der Ajax-Abruf muss natürlich berücksichtigen, dass die Tab-Scripte nun in einem page-Ordner stehen, und das in die URL einbauen. Und dann muss er die Seite laden, und dem Browser sagen, dass er den Klick auf den Link <a href="https://api.jquery.com/event.preventdefault/" rel="nofollow noopener noreferrer">nicht verarbeiten</a> soll. Das hattest Du doch schon mal drin, oder?</p> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Fri, 11 Mar 22 17:17:55 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797282#m1797282 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797282#m1797282 <p>Hallo Martin,</p> <pre><code class="block bad language-php"><span class="token function">file_exists</span><span class="token punctuation">(</span><span class="token variable">$pageFile</span> <span class="token operator">=</span> <span class="token constant">__DIR__</span> <span class="token operator">.</span> <span class="token string double-quoted-string">"/page/"</span> <span class="token operator">.</span> <span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string double-quoted-string">"page"</span><span class="token punctuation">]</span> <span class="token operator">.</span> <span class="token string double-quoted-string">".php"</span><span class="token punctuation">)</span><span class="token punctuation">)</span> </code></pre> <h3> </h3><p>Gerade zum</p> <blockquote> <p>aufhübschen</p> </blockquote> <p>habe ich dein Konstrukt nicht gewählt. Ich hatte es mal. Und dann dachte ich: Rolf, schreib lesbaren Code. Dass ich auch zur unlesbaren Kompaktvariante fähig bin, habe ich ja mit dem Zweizeiler belegt. Das sollte aber abschrecken und nicht als Muster dienen.</p> <p>Es gibt Programmiersprachen, in denen man einzeilige Programme beliebiger Komplexität verfassen kann. APL zum Beispiel. C gehört auch dazu. Aber in PHP, vor allem wenn ein Nichtexperte den Code verwenden soll, sollte man das nicht tun. Ein Schalter ist nervig, ja. Aber eine Zuweisung in den Argumenten einer Funktion zu verstecken ist etwas, das man einem Minifizierer überlassen und keinesfalls als musterhaften Code präsentieren sollte. Dann lieber meine funktionale Variante.</p> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Fri, 11 Mar 22 20:39:59 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797292#m1797292 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797292#m1797292 <blockquote> <p>In PHP heißt das auch: Du musst den angeforderten Tab-Namen ermitteln, bevor Du die Links ausgibst, sonst weißt Du bei deren Ausgabe nicht, wo das class='current' hingehört. Beim bisher diskutierten Code wurde das nicht bedacht. D.h. da steht ein Umbau an. Good Luck!</p> </blockquote> <p>Werde ich brauchen. Irgendwie muss PHP erkennen, welche Seite geladen wurde.</p> <blockquote> <pre><code class="block language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>nav</span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>tabs<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>a</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>tab<span class="token punctuation">"</span></span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>game<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Spiel<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>a</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>a</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>tab<span class="token punctuation">"</span></span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>releases<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Releases<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>a</span><span class="token punctuation">></span></span> ... <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>nav</span><span class="token punctuation">></span></span> </code></pre> <pre><code class="block language-js"><span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"body"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">on</span><span class="token punctuation">(</span><span class="token string">"click"</span><span class="token punctuation">,</span> <span class="token string">".tabs .tab"</span><span class="token punctuation">,</span> <span class="token keyword">function</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token operator">...</span> <span class="token punctuation">}</span> <span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre> <p>Na? Verdien Dir ein Fleißkärtchen. Was ist falsch? Warum wird die Funktion nicht aufgerufen?</p> </blockquote> <p>Na ja, also erst mal steht oben id und unten .tabs, also als class. Ich weiß nicht, ob du darauf hinauswolltest.</p> <p>Zum anderen reicht nun <code>$("#tabs .tab").click(function()</code> zu schreiben.</p> <blockquote> <p>Der Ajax-Abruf muss natürlich berücksichtigen, dass die Tab-Scripte nun in einem page-Ordner stehen, und das in die URL einbauen. Und dann muss er die Seite laden, und dem Browser sagen, dass er den Klick auf den Link <a href="https://api.jquery.com/event.preventdefault/" rel="nofollow noopener noreferrer">nicht verarbeiten</a> soll.</p> </blockquote> <p>Hm, den Ajax-Abruf gibt’s ja jetzt gar nicht mehr.</p> <blockquote> <p>Das hattest Du doch schon mal drin, oder?</p> </blockquote> <p>Ich glaube nicht, ich weiß aber nicht genau, was du meinst.</p> <p>Boris</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Fri, 11 Mar 22 18:57:28 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797287#m1797287 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797287#m1797287 <p>Hallo Rolf,</p> <blockquote> <pre><code class="block good language-php"><span class="token function">file_exists</span><span class="token punctuation">(</span><span class="token variable">$pageFile</span> <span class="token operator">=</span> <span class="token constant">__DIR__</span> <span class="token operator">.</span> <span class="token string double-quoted-string">"/page/"</span> <span class="token operator">.</span> <span class="token variable">$_GET</span><span class="token punctuation">[</span><span class="token string double-quoted-string">"page"</span><span class="token punctuation">]</span> <span class="token operator">.</span> <span class="token string double-quoted-string">".php"</span><span class="token punctuation">)</span><span class="token punctuation">)</span> </code></pre> <h3> </h3></blockquote> <p>was denn?? Ich bilde damit nur das Denkschema aus dem wirklichen Leben ab: Einen Ausdruck berechnen und für weitere Verwendung vormerken.</p> <blockquote> <p>Gerade zum</p> <blockquote> <p>aufhübschen</p> </blockquote> <p>habe ich dein Konstrukt nicht gewählt. Ich hatte es mal.</p> </blockquote> <p>Und warum hast du es aufgegeben? Es ist intuitiv, es entspricht der natürlichen Denkweise.</p> <blockquote> <p>Und dann dachte ich: Rolf, schreib lesbaren Code.</p> </blockquote> <p>Genau das habe ich getan. Jedenfalls nach meinen Maßstäben.</p> <blockquote> <p>Es gibt Programmiersprachen, in denen man einzeilige Programme beliebiger Komplexität verfassen kann. APL zum Beispiel. C gehört auch dazu.</p> </blockquote> <p>Es geht nicht darum, Einzeiler zu produzieren. Es geht darum, Programmcode so zu schreiben, dass er den zugrundeliegenden Denkprozess möglichst gut wiedergibt. Deswegen habe ich den vereinfachten Vorschlag gebracht.</p> <blockquote> <p>Aber in PHP, vor allem wenn ein Nichtexperte den Code verwenden soll, sollte man das nicht tun.</p> </blockquote> <p>Warum nicht??</p> <blockquote> <p>Ein Schalter ist nervig, ja. Aber eine Zuweisung in den Argumenten einer Funktion zu verstecken ist etwas, das man einem Minifizierer überlassen und keinesfalls als musterhaften Code präsentieren sollte.</p> </blockquote> <p>Da bin ich komplett anderer Meinung.</p> <p>Einen schönen Tag noch<br>  Martin</p> <div class="signature">-- <br> Мир для України. </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Fri, 11 Mar 22 19:11:23 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797288#m1797288 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797288#m1797288 <p>Hallo Martin,</p> <blockquote> <p>Ich bilde damit nur das Denkschema aus dem wirklichen Leben ab: Einen Ausdruck berechnen und für weitere Verwendung vormerken.</p> </blockquote> <p>Das kannst Du ja tun. Aber dann bitte als eigene Zeile. Es in einem Funktionsaufruf zu tun, der dazu noch in einer Bedingung drin steckt, das ist zu viel auf einmal.</p> <blockquote> <p>den zugrundeliegenden Denkprozess möglichst gut wiedergibt</p> </blockquote> <pre><code class="block language-php"><span class="token variable">$name</span> <span class="token operator">=</span> <span class="token constant">__DIR__</span> <span class="token operator">.</span> <span class="token string double-quoted-string">"foo.php"</span><span class="token punctuation">;</span> <span class="token keyword">if</span> <span class="token function">file_exists</span><span class="token punctuation">(</span><span class="token variable">$name</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token punctuation">}</span> </code></pre> <p>und</p> <pre><code class="block language-php"><span class="token keyword">if</span> <span class="token function">file_exists</span><span class="token punctuation">(</span><span class="token variable">$name</span> <span class="token operator">=</span> <span class="token constant">__DIR__</span> <span class="token operator">.</span> <span class="token string double-quoted-string">"foo.php"</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token punctuation">}</span> </code></pre> <p>sind durchaus Zeichen verschiedener Denkprozesse. Der erste besagt: Ich baue mir den Namen zusammen, und damit mach ich dann weiter. Der zweite besagt: Ich muss den Dateinamen prüfen - ach, den muss ich ja zusammenbauen - ups, merken muss ich ihn mir auch noch.</p> <p>Der erste Prozess ist strukturiert und geplant, der zweite ist spontan und chaotisch. Es sieht zumindest so aus. Natürlich hast Du nachgedacht bevor Du das geschrieben hast. Aber Du hast Dich durch eine Mikrooptimierung einfangen lassen.</p> <p>Es ist auch eine Frage der Erwartungshaltung. In einer Abfrage erwarte ich, das ein Zustand geprüft wird. Bei einem Funktionsaufruf erwarte ich, dass vorhandene Werte übergeben werden. In beiden Fällen erwarte ich ausdrücklich nicht, dass Werte als Seiteneffekt verändert werden.</p> <p>Beim Programmieren muss man schon genug nachdenken. Es durch ein Suchspiel anzureichern, wo sich Zuweisungen verstecken könnten, ist kontraproduktiv.</p> <p>Wie gesagt und gezeigt - wenn der Schalter stört, baut man den Code besser funktional um. Der kleine Assemblerprogrammierer in mir schreit dabei natürlich auf. „Aber die Laufzeit!!!“. Quark. Der file_exists braucht um Größenordnungen mehr Zeit.</p> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Fri, 11 Mar 22 19:24:34 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797289#m1797289 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797289#m1797289 <p>Hallo,</p> <blockquote> <blockquote> <p>Ich bilde damit nur das Denkschema aus dem wirklichen Leben ab: Einen Ausdruck berechnen und für weitere Verwendung vormerken.</p> </blockquote> <p>Das kannst Du ja tun. Aber dann bitte als eigene Zeile.</p> </blockquote> <p>nein, das eben gerade nicht. Es ist <strong>ein</strong> gedanklicher Schritt. Ihn in zwei oder mehr Programmzeilen zu splitten, macht die Sache schwerer nachvollziehbar, weil zusammengehörende Dinge getrennt werden.</p> <blockquote> <p>Es in einem Funktionsaufruf zu tun, der dazu noch in einer Bedingung drin steckt, das ist zu viel auf einmal.</p> </blockquote> <p>Es ist die mehr oder weniger exakte Abbildung meiner Denkweise.</p> <blockquote> <pre><code class="block language-php"><span class="token variable">$name</span> <span class="token operator">=</span> <span class="token constant">__DIR__</span> <span class="token operator">.</span> <span class="token string double-quoted-string">"foo.php"</span><span class="token punctuation">;</span> <span class="token keyword">if</span> <span class="token function">file_exists</span><span class="token punctuation">(</span><span class="token variable">$name</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token punctuation">}</span> </code></pre> <p>und</p> <pre><code class="block language-php"><span class="token keyword">if</span> <span class="token function">file_exists</span><span class="token punctuation">(</span><span class="token variable">$name</span> <span class="token operator">=</span> <span class="token constant">__DIR__</span> <span class="token operator">.</span> <span class="token string double-quoted-string">"foo.php"</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token punctuation">}</span> </code></pre> <p>sind durchaus Zeichen verschiedener Denkprozesse.</p> </blockquote> <p>Eben. Der erste ist zersplittert, der zweite homogen.<br> Oder anders: Der erste ist Englischunterricht in der fünften Klasse, der zweite ist Shakespeare.</p> <blockquote> <p>Der erste Prozess ist strukturiert und geplant, der zweite ist spontan und chaotisch.</p> </blockquote> <p>Nicht chaotisch, nur systematisch geschachtelt.</p> <p>Einen schönen Tag noch<br>  Martin</p> <div class="signature">-- <br> Мир для України. </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Fri, 11 Mar 22 19:33:39 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797290#m1797290 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797290#m1797290 <p>Hallo Martin,</p> <p>let's agree to disagree...</p> <blockquote> <p>Der erste ist Englischunterricht in der fünften Klasse, der zweite ist Shakespeare.</p> </blockquote> <p>Ein sehr nützliches Bild. Genausowenig wie Du einem Fünftklässler Shakespeare vorsetzt, solltest Du borisbaer deine geschachtelte Denke vorsetzen.</p> <p>Two beer or not two beer? Prost!</p> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Fri, 11 Mar 22 21:08:10 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797293#m1797293 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797293#m1797293 <p>Hallo borisbaer,</p> <p>genau, der Selektor passte nicht.</p> <p>Einen Tab-Wechsel per Ajax-Aufruf hattest Du drin. Das weiß ich ziemlich genau, das war doch der Einstieg in den Thread. Und dann wolltest Du den Tab-Namen in der URL haben.</p> <p>Der Code, den du vor 3 Tagen um 14:40 gepostet hast, enthielt noch den Ajax Aufruf. Oh, hey, der enthielt auch den #tabs Selektor…</p> <p>Willst du den direkten Tab-Wechsel ohne Neuaufbau der Seite jetzt nicht mehr? Ich dachte, das wäre dein Ziel gewesen.</p> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Fri, 11 Mar 22 21:17:38 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797294#m1797294 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797294#m1797294 <blockquote> <p>genau, der Selektor passte nicht.</p> </blockquote> <p> </p> <blockquote> <p>Einen Tab-Wechsel per Ajax-Aufruf hattest Du drin. Das weiß ich ziemlich genau, das war doch der Einstieg in den Thread. Und dann wolltest Du den Tab-Namen in der URL haben.</p> </blockquote> <p>Genau!</p> <blockquote> <p>Der Code, den du vor 3 Tagen um 14:40 gepostet hast, enthielt noch den Ajax Aufruf. Oh, hey, der enthielt auch den #tabs Selektor…</p> </blockquote> <p>Hm, ich hatte einmal #tabs .tab und einmal .tabs .tab. Ich weiß, nicht sehr kreativ. Das mit der id war für die AJAX-Tabs gedacht und das mit der class für diese nicht-dynamischen Tabs (unter dem Tab <em>Savegame</em> (du hattest mich mal darauf angesprochen)).</p> <blockquote> <p>Willst du den direkten Tab-Wechsel ohne Neuaufbau der Seite jetzt nicht mehr? Ich dachte, das wäre dein Ziel gewesen.</p> </blockquote> <p>Ja, sicher doch, aber puh, ich weiß nicht mal, wie ich da ansetzen sollte. </p> <p>Boris</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Sat, 12 Mar 22 06:19:24 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797296#m1797296 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797296#m1797296 <p>Hallo borisbaer,</p> <blockquote> <p>Ja, sicher doch, aber puh, ich weiß nicht mal, wie ich da ansetzen sollte.</p> </blockquote> <p>Du hattest es doch fast schon. Was Du jetzt in PHP gemacht hast, ist wichtig für den Erstabruf, falls ein Tab gebookmarked wurde, und für den Fall, dass JavaScript beim User nicht läuft (weil abgeschaltet oder weil main.js auf der Leitung versumpft ist).</p> <p>Es fehlt nur noch</p> <ul> <li>Reaktivieren des Ajax Calls im Click Handler</li> <li>der Update der URL mittels pushState (siehe <a href="https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797150#m1797150" rel="noopener noreferrer">hier</a>)</li> <li>und ggf. noch eine Ajax-Reaktion auf den "Zurück" Button, das ist aber die Kür und nicht unbedingt nötig. Dafür musst Du das popState Event verarbeiten und den Tab-Namen aus der URL herauslutschen.</li> </ul> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Sat, 12 Mar 22 19:49:14 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797314#m1797314 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797314#m1797314 <blockquote> <p>Es fehlt nur noch</p> <ul> <li>Reaktivieren des Ajax Calls im Click Handler</li> </ul> </blockquote> <pre><code class="block language-javascript"><span class="token function">$</span><span class="token punctuation">(</span> <span class="token string">"#tabs .tab"</span> <span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">click</span><span class="token punctuation">(</span><span class="token keyword">function</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> $<span class="token punctuation">.</span><span class="token function">ajax</span><span class="token punctuation">(</span> <span class="token punctuation">{</span> <span class="token literal-property property">url</span><span class="token operator">:</span> <span class="token keyword">this</span><span class="token punctuation">.</span>href<span class="token punctuation">,</span> <span class="token function-variable function">success</span><span class="token operator">:</span> <span class="token keyword">function</span><span class="token punctuation">(</span> <span class="token parameter">html</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token comment">//</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre> <p>Meinst du das hier?</p> <blockquote> <ul> <li>der Update der URL mittels pushState (siehe <a href="https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797150#m1797150" rel="noopener noreferrer">hier</a>)</li> </ul> </blockquote> <pre><code class="block language-javascript">window<span class="token punctuation">.</span>history<span class="token punctuation">.</span><span class="token function">pushState</span><span class="token punctuation">(</span>state<span class="token punctuation">,</span> <span class="token string">""</span><span class="token punctuation">,</span> <span class="token keyword">new</span> <span class="token class-name">URL</span><span class="token punctuation">(</span>href<span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre> <p>Ich verstehe nicht ganz, was ich mit der Zeile machen soll.</p> <p>Was soll denn bei <em>state</em> rein? Das ist ja eine Variable. Wozu benötige ich sie?</p> <p>Also, ich versuche, die aktuelle Seite in meine URL-History zu pushen, verhindere zuvor aber mithilfe von <code>event.preventDefault();</code>, dass sie aufgerufen. Und wozu das Ganze?</p> <blockquote> <ul> <li>und ggf. noch eine Ajax-Reaktion auf den "Zurück" Button, das ist aber die Kür und nicht unbedingt nötig. Dafür musst Du das popState Event verarbeiten und den Tab-Namen aus der URL herauslutschen.</li> </ul> </blockquote> <p>Leider keine Ahnung, wie das gehen soll. Wie kann ich eine Ajax-Reaktion erstellen?</p> <p>Sorry, ich stehe echt auf dem Schlauch.</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Sun, 13 Mar 22 13:15:17 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797320#m1797320 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797320#m1797320 <p>So, ich habe jetzt verstanden, was wir hier machen. Ich dachte, es ginge immer noch um die Hervorhebung des aktiven Tabs.</p> <p>Mit PHP wird jetzt also immer die default-Seite dynamisch geladen, sobald man die Seite aufruft. Das PHP-Script ist zudem eine Art Fallback, falls Javascript deaktiviert sein sollte. Ansonsten soll der dynamische Inhalt wieder über Ajax aufgerufen werden. Folgenden Code habe ich dafür jetzt zusammen:</p> <pre><code class="block language-javascript"> <span class="token comment">// L O A D - D Y N A M I C - C O N T E N T</span> <span class="token function">$</span><span class="token punctuation">(</span> <span class="token string">"#tabs .tab"</span> <span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">click</span><span class="token punctuation">(</span><span class="token keyword">function</span><span class="token punctuation">(</span> <span class="token parameter">event</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> event<span class="token punctuation">.</span><span class="token function">preventDefault</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token function">$</span><span class="token punctuation">(</span> <span class="token keyword">this</span> <span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">addClass</span><span class="token punctuation">(</span> <span class="token string">"current"</span> <span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">siblings</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">removeClass</span><span class="token punctuation">(</span> <span class="token string">"current"</span> <span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">var</span> href <span class="token operator">=</span> <span class="token function">$</span><span class="token punctuation">(</span> <span class="token keyword">this</span> <span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">attr</span><span class="token punctuation">(</span> <span class="token string">"href"</span> <span class="token punctuation">)</span><span class="token punctuation">;</span> window<span class="token punctuation">.</span>history<span class="token punctuation">.</span><span class="token function">pushState</span><span class="token punctuation">(</span> <span class="token keyword">null</span><span class="token punctuation">,</span> <span class="token string">""</span><span class="token punctuation">,</span> href <span class="token punctuation">)</span><span class="token punctuation">;</span> $<span class="token punctuation">.</span><span class="token function">ajax</span><span class="token punctuation">(</span> <span class="token punctuation">{</span> <span class="token literal-property property">url</span><span class="token operator">:</span> <span class="token keyword">this</span><span class="token punctuation">.</span>href<span class="token punctuation">,</span> <span class="token function-variable function">success</span><span class="token operator">:</span> <span class="token keyword">function</span><span class="token punctuation">(</span> <span class="token parameter">html</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token function">$</span><span class="token punctuation">(</span> <span class="token string">".append"</span> <span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">html</span><span class="token punctuation">(</span> html <span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">return</span> <span class="token boolean">false</span><span class="token punctuation">;</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre> <p>Leider wird jetzt mit diesem Code, die gesamte Seite in <code><div class="append"></div></code> geladen, also zusammen mit header und footer usw. Was läuft da falsch?</p> <p>Außerdem funktioniert der Zurück-Button nicht, wie er soll.</p> <p>Boris</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Sun, 13 Mar 22 12:56:34 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797319#m1797319 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797319#m1797319 <p>Hast recht, habe ich mir hinterher auch gedacht!</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Sun, 13 Mar 22 20:26:23 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797321#m1797321 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797321#m1797321 <p>Hallo borisbaer,</p> <blockquote> <p>Ansonsten soll der dynamische Inhalt wieder über Ajax aufgerufen werden.</p> </blockquote> <p>Genau. Ich war der Meinung, dass genau das dein Ziel war.</p> <blockquote> <p>Mit PHP wird jetzt also immer die default-Seite dynamisch geladen, sobald man die Seite aufruft. Das PHP-Script ist zudem eine Art Fallback, falls Javascript deaktiviert sein sollte.</p> </blockquote> <p>Jein. Ja, weil die Defaultseite damit geladen wird und ja, weil der Fallback ist, und Nein, weil nicht immer die Defaultseite geladen wird.</p> <p>Ich habe das so verstanden, dass Du diese URLs hast (jeweils mit https://<em>domain</em> davor):</p> <pre><code class="block">/games/demons-souls/ Default-Abruf - Zeigt game Tab /games/demons-souls/game Expliziter Abruf des game Tab /games/demons-souls/releases Expliziter Abruf des releases Tab ... /games/demons-souls/savegame Expliziter Abruf des savegame Tab </code></pre> <p>Deine .htaccess würde die URLs so umwandeln</p> <pre><code class="block">/pages/games/demons-souls/index.php /pages/games/demons-souls/index.php?page=game /pages/games/demons-souls/index.php?page=releases ... /pages/games/demons-souls/index.php?page=savegame </code></pre> <p>BTW - eine URL wie /pages/games/demons-souls/, wie sie in deiner Angabe der problematischen URL steht, darfst Du nicht publizieren, denn da funktioniert die Seitennavigation nicht. Dafür ist keine RewriteRule da, wie es scheint. Also: Die URL immer ohne /pages, dann greifen deine Rewrites sauber.</p> <p>Nur der erste Abruf liefert die Defaultseite mit dem Default-Tab, die übrigen liefern die Seite mit einem explizit angegebenen Tab.</p> <p>Aber das ist ja okay so, das erzeugt die Bookmark-Fähigkeit und es ermöglicht die Navigation ohne JavaScript-Support.</p> <pre><code class="block language-js"> <span class="token keyword">var</span> href <span class="token operator">=</span> <span class="token function">$</span><span class="token punctuation">(</span> <span class="token keyword">this</span> <span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">attr</span><span class="token punctuation">(</span> <span class="token string">"href"</span> <span class="token punctuation">)</span><span class="token punctuation">;</span> window<span class="token punctuation">.</span>history<span class="token punctuation">.</span><span class="token function">pushState</span><span class="token punctuation">(</span> <span class="token keyword">null</span><span class="token punctuation">,</span> <span class="token string">""</span><span class="token punctuation">,</span> href <span class="token punctuation">)</span><span class="token punctuation">;</span> $<span class="token punctuation">.</span><span class="token function">ajax</span><span class="token punctuation">(</span> <span class="token punctuation">{</span> <span class="token literal-property property">url</span><span class="token operator">:</span> <span class="token keyword">this</span><span class="token punctuation">.</span>href<span class="token punctuation">,</span> <span class="token function-variable function">success</span><span class="token operator">:</span> <span class="token keyword">function</span><span class="token punctuation">(</span> <span class="token parameter">html</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token operator">...</span> <span class="token punctuation">}</span> <span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre> <p>Hier wird es nun falsch, denn Du hast einen Satz von mir übersehen. Darauf hättest Du auch selbst kommen können, wenn Du das Prinzip deiner Seitenkonstruktion ganz verstanden hättest.</p> <p>Ich schrieb:</p> <p>Der Ajax-Abruf muss natürlich berücksichtigen, dass die Tab-Scripte nun in einem page-Ordner stehen, und das in die URL einbauen.</p> <p>D.h. wenn Du <code>/games/demons-souls/releases</code> abrufst, dann läuft dein index.php an und liefert die komplette Seite mit dem releases-Tab. Dein Ajax möchte aber nur den Inhalt des releases-Tab sehen. Wie heißt die URL, die Dir nur den Tab-Inhalt liefert? Das musst Du als URL für den Ajax-Aufruf verwenden. Das unterscheidet sich aber notwendigerweise von der URL, die Du dem Browser für die Adresszeile geben musst, weil beide URLs unterschiedliche Inhalte liefern <strong>müssen</strong>.</p> <blockquote> <p>Außerdem funktioniert der Zurück-Button nicht, wie er soll.</p> </blockquote> <p><a href="https://forum.selfhtml.org/cites/1876" rel="noopener noreferrer">Wenn ich den unvergesslichen Cheatah zitieren darf…</a></p> <p>Was soll denn da zum Funktionieren kommen? Gips das schon irgendwo online?</p> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Sun, 13 Mar 22 21:22:07 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797322#m1797322 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797322#m1797322 <p>Hallo Rolf,</p> <blockquote> <p>Genau. Ich war der Meinung, dass genau das dein Ziel war.</p> </blockquote> <p>zu Beginn wusste ich nicht, dass bei einem Wechsel des URL-Parameters die Webseite neu geladen wird. Das wurde mir erst später bewusst. Deswegen habe ich mich gedanklich schon von der Ajax-Lösung verabschiedet.</p> <blockquote> <p>Jein. Ja, weil die Defaultseite damit geladen wird und ja, weil der Fallback ist, und Nein, weil nicht immer die Defaultseite geladen wird.</p> </blockquote> <p>Stimmt, bei refresh wird nicht die Default-Seite geladen.</p> <blockquote> <p>Ich habe das so verstanden, dass Du diese URLs hast (jeweils mit https://<em>domain</em> davor):</p> <pre><code class="block">/games/demons-souls/ Default-Abruf - Zeigt game Tab /games/demons-souls/game Expliziter Abruf des game Tab /games/demons-souls/releases Expliziter Abruf des releases Tab ... /games/demons-souls/savegame Expliziter Abruf des savegame Tab </code></pre> </blockquote> <p>Genau.</p> <blockquote> <p>Deine .htaccess würde die URLs so umwandeln</p> <pre><code class="block">/pages/games/demons-souls/index.php /pages/games/demons-souls/index.php?page=game /pages/games/demons-souls/index.php?page=releases ... /pages/games/demons-souls/index.php?page=savegame </code></pre> </blockquote> <p>Das tut sie, ja.</p> <blockquote> <p>BTW - eine URL wie /pages/games/demons-souls/, wie sie in deiner Angabe der problematischen URL steht, darfst Du nicht publizieren, denn da funktioniert die Seitennavigation nicht. Dafür ist keine RewriteRule da, wie es scheint. Also: Die URL immer ohne /pages, dann greifen deine Rewrites sauber.</p> </blockquote> <p>Ja, zu dem Zeitpunkt hatte ich noch nicht die richtigen Rewrites parat.</p> <blockquote> <pre><code class="block language-js"> <span class="token keyword">var</span> href <span class="token operator">=</span> <span class="token function">$</span><span class="token punctuation">(</span> <span class="token keyword">this</span> <span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">attr</span><span class="token punctuation">(</span> <span class="token string">"href"</span> <span class="token punctuation">)</span><span class="token punctuation">;</span> window<span class="token punctuation">.</span>history<span class="token punctuation">.</span><span class="token function">pushState</span><span class="token punctuation">(</span> <span class="token keyword">null</span><span class="token punctuation">,</span> <span class="token string">""</span><span class="token punctuation">,</span> href <span class="token punctuation">)</span><span class="token punctuation">;</span> $<span class="token punctuation">.</span><span class="token function">ajax</span><span class="token punctuation">(</span> <span class="token punctuation">{</span> <span class="token literal-property property">url</span><span class="token operator">:</span> <span class="token keyword">this</span><span class="token punctuation">.</span>href<span class="token punctuation">,</span> <span class="token function-variable function">success</span><span class="token operator">:</span> <span class="token keyword">function</span><span class="token punctuation">(</span> <span class="token parameter">html</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token operator">...</span> <span class="token punctuation">}</span> <span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre> <p>Hier wird es nun falsch, denn Du hast einen Satz von mir übersehen. Darauf hättest Du auch selbst kommen können, wenn Du das Prinzip deiner Seitenkonstruktion ganz verstanden hättest. Ich schrieb:</p> <p>Der Ajax-Abruf muss natürlich berücksichtigen, dass die Tab-Scripte nun in einem page-Ordner stehen, und das in die URL einbauen.</p> </blockquote> <p>Ich erinnere mich wieder daran, dass du das sagtest. Und ich war mir schon ziemlich sicher, dass genau dies das Problem ist, nämlich dass sich die Seiten jetzt in einem Unterordner befinden, der da heißt <em><strong>subpages</strong></em>.</p> <blockquote> <p>D.h. wenn Du <code>/games/demons-souls/releases</code> abrufst, dann läuft dein index.php an und liefert die komplette Seite mit dem releases-Tab. Dein Ajax möchte aber nur den Inhalt des releases-Tab sehen. Wie heißt die URL, die Dir nur den Tab-Inhalt liefert? Das musst Du als URL für den Ajax-Aufruf verwenden. Das unterscheidet sich aber notwendigerweise von der URL, die Du dem Browser für die Adresszeile geben musst, weil beide URLs unterschiedliche Inhalte liefern <strong>müssen</strong>.</p> </blockquote> <p>Ja, genau das habe ich die ganze Zeit versucht irgendwie in Code umzuwandeln. Leider verstehe ich nicht wirklich, wie das zu schreiben ist. Könntest du mir das vielleicht weiterhelfen und für einen AHA-Moment bei mir sorgen?</p> <blockquote> <p>Außerdem funktioniert der Zurück-Button nicht, wie er soll.</p> </blockquote> <p>Ja, blöd ausgedrückt. Er srpingt einfach nicht zurück auf die vorherige Seite bzw. nur in der URL-Zeile, aber der Klick auf den Zurück-Button wird nicht so verarbeitet, dass die Seite neu geladen wird.</p> <p>Boris</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Sun, 13 Mar 22 22:46:17 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797323#m1797323 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797323#m1797323 <p>Hallo borisbaer,</p> <blockquote> <p>Könntest du mir das vielleicht weiterhelfen und für einen AHA-Moment bei mir sorgen?</p> </blockquote> <p>Erzähl mir nicht, dass Du dieses Detail vorgekaut bekommen musst.</p> <p>Du liest den Pagename aus dem href Attribut. D.h. in href steht z.B. "savegames" drin.</p> <p>Aus Sicht des Browsers ist das die relative URL, auf die gewechselt werden muss. D.h. wenn Du - aus Browsersicht - im Ordner "/games/demon-souls/" oder auch "/games/demon-souls/game" bist und "savegames" in die History drückst, setzt der Browser das in "/games/demon-souls/savegames" um. PRIMA.</p> <p>Der Tab-Inhalt kommt aber von "/games/demon-souls/subpages/savegames". D.h. Du musst dem Ajax-Aufruf etwas mitgeben, woraus der Browser diese URL macht. Das folgt den gleichen Regeln wie das Umsetzen der relativen Link-URL in eine absolute URL.</p> <p>Allerdings - es ist nur die halbe Miete. Denn dein Server muss daraus dann ja noch "/pages/games/demon-souls/subpages/savegames.php" machen.</p> <p>Schlechte Lösung - nicht machen: Du pfeifst auf eine RewriteRule und erzeugst diese URL direkt am Client. Das könnte funktionieren (es sei denn, irgendeine RewriteRule schießt quer). <strong>ABER</strong> - das ist schlechte Architektur. Es ist ganz schlecht, wenn dein JavaScript-Code wissen muss, welche RewriteRules auf dem Server gelten. Das solltest Du nicht tun, sowas geht bei der ersten Änderung kaputt, weil Du nämlich garantiert vergisst, dass Du an 2 Stellen ändern musst. Zumindest würde mir das so gehen.</p> <p>Sinnvolle Lösung: Du belässt die URL-Spielereien da, wo sie hingehören, auf dem Server. Und baust eine weitere RewriteRule, die URLs zum Pattern /games/([^/]+)/subpages/([^/]+) passend umbaut. Der erste Klammerteil ist der Spielename, der zweite Teil der Pagename - ohne das .php. Und daraus muss dann /pages/games/$1/subpages/$2.php werden. Wenn das klappt, kannst Du /games/demon-souls/subpages/savegames abrufen und bekommst den Inhalt der Subpage</p> <p>Come on, das kriegst Du hin. Ich schlaf mich derweil aus, letzte Nacht war laaaaang </p> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Mon, 14 Mar 22 00:37:23 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797324#m1797324 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797324#m1797324 <blockquote> <p>Erzähl mir nicht, dass Du dieses Detail vorgekaut bekommen musst.</p> </blockquote> <p>Doch, leider schon.</p> <blockquote> <p>Der Tab-Inhalt kommt aber von "/games/demon-souls/subpages/savegames". D.h. Du musst dem Ajax-Aufruf etwas mitgeben, woraus der Browser diese URL macht. Das folgt den gleichen Regeln wie das Umsetzen der relativen Link-URL in eine absolute URL.</p> </blockquote> <p>Ja, aber wie mache ich das? Es bringt mir nichts, mit meinen Kenntnisse über ein Problem nachzugrübeln, wenn ich zu wenig Ahnung von der Programmiersprache selbst habe. Ich komme leider von selbst wirklich nicht darauf.</p> <blockquote> <p>Sinnvolle Lösung: Du belässt die URL-Spielereien da, wo sie hingehören, auf dem Server. Und baust eine weitere RewriteRule, die URLs zum Pattern /games/([^/]+)/subpages/([^/]+) passend umbaut. Der erste Klammerteil ist der Spielename, der zweite Teil der Pagename - ohne das .php. Und daraus muss dann /pages/games/$1/subpages/$2.php werden. Wenn das klappt, kannst Du /games/demon-souls/subpages/savegames abrufen und bekommst den Inhalt der Subpage</p> </blockquote> <p>Ich glaube, das wird für mich noch der einfachste Teil sein.</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Mon, 14 Mar 22 08:55:43 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797326#m1797326 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797326#m1797326 <p>Hallo borisbaer,</p> <blockquote> <p>Ja, aber wie mache ich das?</p> </blockquote> <p>Du erinnerst mich an einen Tag in meiner Kindheit. Ich war bestimmt noch keine 10 Jahre, extrem schüchtern, und meine Mutter wollte mich schicken, um Kaffee zu kaufen. Doch, wirklich, in den 70ern wurde einem Kind sowas zugetraut. Da gab's noch keinen Supermarkt bei uns und die Bäckereien verkauften den. Und ich? Ich war in Panik bei dem Gedanken, da allein vor der Theke zu stehen und auch noch etwas sagen zu müssen und habe immer nur wiederholt "Ich weiß aber nicht was ich da sagen soll" und die Versuche meiner Mutter, mir zu erklären, was genau ich der Verkäuferin sagen muss um den Kaffee zu bekommen, sind komplett in den Wirbel, der sich in meinem Kopf befand, verpufft. Sie ist irgendwann zu mir durchgedrungen - es hat möglicherweise einer therapeutischen Ohrfeige bedurft - ich habe den Kaffee bekommen und gelernt, dass meine Angst komplett idiotisch war, aber das ist mir als einer der schrecklicheren Momente meiner Kindheit hängengeblieben.</p> <p>Bei deinem "Wie mache ich das" komm ich mir vor wie meine Mutter damals. Fühle Dich also therapeutisch geohrfeigt, und leg die Panik weg.</p> <p>Vor allem: Guck nicht nur nach Codeschnipseln zum rauskopieren. Ich hab jetzt viel geschrieben, um Dir zu erklären, was zu tun ist. Ein fertiger Schnipsel ist nicht dabei!</p> <p>Schauen wir noch mal hier drauf.</p> <pre><code class="block language-js"> <span class="token keyword">var</span> href <span class="token operator">=</span> <span class="token function">$</span><span class="token punctuation">(</span> <span class="token keyword">this</span> <span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">attr</span><span class="token punctuation">(</span> <span class="token string">"href"</span> <span class="token punctuation">)</span><span class="token punctuation">;</span> window<span class="token punctuation">.</span>history<span class="token punctuation">.</span><span class="token function">pushState</span><span class="token punctuation">(</span> <span class="token keyword">null</span><span class="token punctuation">,</span> <span class="token string">""</span><span class="token punctuation">,</span> href <span class="token punctuation">)</span><span class="token punctuation">;</span> $<span class="token punctuation">.</span><span class="token function">ajax</span><span class="token punctuation">(</span> <span class="token punctuation">{</span> <span class="token literal-property property">url</span><span class="token operator">:</span> <span class="token keyword">this</span><span class="token punctuation">.</span>href<span class="token punctuation">,</span> <span class="token function-variable function">success</span><span class="token operator">:</span> <span class="token keyword">function</span><span class="token punctuation">(</span> <span class="token parameter">html</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span><span class="token punctuation">{</span> <span class="token function">$</span><span class="token punctuation">(</span> <span class="token string">".append"</span> <span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">html</span><span class="token punctuation">(</span> html <span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre> <p>Das ist die 2. Hälfte aus deinem gestern nachmittag geposteten click-Handler für die Tabs. Vorher hast Du preventDefault() aufgerufen - korrekt - und die current Klasse gesetzt (bei der man sogar noch diskutieren könnte ob man da für besser Zugänglichkeit mit dem aria-current Attribut arbeiten sollte, aber dieses Thema will ich jetzt nicht auch noch aufmachen).</p> <p>Zeile 1: Bestücken der href Variablen mit dem Wert des href Attributs. Tatsächlich machst Du das an der Stelle zu umständlich. 2 Zeilen tiefer ist es viel einfacher gemacht: <code>this.href</code>. Dies ist ein Eventhandler für einen click auf einen Link, er ist auf den Links registriert, und der Browser ruft ihn so auf, dass <code>this</code> auf das DOM Element zeigt, auf dem das Event registriert wurde.</p> <p>Wenn der Link so aussieht: `<a href="savegames">Savegames</a>, dann findest Du nun in href den String "savegames".</p> <p>Zeile 2: Dieser String wird in die URL History gepusht. Du bist für den Browser auf Seite "/games/demons-souls/" oder vielleicht "/demons-souls/game", und deswegen, wie schon beschrieben, interpretiert der Browser den pushState(null, "", "savegames") so als ob Du /games/demons-souls/savegames gepusht hättest. Gut so.</p> <p>Zeile 3: Vielleicht sollte man diese Zeile nochmal näher erklären, wenn es Dir noch an Verständnis für JavaScript mangelt. Das ist der Aufruf der Methode <code>ajax</code>, die jQuery mitbringt. Diese Methode bekommt ein Objekt übergeben, und zwar dieses:</p> <pre><code class="block language-js"><span class="token punctuation">{</span> <span class="token literal-property property">url</span><span class="token operator">:</span> <span class="token operator">...</span> <span class="token literal-property property">success</span><span class="token operator">:</span> <span class="token operator">...</span> <span class="token punctuation">}</span> </code></pre> <p>Man nennt das in JavaScript ein "Objektliteral" - also sowas wie ein fertiges Objekt, das im Quellcode steht und vom Programm an der Stelle als Wert verwendet werden kann. Es ist ein Objekt mit zwei Eigenschaften: <code>url</code> und <code>success</code>. Das Objekt, das Du hier an .ajax übergibst, kann noch viel mehr Eigenschaften haben - was Du hier siehst ist so ziemlich das Minimum. Der Artikel im jQuery Handbuch, der das erklärt, ist ein halber Roman.</p> <p>Diese Schreibweise mit dem Objektliteral gibt es auch in PHP, da sähe das so aus (das hilft Dir für JavaScript nichts, es ist nur eine Analogie für's Verständnis der JavaScript-Schreibweise):</p> <pre><code class="block language-php"><span class="token variable">$xxx</span> <span class="token operator">=</span> <span class="token punctuation">[</span> <span class="token string double-quoted-string">"url"</span> <span class="token operator">=></span> <span class="token operator">...</span><span class="token operator">.</span> <span class="token string double-quoted-string">"success"</span> <span class="token operator">=></span> <span class="token keyword">function</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token operator">...</span> <span class="token punctuation">}</span> <span class="token punctuation">]</span><span class="token punctuation">;</span> </code></pre> <p>Ja, tatsächlich, eine Funktion als Wert geht in neueren PHP Versionen auch. Man kann es mit älterer Syntax auch so schreiben:</p> <pre><code class="block language-php"><span class="token variable">$xxx</span> <span class="token operator">=</span> <span class="token keyword">ARRAY</span><span class="token punctuation">(</span> <span class="token string double-quoted-string">"url"</span> <span class="token operator">=></span> <span class="token operator">...</span><span class="token punctuation">,</span> <span class="token string double-quoted-string">"success"</span> <span class="token operator">=></span> <span class="token operator">...</span> <span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre> <p>Gleicher Wein, anderer Schlauch. Zurück zu JavaScript.</p> <p>Unter <code>success</code> steht die Funktion, die bei einem erfolgreichen Ajax-Abruf aufgerufen wird, um das Ergebnis zu verarbeiten. Die hast Du und die tut, was sie soll. Haken dran.</p> <p>Unter <code>url</code> muss die abzurufende URL stehen. Wenn Du hier <code>this.href</code> hinschreibst, wird das href-Attribut des Links verwendet (this zeigt auf das Link-Element). So, wie der Aufruf jetzt ist, wird der <code>url</code> Eigenschaft also "savegames" zugewiesen, der Browser interpretiert das als relative URL und macht /games/demons-souls/savegames draus. Möööp - falsch.</p> <p>Du brauchst <code>/games/demons-souls/subpages/savegames</code> - und das heißt, dass an die url Eigenschaft der Wert <code>"subpages/savegames"</code> zugewiesen werden muss. Wie macht man aus "savegames" den Wert "subpages/savegames"?!</p> <p>Ach so. Ist das hier vielleicht dein Problem? In PHP verkettet man Strings mit dem <code>.</code> Operator. In JavaScript nicht. Da verwendet man das <code>+</code>.</p> <p>Eigentlich sollte es Dir jetzt nicht mehr schwerfallen, die Sternchen durch den richtigen Code zu ersetzen. Den Ajax-Aufruf verteile ich mal auf ein paar mehr Zeilen, dann erkennt man besser, wie sich das zusammensetzt.</p> <pre><code class="block language-js"> <span class="token keyword">var</span> href <span class="token operator">=</span> <span class="token keyword">this</span><span class="token punctuation">.</span>href<span class="token punctuation">;</span> window<span class="token punctuation">.</span>history<span class="token punctuation">.</span><span class="token function">pushState</span><span class="token punctuation">(</span> <span class="token keyword">null</span><span class="token punctuation">,</span> <span class="token string">""</span><span class="token punctuation">,</span> href <span class="token punctuation">)</span><span class="token punctuation">;</span> $<span class="token punctuation">.</span><span class="token function">ajax</span><span class="token punctuation">(</span> <span class="token punctuation">{</span> <span class="token literal-property property">url</span><span class="token operator">:</span> <span class="token operator">**</span><span class="token operator">**</span><span class="token operator">**</span><span class="token operator">**</span><span class="token operator">*</span><span class="token punctuation">,</span> <span class="token function-variable function">success</span><span class="token operator">:</span> <span class="token keyword">function</span><span class="token punctuation">(</span> <span class="token parameter">html</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token operator">...</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Mon, 14 Mar 22 12:29:23 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797333#m1797333 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797333#m1797333 <blockquote> <p>Bei deinem "Wie mache ich das" komm ich mir vor wie meine Mutter damals. Fühle Dich also therapeutisch geohrfeigt, und leg die Panik weg.</p> </blockquote> <p>Danke, jetzt kann ich wieder klar denken. </p> <blockquote> <p>Wenn der Link so aussieht: `<a href="savegames">Savegames</a>, dann findest Du nun in href den String "savegames".</p> </blockquote> <p>Das wusste ich immerhin schon!</p> <blockquote> <p>Zeile 3: Vielleicht sollte man diese Zeile nochmal näher erklären, wenn es Dir noch an Verständnis für JavaScript mangelt. Das ist der Aufruf der Methode <code>ajax</code>, die jQuery mitbringt. Diese Methode bekommt ein Objekt übergeben, und zwar dieses:</p> <pre><code class="block language-js"><span class="token punctuation">{</span> <span class="token literal-property property">url</span><span class="token operator">:</span> <span class="token operator">...</span> <span class="token literal-property property">success</span><span class="token operator">:</span> <span class="token operator">...</span> <span class="token punctuation">}</span> </code></pre> </blockquote> <p>Also, diesen Teil des Codes habe ich ebenfalls bereits verstehen können.</p> <blockquote> <p>Unter <code>url</code> muss die abzurufende URL stehen. Wenn Du hier <code>this.href</code> hinschreibst, wird das href-Attribut des Links verwendet (this zeigt auf das Link-Element). So, wie der Aufruf jetzt ist, wird der <code>url</code> Eigenschaft also "savegames" zugewiesen, der Browser interpretiert das als relative URL und macht /games/demons-souls/savegames draus. Möööp - falsch.</p> </blockquote> <p>Genau. In meinem Kopf steht <code>this</code> für <strong>/games/demons-souls/</strong> und <code>href</code> für das <strong>href attr</strong> des Links, bspw. <em>savegame</em>. Wenn das stimmt, muss ich nur noch <code>+ ("/subpages/") +</code> zwischen die beiden obigen Teil quetschen, sprich:</p> <pre><code class="block language-javascript"><span class="token literal-property property">url</span><span class="token operator">:</span> <span class="token keyword">this</span> <span class="token operator">+</span> <span class="token string">"/subpages/"</span> <span class="token operator">+</span> href<span class="token punctuation">,</span> </code></pre> <p>So weit bin ich gestern sogar schon selber gekommen.</p> <p>Doch steht als GET in der Konsole dann: <strong>http://localhost/games/demons-souls/releases/subpages/http://localhost/games/demons-souls/releases</strong>.</p> <blockquote> <p>Du brauchst <code>/games/demons-souls/subpages/savegames</code> - und das heißt, dass an die url Eigenschaft der Wert <code>"subpages/savegames"</code> zugewiesen werden muss. Wie macht man aus "savegames" den Wert "subpages/savegames"?!</p> </blockquote> <p>Jaaa …</p> <blockquote> <p>Ach so. Ist das hier vielleicht dein Problem? In PHP verkettet man Strings mit dem <code>.</code> Operator. In JavaScript nicht. Da verwendet man das <code>+</code>.</p> </blockquote> <p>Das habe ich versucht, ich schwöre es!</p> <p>Weißt du, dann habe ich mir gedacht, ich mach es jetzt mal ganz dumm und schreibe den absoluten Pfad hin:</p> <pre><code class="block language-css"><span class="token property">url</span><span class="token punctuation">:</span> <span class="token string">"/games/demons-souls/subpages/"</span> + href </code></pre> <p>Die Konsole sagt: „Hey, du willst scheinbar das aufrufen:“</p> <p>http://localhost/games/demons-souls/subpages/http://localhost/games/demons-souls/savegame</p> <p>Das href steht – warum auch immer – für die komplette URL. Das war gestern schon die ganze Zeit so. Sonst hätte ich es vermutlich schon hingekriegt. Im Grunde funktioniert es nur, wenn ich einen vollständig absoluten Pfad hinschreibe, z.B.:</p> <pre><code class="block language-javascript"><span class="token literal-property property">url</span><span class="token operator">:</span> <span class="token string">"/games/demons-souls/subpages/game"</span> </code></pre> <p>Sowohl bei <code>alert(this)</code> als auch bei <code>alert(href)</code> kommt beide Male die vollständige URL raus, nicht nur savegame oder mods oder so. Irgendwas läuft da falsch und der Fehler sitzt immer vorm PC.</p> <p>Boris</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Mon, 14 Mar 22 13:03:56 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797338#m1797338 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797338#m1797338 <p>Ich habe gemerkt, dass ich einen blöden Fehler oben gemacht habe, und zwar habe ich einen relativen Pfad mit einem / angefangen – autsch. </p> <p>Es funktioniert jetzt sogar mit dem folgenden Code:</p> <pre><code class="block language-javascript"><span class="token function">$</span><span class="token punctuation">(</span><span class="token keyword">function</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#tabs .tab"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">click</span><span class="token punctuation">(</span><span class="token keyword">function</span><span class="token punctuation">(</span><span class="token parameter">event</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> event<span class="token punctuation">.</span><span class="token function">preventDefault</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token keyword">this</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">addClass</span><span class="token punctuation">(</span><span class="token string">"current"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">siblings</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">removeClass</span><span class="token punctuation">(</span><span class="token string">"current"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">var</span> href <span class="token operator">=</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token keyword">this</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">attr</span><span class="token punctuation">(</span><span class="token string">"href"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> window<span class="token punctuation">.</span>history<span class="token punctuation">.</span><span class="token function">pushState</span><span class="token punctuation">(</span><span class="token keyword">null</span><span class="token punctuation">,</span> <span class="token string">""</span><span class="token punctuation">,</span> href<span class="token punctuation">)</span><span class="token punctuation">;</span> $<span class="token punctuation">.</span><span class="token function">ajax</span><span class="token punctuation">(</span> <span class="token punctuation">{</span> <span class="token literal-property property">url</span><span class="token operator">:</span> <span class="token string">"subpages/"</span> <span class="token operator">+</span> href<span class="token punctuation">,</span> <span class="token function-variable function">success</span><span class="token operator">:</span> <span class="token keyword">function</span><span class="token punctuation">(</span><span class="token parameter">html</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">".append"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">html</span><span class="token punctuation">(</span>html<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre> <p>ABER, wie du siehst, musste ich die Variable <code>href</code> wieder zu <code>$(this).attr("href")</code> umschreiben. Bei <code>this.href</code> hat sie immer den ganzen Pfad vor dem href-Attribut ausgegeben, also nicht nur bspw. <em>savegame</em>. Warum ist das so?</p> <p>Ich gehe mal jetzt schon mal einen Schritt weiter und frage: Sollte ich jetzt wieder den Teil <code>"subpages/"</code> aus der Ajax-URL löschen und stattdessen die .htaccess so umschreiben, dass URLs nach dem Muster /games/$1/$2 automatisch /games/$1/subpages/$2 aufrufen?</p> <p>Und noch weiter gefragt: Der Ajax-Call funktioniert also wieder, aber wenn ich auf den Zurück-Button klicke, geht zwar oben in der Adresszeile die URL zurück auf den vorherigen string, doch der Inhalt natürlich noch nicht. Hier kommt vermutlich dieses popstate-Funktion zum Einsatz. Wie ich das verstanden habe, reagiert popstate auf Veränderungen in der URL bzw. in der History. Wenn also jemand auf den Zurück-Button klickt, dann sollte mit popstate erkannt werden, dass sich was in der URL-Zeile verändert hat und der entsprechende Inhalte aufgerufen werden soll.</p> <pre><code class="block language-javascript"> window<span class="token punctuation">.</span><span class="token function-variable function">onpopstate</span> <span class="token operator">=</span> <span class="token keyword">function</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token comment">/* ein erneuter Ajax-Call? Aber dieses Mal muss er ohne das href des Links auskommen, sondern sich wohl auf die window.history verlassen. */</span> <span class="token punctuation">}</span><span class="token punctuation">;</span> </code></pre> <p>Mein lieber Herr Gesangsvereien. </p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Mon, 14 Mar 22 13:55:49 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797341#m1797341 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797341#m1797341 <p>Hallo borisbaer,</p> <blockquote> <p>In meinem Kopf steht this für /games/demons-souls/</p> </blockquote> <p>Schlag Dir das gleich wieder aus dem Kopf.</p> <p><code>this</code> ist in JavaScript ganz grob gesagt der aktuelle Kontext, in dem eine Funktion oder Methode läuft. Aber: Man hat beim Aufrufen einer Funktion durchaus Möglichkeiten, diesen Kontext zu manipulieren. Und das tut jQuery, wenn es einen Eventhandler aufruft. Es sorgt dafür, dass Du in this das Objekt für das HTML Element findest, auf dem der Eventhandler registriert wurde. Und weil Du den click-Handler auf dem Link definierst, ist das das HTML Elementobjekt zum geklickten Link. Also: <code>this</code> ist der Link.</p> <blockquote> <p>Bei this.href hat sie immer den ganzen Pfad vor dem href-Attribut ausgegeben, also nicht nur bspw. savegame. Warum ist das so?</p> </blockquote> <p><code>this</code> ist der Link, und <code>this.href</code> ist die verlinkte URL. Und genau hier bin ich böse reingefallen - du darfst mir die Ohrfeige nun gerne zurückgeben. Es gibt einen Unterschied zwischen dem href Attribut und der href-Eigenschaft des Link-Objekts. Das href Attribut steht für den Text, der im HTML steht. Und die href-Eigenschaft ist das, wie der Browser dieses Attribut deutet. Das habe ich übersehen; ich dachte, in der href-Eigenschaft stünde der Attributinhalt. Aber nein - da steht bereits die vollständig aufbereitete URL, auf die der Link verweist.</p> <p>Deswegen ist this.href für den pushState okay. Aber für das Bauen der Ajax-URL steht schon zu viel drin, deswegen ist es da ganz sinnvoll, wenn Du mit $(this).attr("href") den Attributinhalt ausliest.</p> <blockquote> <p>die .htaccess so umschreiben, dass URLs nach dem Muster /games/$1/$2 automatisch /games/$1/subpages/$2 aufrufen?</p> </blockquote> <p>Nein, tu das nicht. Die URLs ohne "subpages" drin sind die, die der Browser für den Erstabruf der Seite braucht. Die werden von htaccess in index.php?page=... umgesetzt.</p> <p>Die URL mit "subpages" sind die, mit denen Du den reinen Inhalt der Subpage bekommst und die Du für Ajax brauchst - das sind zwei verschiedene Dinge.</p> <blockquote> <p>wenn ich auf den Zurück-Button klicke, geht zwar oben in der Adresszeile die URL zurück auf den vorherigen string, doch der Inhalt natürlich noch nicht.</p> </blockquote> <p>Ups? Noch ein Hirnschaden von mir? Ich hätte erwartet, dass der Browser dann diese URL abruft. Um zu sehen, was da genau passiert, müsste ich deinen Stand online sehen - geht das? Ich mag es nicht nicht nachprogrammieren. Im Moment scheint bei Dir was eine Endlosschleife zu drehen - entweder der Hoster oder deine Seite. Direkte Aufrufe auf /subpages Seiten gehen, aber Aufrufe über die index.php bleiben hängen.</p> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Mon, 14 Mar 22 14:39:59 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797347#m1797347 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797347#m1797347 <p>Hallo borisbaer,</p> <p>Update - ich habe nochmal Doku gelesen. Tatsächlich ein Hirnschaden meinerseits.</p> <p>Ein history.pushState assoziert die neu dargestellte URL mit dem geladenen Dokument, lädt die URL aber nicht. Sozusagen reine Augenwischerei.</p> <p>Ein Klick auf "zurück" wechselt darum die URL, aber da Du eine gefakte URL verlässt, bleibt das Dokument gleich und <strong>deshalb lädt der Browser nichts</strong>.</p> <p>Also, das popstate Event muss an den Start. Es wird immer dann geworfen (gerade ausprobiert), wenn Du zu oder von einer URL wechselst, die die mit pushState entstanden ist. Immer wenn popstate fliegt, hat der Browser nichts geladen, und du hast die Chance, selbst was zu tun.</p> <p>Gerade probiert - müsste klappen:</p> <p>Zeile 2: aktuellen Path-Teil der URL auslesen (also /games/demons-souls/...)<br> Zeile 3: Position des letzten / finden<br> Zeile 4: Den Text hinter dem / lesen, das ist der Name des Tabs. ODER LEER!<br> Zeile 6-12: Zwei Fälle möglich.<br> Zeile 8-9 Wenn <code>page</code> leer ist, kennst den Namen der Default-Page nicht. Wenn Du also per popstate zu /games/demons-souls/ zurückkehrst, musst Du Dir den Namen der Default-Page aus dem ersten Tab herausholen. Als Nebeneffekt holst Du Dir einen Verweis auf das erste <a class="tab"> Element<br> Zeile 11: Hast Du einen tab-Namen, musst Du trotzdem das passende Link-Element finden.<br> Zeile 13: current-Klasse auf den Link zum aktuellen Tab setzen<br> Zeile 15: Tab-Inhalt holen</p> <pre><code class="block language-js"> <span class="token number">1</span> window<span class="token punctuation">.</span><span class="token function-variable function">onpopstate</span> <span class="token operator">=</span> <span class="token keyword">function</span><span class="token punctuation">(</span><span class="token parameter">popEvent</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token number">2</span> <span class="token keyword">let</span> urlPath <span class="token operator">=</span> window<span class="token punctuation">.</span>location<span class="token punctuation">.</span>pathName<span class="token punctuation">;</span> <span class="token number">3</span> <span class="token keyword">let</span> slash <span class="token operator">=</span> page<span class="token punctuation">.</span><span class="token function">lastIndexOf</span><span class="token punctuation">(</span><span class="token string">"/"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token number">4</span> <span class="token keyword">let</span> page <span class="token operator">=</span> urlPath<span class="token punctuation">.</span><span class="token function">substr</span><span class="token punctuation">(</span>slash<span class="token operator">+</span><span class="token number">1</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token number">5</span> <span class="token number">6</span> <span class="token keyword">let</span> $tab<span class="token punctuation">;</span> <span class="token number">7</span> <span class="token keyword">if</span> <span class="token punctuation">(</span>page<span class="token operator">=</span><span class="token string">''</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token number">8</span> $tab <span class="token operator">=</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#tabs .tab:first-of-type"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token number">9</span> page <span class="token operator">=</span> $tab<span class="token punctuation">.</span><span class="token function">attr</span><span class="token punctuation">(</span><span class="token string">"href"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token number">10</span> <span class="token keyword">else</span> <span class="token punctuation">{</span> <span class="token number">11</span> $tab <span class="token operator">=</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#tabs .tab[href="</span><span class="token operator">+</span><span class="token constant">CSS</span><span class="token punctuation">.</span><span class="token function">escape</span><span class="token punctuation">(</span>page<span class="token punctuation">)</span><span class="token operator">+</span>"<span class="token punctuation">]</span><span class="token punctuation">)</span> <span class="token number">12</span> <span class="token punctuation">}</span> <span class="token number">13</span> $tab<span class="token punctuation">.</span><span class="token function">addClass</span><span class="token punctuation">(</span><span class="token string">"current"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">siblings</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">removeClass</span><span class="token punctuation">(</span><span class="token string">"current"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token number">14</span> <span class="token number">15</span> $<span class="token punctuation">.</span><span class="token function">ajax</span><span class="token punctuation">(</span><span class="token punctuation">{</span><span class="token literal-property property">url</span><span class="token operator">:</span> <span class="token string">"subpages/"</span><span class="token operator">+</span>page<span class="token punctuation">,</span> <span class="token keyword">function</span><span class="token punctuation">(</span><span class="token parameter">html</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token number">16</span> <span class="token operator">...</span> <span class="token number">17</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token number">18</span> <span class="token punctuation">}</span> </code></pre> <p>So ganz blöd angemerkt: Diese Logik könnte man auch beim normalen Laden der Seite anwenden und das Erstbefüllen des Tab mit PHP überflüssig machen. ABER - das würde zu einem Zucken auf der Anzeige führen, weil die Seite erst mit leerem Tab geladen wird und es dann erst füllt. D.h. die PHP Logik ist für eine schönere Darstellung sinnvoll.</p> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Mon, 14 Mar 22 14:35:58 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797346#m1797346 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797346#m1797346 <p>Hallo Rolf,</p> <blockquote> <p><code>this</code> ist in JavaScript ganz grob gesagt der aktuelle Kontext, in dem eine Funktion oder Methode läuft. Aber: Man hat beim Aufrufen einer Funktion durchaus Möglichkeiten, diesen Kontext zu manipulieren. Und das tut jQuery, wenn es einen Eventhandler aufruft. Es sorgt dafür, dass Du in this das Objekt für das HTML Element findest, auf dem der Eventhandler registriert wurde. Und weil Du den click-Handler auf dem Link definierst, ist das das HTML Elementobjekt zum geklickten Link. Also: <code>this</code> ist der Link.</p> </blockquote> <p>Ja, das stimmt. Habe ich dann auch gemerkt, kurz nachdem ich den Murks verfasst habe. War nur zu spät zum Editieren.</p> <blockquote> <p><code>this</code> ist der Link, und <code>this.href</code> ist die verlinkte URL. Und genau hier bin ich böse reingefallen - du darfst mir die Ohrfeige nun gerne zurückgeben.</p> </blockquote> <p> </p> <blockquote> <p>Es gibt einen Unterschied zwischen dem href Attribut und der href-Eigenschaft des Link-Objekts. Das href Attribut steht für den Text, der im HTML steht. Und die href-Eigenschaft ist das, wie der Browser dieses Attribut deutet. Das habe ich übersehen; ich dachte, in der href-Eigenschaft stünde der Attributinhalt. Aber nein - da steht bereits die vollständig aufbereitete URL, auf die der Link verweist.</p> </blockquote> <p>Danke für die Klarstellung. Jetzt habe ich es verstanden.</p> <blockquote> <p>Deswegen ist this.href für den pushState okay. Aber für das Bauen der Ajax-URL steht schon zu viel drin, deswegen ist es da ganz sinnvoll, wenn Du mit $(this).attr("href") den Attributinhalt ausliest.</p> </blockquote> <p>Doch nicht so dumm!</p> <blockquote> <p>Nein, tu das nicht. Die URLs ohne "subpages" drin sind die, die der Browser für den Erstabruf der Seite braucht. Die werden von htaccess in index.php?page=... umgesetzt.</p> <p>Die URL mit "subpages" sind die, mit denen Du den reinen Inhalt der Subpage bekommst und die Du für Ajax brauchst - das sind zwei verschiedene Dinge.</p> </blockquote> <p>Also lasse ich die .htaccess so, wie sie ist?</p> <blockquote> <p>Ups? Noch ein Hirnschaden von mir? Ich hätte erwartet, dass der Browser dann diese URL abruft. Um zu sehen, was da genau passiert, müsste ich deinen Stand online sehen - geht das? Ich mag es nicht nicht nachprogrammieren. Im Moment scheint bei Dir was eine Endlosschleife zu drehen - entweder der Hoster oder deine Seite. Direkte Aufrufe auf /subpages Seiten gehen, aber Aufrufe über die index.php bleiben hängen.</p> </blockquote> <p>Na klar, ich habe die Webseite aktualisiert</p> <p><a href="http://54598532.swh.strato-hosting.eu/games/demons-souls/" rel="nofollow noopener noreferrer">http://54598532.swh.strato-hosting.eu/games/demons-souls/</a></p> <p>Wie du siehst, funktioniert nun sogar das Hervorheben des aktiven Tabs.</p> <pre><code class="block language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>nav</span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>tabs<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>a</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>tab <?= $current == null || $current == 'game' ? 'current' : ''; ?><span class="token punctuation">"</span></span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>game<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Spiel<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>a</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>a</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>tab <?= $current == 'releases' ? 'current' : ''; ?><span class="token punctuation">"</span></span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>releases<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Releases<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>a</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>a</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>tab <?= $current == 'merchandise' ? 'current' : ''; ?><span class="token punctuation">"</span></span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>merchandise<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Merchandise<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>a</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>a</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>tab <?= $current == 'guides' ? 'current' : ''; ?><span class="token punctuation">"</span></span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>guides<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Guides<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>a</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>a</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>tab <?= $current == 'emulation' ? 'current' : ''; ?><span class="token punctuation">"</span></span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>emulation<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Emulation<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>a</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>a</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>tab <?= $current == 'mods' ? 'current' : ''; ?><span class="token punctuation">"</span></span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>mods<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Mods<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>a</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>a</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>tab <?= $current == 'savegame' ? 'current' : ''; ?><span class="token punctuation">"</span></span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>savegame<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Savegame<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>a</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>nav</span><span class="token punctuation">></span></span> </code></pre> <p>Kurz vorher explodiert noch die aktuelle URL …</p> <pre><code class="block language-php"><span class="token php language-php"><span class="token delimiter important"><?php</span> <span class="token variable">$url</span> <span class="token operator">=</span> <span class="token function">htmlspecialchars</span><span class="token punctuation">(</span><span class="token variable">$_SERVER</span><span class="token punctuation">[</span><span class="token string single-quoted-string">'REQUEST_URI'</span><span class="token punctuation">]</span><span class="token punctuation">,</span> <span class="token constant">ENT_QUOTES</span><span class="token punctuation">,</span> <span class="token string single-quoted-string">'UTF-8'</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token variable">$urlParts</span> <span class="token operator">=</span> <span class="token function">explode</span><span class="token punctuation">(</span><span class="token string single-quoted-string">'/'</span><span class="token punctuation">,</span> <span class="token variable">$url</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token variable">$current</span> <span class="token operator">=</span> <span class="token variable">$urlParts</span><span class="token punctuation">[</span><span class="token function">count</span><span class="token punctuation">(</span><span class="token variable">$urlParts</span><span class="token punctuation">)</span><span class="token operator">-</span><span class="token number">1</span><span class="token punctuation">]</span><span class="token punctuation">;</span> <span class="token delimiter important">?></span></span> </code></pre> <p>Ich weiß nicht, ob das eine gute Lösung ist, aber es ist <strong>eine</strong> Lösung.</p> <p>Boris</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Mon, 14 Mar 22 14:48:24 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797348#m1797348 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797348#m1797348 <p>Hallo borisbaer,</p> <p>das, was ich online sehe, hat aber kein Ajax drin. Das ist die reine PHP Lösung ohne JavaScript-Navigation.</p> <p>Zur Explosion: Die REQUEST_URI brauchst Du nicht durch htmlspecialchars zu jagen. Du gibst weder die URI noch die $urlParts noch den abgetrennten $current-Teil aus. htmlspecialchars sollte man wirklich nur für die Werte anwenden, die man auch wirklich zum Browser schickt.</p> <blockquote> <p>Also lasse ich die .htaccess so, wie sie ist?</p> </blockquote> <p>Glaube schon. Bis zum Beweis des Gegenteils...</p> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Mon, 14 Mar 22 15:24:37 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797350#m1797350 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797350#m1797350 <p>Ich habe meine Webseite mit deinem Code aktualisiert, musste allerdings noch zwei Syntax-Fehler beheben:</p> <pre><code class="block language-javascript">window<span class="token punctuation">.</span><span class="token function-variable function">onpopstate</span> <span class="token operator">=</span> <span class="token keyword">function</span><span class="token punctuation">(</span><span class="token parameter">popEvent</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">let</span> urlPath <span class="token operator">=</span> window<span class="token punctuation">.</span>location<span class="token punctuation">.</span>pathName<span class="token punctuation">;</span> <span class="token keyword">let</span> slash <span class="token operator">=</span> page<span class="token punctuation">.</span><span class="token function">lastIndexOf</span><span class="token punctuation">(</span><span class="token string">"/"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">let</span> page <span class="token operator">=</span> urlPath<span class="token punctuation">.</span><span class="token function">substr</span><span class="token punctuation">(</span>slash<span class="token operator">+</span><span class="token number">1</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">let</span> $tab<span class="token punctuation">;</span> <span class="token keyword">if</span> <span class="token punctuation">(</span>page <span class="token operator">=</span> <span class="token string">''</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> $tab <span class="token operator">=</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#tabs .tab:first-of-type"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> page <span class="token operator">=</span> $tab<span class="token punctuation">.</span><span class="token function">attr</span><span class="token punctuation">(</span><span class="token string">"href"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token keyword">else</span> <span class="token punctuation">{</span> $tab <span class="token operator">=</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#tabs .tab[href="</span><span class="token operator">+</span><span class="token constant">CSS</span><span class="token punctuation">.</span><span class="token function">escape</span><span class="token punctuation">(</span>page<span class="token punctuation">)</span><span class="token operator">+</span><span class="token string">"]"</span><span class="token punctuation">)</span> <span class="token punctuation">}</span> $tab<span class="token punctuation">.</span><span class="token function">addClass</span><span class="token punctuation">(</span><span class="token string">"current"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">siblings</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">removeClass</span><span class="token punctuation">(</span><span class="token string">"current"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> $<span class="token punctuation">.</span><span class="token function">ajax</span><span class="token punctuation">(</span><span class="token punctuation">{</span><span class="token literal-property property">url</span><span class="token operator">:</span> <span class="token string">"subpages/"</span><span class="token operator">+</span>page<span class="token punctuation">,</span> <span class="token keyword">function</span><span class="token punctuation">(</span><span class="token parameter">html</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">".append"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">html</span><span class="token punctuation">(</span>html<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> </code></pre> <p>Einmal musste das <code>if</code> geschlossen werden (fehlendes <code>}</code>) und ein andermal noch der jQuery-Selektor nach <code>$tab</code> (fehlendes <code>"</code> nach <code>[href="+CSS.escape(page)+"]</code>). Jetzt sollte es zumindest syntaktisch passen, aber leider passiert nichts, wenn ich das Script einbinde.</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Mon, 14 Mar 22 14:51:27 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797349#m1797349 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797349#m1797349 <blockquote> <p>das, was ich online sehe, hat aber kein Ajax drin. Das ist die reine PHP Lösung ohne JavaScript-Navigation.</p> </blockquote> <p>Ups, habe vergessen das JS-Script zu aktualisieren. Ist behoben!</p> <p>Siehste mal, hier kommt dein <s>advanced engineering</s> progressive enhancement zum Einsatz. JavaScript funktioniert nicht, also kommt PHP! </p> <blockquote> <p>Zur Explosion: Die REQUEST_URI brauchst Du nicht durch htmlspecialchars zu jagen. Du gibst weder die URI noch die $urlParts noch den abgetrennten $current-Teil aus. htmlspecialchars sollte man wirklich nur für die Werte anwenden, die man auch wirklich zum Browser schickt.</p> </blockquote> <p>Danke für den Hinweis!</p> <blockquote> <p>Glaube schon. Bis zum Beweis des Gegenteils...</p> </blockquote> <p>Na dann!</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Mon, 14 Mar 22 15:48:41 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797351#m1797351 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797351#m1797351 <p>Hallo borisbaer,</p> <p>die Tab-Navigation "vorwärts" funktioniert prima.</p> <p>Dass bei der Browser-Navigation nichts passiert, ist ein Irrtum. Mach die Entwicklerwerkzeuge auf, guck in die Konsole, das hier passiert:</p> <pre><code class="block">foo.js:38 Uncaught ReferenceError: Cannot access 'page' before initialization at window.onpopstate (foo.js:38:15) </code></pre> <p>Das ist natürlich kein Fehler meinerseits, sondern ein Test für Dich. Du sollst es ja nicht zu leicht haben (<em>laber</em>, <em>rumschwatz</em>, <em>rausred</em>...)</p> <p>Da man aus Fehlern am meisten lernt, auch wenn andere sie gemacht haben: Überlege, was der Code tun <strong>soll</strong>, das habe ich ja aufgeschrieben, und worauf er dafür in dieser Zeile zugreifen <strong>müsste</strong>.</p> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Mon, 14 Mar 22 16:31:52 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797352#m1797352 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797352#m1797352 <blockquote> <pre><code class="block">foo.js:38 Uncaught ReferenceError: Cannot access 'page' before initialization at window.onpopstate (foo.js:38:15) </code></pre> </blockquote> <blockquote> <p>Da man aus Fehlern am meisten lernt, auch wenn andere sie gemacht haben: Überlege, was der Code tun <strong>soll</strong>, das habe ich ja aufgeschrieben, und worauf er dafür in dieser Zeile zugreifen <strong>müsste</strong>.</p> </blockquote> <p>Wenn ich das richtig interpretiere, dann kann das Script nicht auf die Variable <code>page</code> zugreifen, bevor diese nicht davor irgendwo eingeführt wurde? An welcher Stelle sollte man denn diese Variable einführen und wie soll sie definiert werden? Ich habe jetzt hin und her überlegt, finde aber keinen Ansatz.</p> <p><strong>Edit:</strong> Was ich sehe (oder glaube zu sehen), ist, dass <code>slash</code> bereits auf <code>page</code> zugreifen möchte, noch bevor diese definiert ist. Aber wenn ich <code>page</code> vor <code>slash</code> definiere, dann kommt: <code>Uncaught TypeError: urlPath is undefined</code>.</p> <p>Bzw. greift ja auch <code>page</code> auf <code>slash</code> zu, also keine Ahnung.</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Mon, 14 Mar 22 18:07:18 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797356#m1797356 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797356#m1797356 <p>Hallo borisbaer,</p> <p>ich schrub als Absichtserklärung:</p> <p>Zeile 2: aktuellen Path-Teil der URL auslesen (also /games/demons-souls/...) Zeile 3: Position des letzten / finden Zeile 4: Den Text hinter dem / lesen, das ist der Name des Tabs. ODER LEER!</p> <p>Gecodet (oder eher gekotet) habe ich</p> <pre><code class="block bad language-js"> <span class="token keyword">let</span> urlPath <span class="token operator">=</span> window<span class="token punctuation">.</span>location<span class="token punctuation">.</span>pathName<span class="token punctuation">;</span> <span class="token keyword">let</span> slash <span class="token operator">=</span> page<span class="token punctuation">.</span><span class="token function">lastIndexOf</span><span class="token punctuation">(</span><span class="token string">"/"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">let</span> page <span class="token operator">=</span> urlPath<span class="token punctuation">.</span><span class="token function">substr</span><span class="token punctuation">(</span>slash<span class="token operator">+</span><span class="token number">1</span><span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre> <p>Worin muss ich denn den letzten / suchen, um den Tab-Namen herauszubekommen?</p> <p>Ist das Problem die Reihenfolge, in der ich Dinge tue? Oder greife ich vielleicht im richtigen Moment auf die falschen Daten zu?</p> <p>Ich sollte vielleicht Quizmaster werden </p> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Mon, 14 Mar 22 19:23:24 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797360#m1797360 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797360#m1797360 <blockquote> <p>Zeile 2: aktuellen Path-Teil der URL auslesen (also /games/demons-souls/...)</p> </blockquote> <pre><code class="block language-javascript"><span class="token keyword">let</span> urlPath <span class="token operator">=</span> window<span class="token punctuation">.</span>location<span class="token punctuation">.</span>pathName<span class="token punctuation">;</span> </code></pre> <p>Bei <code>alert(urlPath)</code> kommt aber <code>undefined</code> heraus. Nur wenn ich das <code>.pathName</code> weglasse, kommt die abgerufene URL heraus. Eben sehe ich, das Programm schlägt mir <code>.pathname</code> vor. Damit wird auch die URL tatsächlich ausgegeben. Ist das case-sensitive?</p> <blockquote> <p>Zeile 3: Position des letzten / finden</p> </blockquote> <blockquote> <p>Zeile 4: Den Text hinter dem / lesen, das ist der Name des Tabs. ODER LEER!</p> </blockquote> <blockquote> <pre><code class="block bad language-js"> <span class="token keyword">let</span> urlPath <span class="token operator">=</span> window<span class="token punctuation">.</span>location<span class="token punctuation">.</span>pathName<span class="token punctuation">;</span> <span class="token keyword">let</span> slash <span class="token operator">=</span> page<span class="token punctuation">.</span><span class="token function">lastIndexOf</span><span class="token punctuation">(</span><span class="token string">"/"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">let</span> page <span class="token operator">=</span> urlPath<span class="token punctuation">.</span><span class="token function">substr</span><span class="token punctuation">(</span>slash<span class="token operator">+</span><span class="token number">1</span><span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre> <p>Worin muss ich denn den letzten / suchen, um den Tab-Namen herauszubekommen?</p> </blockquote> <p>Ich würde sagen, in <code>urlPath</code>. Dort suchst du von hinten das erste <code>/</code> der URL-Zeile.</p> <blockquote> <p>Ist das Problem die Reihenfolge, in der ich Dinge tue? Oder greife ich vielleicht im richtigen Moment auf die falschen Daten zu?</p> </blockquote> <p>Ja, nämlich oben. Wenn man es so schreibt, funktioniert zumindest das Finden des strings:</p> <pre><code class="block good language-js"><span class="token keyword">let</span> urlPath <span class="token operator">=</span> window<span class="token punctuation">.</span>location<span class="token punctuation">.</span>pathname<span class="token punctuation">;</span> <span class="token keyword">let</span> slash <span class="token operator">=</span> urlPath<span class="token punctuation">.</span><span class="token function">lastIndexOf</span><span class="token punctuation">(</span> <span class="token string">"/"</span> <span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">let</span> page <span class="token operator">=</span> urlPath<span class="token punctuation">.</span><span class="token function">substr</span><span class="token punctuation">(</span>slash<span class="token operator">+</span><span class="token number">1</span><span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre> <p>Jetzt muckt er aber an dieser Stelle rum: <code>$tab = $("#tabs .tab[href="+CSS.escape(page)+"]")</code></p> <p>Fehlermeldung: <code>Uncaught Error: Syntax error, unrecognized expression: #tabs .tab[href=]</code></p> <p>Hm? Stimmt doch eigentlich? Habe das Script hochgeladen!</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Mon, 14 Mar 22 20:28:09 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797364#m1797364 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797364#m1797364 <p>Hallo borisbaer,</p> <p>oh Mann, heute ist nicht mein Tag. Aber ich krieg Dich zum Mitdenken, das ist prima.</p> <blockquote> <p>.pathname</p> </blockquote> <p>Sehr gut gesehen. Das hatte ich falsch aus der Konsole der Entwicklertools abgeschrieben.</p> <blockquote> <p>$tab = $("#tabs .tab[href="+CSS.escape(page)+"]") Fehlermeldung: Uncaught Error: Syntax error, unrecognized expression: #tabs .tab[href=]</p> </blockquote> <p>Hä, wie? In den Teil läuft er doch nur, wenn <code>page</code> nicht leer ist.<br> Wieso zum grundgütigen Gei - eijeijeijeijei </p> <p><strong>ROLF, DU VOLLPFOSTEN</strong></p> <pre><code class="block bad">if (page = '') hier lang wenn in page nichts drin steht else mach was mit page, wenn in page was drin steht </code></pre> <p>Siehst Du's? Warum page leer ist UND er in den else Zweig läuft? Das könnte auch PHP sein (dann müsste man die Variable $page nennen, klar), aber es wäre exakt der gleiche Blödsinn mit exakt den gleichen Folgen.</p> <p>Falls Du einen Tipp brauchst - <a href="https://wiki.selfhtml.org/wiki/JavaScript/Objekte/Boolean#Was_ist_Wahrheit.3F" rel="nofollow noopener noreferrer">Was ist Wahrheit?</a>.</p> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Mon, 14 Mar 22 22:06:55 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797365#m1797365 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797365#m1797365 <p>Hi there,</p> <blockquote> <p><strong>ROLF, DU VOLLPFOSTEN</strong></p> </blockquote> <p>Naja, das mußt Du selbst beurteilen, aber erfrischend und angenehm ist es zu sehen, daß nicht nur ich ab und an immer wieder auf den selben (Schlampigkeits-) Fehler hereinfalle.</p> <p>Wobei man sagen muß, daß es durchaus auch Programmiersprachen gibt, die zwischen Vergleich und Zuweisung erst gleich gar nicht groß unterscheiden...</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Mon, 14 Mar 22 22:43:48 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797366#m1797366 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797366#m1797366 <blockquote> <blockquote> <p>.pathname</p> </blockquote> <p>Sehr gut gesehen. Das hatte ich falsch aus der Konsole der Entwicklertools abgeschrieben.</p> </blockquote> <p>Das war reines Glück. Hätte ich ein anderes Tool verwendet, hätte ich das nie im Leben gemerkt. Und hätte mir stundenlang den Kopf zerbrochen, warum es nicht geht.</p> <blockquote> <pre><code class="block bad">if (page = '') hier lang wenn in page nichts drin steht else mach was mit page, wenn in page was drin steht </code></pre> <p>Siehst Du's? Warum page leer ist UND er in den else Zweig läuft? Das könnte auch PHP sein (dann müsste man die Variable $page nennen, klar), aber es wäre exakt der gleiche Blödsinn mit exakt den gleichen Folgen.</p> </blockquote> <p>Wir haben kein == benutzt, sondern nur ein = als Gleichsetzungszeichen.</p> <p>So weit, so gut. Über die Netzwerkanalyse sehe ich nun auch, dass die page geladen wird … doch man sieht sie nicht! Komisch, oder?</p> <p><strong>Edit:</strong> Alles klar, das machst du doch absichtlich, Rolf. Es steht kein <code>success: function(html)</code> im Ajax-Teil. Jetzt funktioniert es! Juchee!</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Tue, 15 Mar 22 07:20:01 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797369#m1797369 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797369#m1797369 <p>Hallo klawischnigg,</p> <blockquote> <p>Wobei man sagen muß, daß es durchaus auch Programmiersprachen gibt, die zwischen Vergleich und Zuweisung erst gleich gar nicht groß unterscheiden...</p> </blockquote> <p>Du meinst, sie verwenden <code>=</code> sowohl für Zuweisung als auch für Vergleich?</p> <p>Ja, aber diese Sprachen erlauben auch nicht, die Zuweisung als Ausdruck zu verwenden. Spontan fallen mir BASIC und COBOL ein - da ist ein = zwischen IF und THEN grundsätzlich ein Vergleich.</p> <p>Dieser größenwahnsinnig gewordene Assembler namens "C" und seine Abkömmlinge dagegen...</p> <p>Ich habe dann etwas im Netz gestöbert und Tante Google hat mir diesen Artikel von Altmeister Niklas Wirth präsentiert: <a href="https://people.inf.ethz.ch/wirth/Articles/GoodIdeas_origFig.pdf" rel="nofollow noopener noreferrer">"Good Ideas, Through The Looking Glass"</a> (von 2004, ein PDF). Sehr interessant </p> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Tue, 15 Mar 22 14:27:44 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797389#m1797389 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797389#m1797389 <p>Hi there,</p> <blockquote> <blockquote> <p>Wobei man sagen muß, daß es durchaus auch Programmiersprachen gibt, die zwischen Vergleich und Zuweisung erst gleich gar nicht groß unterscheiden...</p> </blockquote> <p>Du meinst, sie verwenden <code>=</code> sowohl für Zuweisung als auch für Vergleich?</p> </blockquote> <p>Genau so. Wobei es bspw. um es noch skuriler zu machen in späteren dBase-Derivaten beim Vergleich einen Unterschied zwischen "=" und "==" gegeben hat, aber nur dergestalt, daß doppeltes Ist-gleich-Zeichen ein exakter Stringvergleich war und einfaches "=" etwas mehr "fuzzy" war (soweit ich's noch im Kopf habe was die Länge des Strings und/oder Groß- und Kleinschreibe betraf.)</p> <blockquote> <p>Ja, aber diese Sprachen erlauben auch nicht, die Zuweisung als Ausdruck zu verwenden.</p> </blockquote> <p>Wie auch, da kommt ja der Interpreter/Compiler mächtig ins Straucheln .</p> <blockquote> <p>Ich habe dann etwas im Netz gestöbert und Tante Google hat mir diesen Artikel von Altmeister Niklas Wirth präsentiert: <a href="https://people.inf.ethz.ch/wirth/Articles/GoodIdeas_origFig.pdf" rel="nofollow noopener noreferrer">"Good Ideas, Through The Looking Glass"</a> (von 2004, ein PDF). Sehr interessant </p> </blockquote> <p>Ja, nur so überblättert, werd ich mir aber noch detaillierter 'reinziehen, danke für den Link...</p> Wie rufe ich mit URL-Parametern dynamisch Inhalte auf? Tue, 15 Mar 22 14:47:34 Z https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797391#m1797391 https://forum.selfhtml.org/self/2022/mar/04/wie-rufe-ich-mit-url-parametern-dynamisch-inhalte-auf/1797391#m1797391 <p>Hallo klawischnigg,</p> <blockquote> <p>dBase</p> </blockquote> <p>Oh mein Gott. The 80s are calling - und das schlimmste ist: ich kenn den Ruf auch noch. dBase IV, dann Clipper 5 und der BLinker um die 640KB zu sprengen, hach was waren das gruselige Zeiten.</p> <p><em>Rolf</em></p> <div class="signature">-- <br> sumpsi - posui - obstruxi </div>