button in Farbe und nebeneinander anzeigen

[Michael w]

Hallo!

Ich lasse mir mit folgendem Code Verzeichnisse als Buttons ausgeben

<?php
$handle = opendir('.');

if($handle){
    while(($entry = readdir($handle)) !== false){
        if($entry != '.' && $entry != '..' && $entry != '.htaccess'){
          echo "<button onclick=\"location.href='./$entry'\">$entry</button><br>";
        }
    }
    closedir($handle);
}
?>

Nun möchte ich das die Buttons nebeneinander und in z.B. anderen Farben und eventuell Formen ausgeben lassen (mit bootstrap vielleicht?). Leider läuft alles ins leere was ich probiert habe, könnt Ihr mir vielleicht helfen?

Danke schonmal im voraus

LG

Michael

[Tabellenkalk]

Hallo,

Nun möchte ich, dass die Buttons nebeneinander und in z.B. anderen Farben und eventuell Formen ausgeben lassen

Mit css sollte das gehen.

Leider läuft alles ins leere was ich probiert habe,

Was hast du denn schon probiert?

Gruß
Kalk

[Gunnar Bittersmann]

@@Tabellenkalk

Nun möchte ich, dass die Buttons nebeneinander […]

Mit css sollte das gehen.

Du meinst br { display: none }? 😉

LLAP 🖖

[Tabellenkalk]

Hallo,

Du meinst br { display: none }? 😉

Hey, guter Tipp. Nicht.

Das br hab ich übersehen. 😎

Also: erst das html bereinigen und dann mit css neu lackieren!

Gruß
Kalk

[Rolf B]

Hallo Michael,

meine persönliche Meinung: vergiss Bootstrap für diesen Zweck. Das ist ein CSS Framework für Seitenlayouts. Da gibt's möglicherweise ein paar Klassen, mit denen Du Buttons manipulieren kannst, aber nur dafür Bootstrap reinzuziehen, das ist nicht angemessen. Wenn Du Bootstrap eh drin hast, sieht das anders aus...

Dass die Buttons nebeneinander stehen und nicht untereinander, das hast Du selbst veranlasst. Weißt Du, wozu in HTML das br Element dient?

Zu Kalks Hinweis: Weißt Du, was CSS ist und wie man Styles nutzt? Wenn nicht: Hier ist ein Einstieg.

Sonstige Hinweise:

Das Zeichen ' ist in Dateinamen erlaubt, wenn du eine solche Datei im Ordner hast ist der Button defekt. Das müsstest Du escapen.

Du bekommt Verzeichnisse und Dateien zurück. Wenn Du nur Dateien willst, solltest Du mit glob(".", GLOB_MARK) arbeiten, da bekommst Du ein Array aus Strings mit Datei- und Verzeichnisnamen, und durch GLOB_MARK hängt an Verzeichnissen ein / oder \ hinten dran (der Wert von DIRECTORY_SEPARATOR).

$files = array_filter(glob("*", GLOB_MARK), 
                      function($f) { return substr($f, -1, 1) !== DIRECTORY_SEPARATOR; });

Rolf

[beatovich]

hallo

Du bekommt Verzeichnisse und Dateien zurück. Wenn Du nur Dateien willst, solltest Du mit glob(".", GLOB_MARK) arbeiten, da bekommst Du ein Array aus Strings mit Datei- und Verzeichnisnamen, und durch GLOB_MARK hängt an Verzeichnissen ein / oder \ hinten dran (der Wert von DIRECTORY_SEPARATOR).

Hier sollen URIs ausgegeben werden, nicht Dir-Pfade!

[Rolf B]

Hallo beatovich,

Hier sollen URIs ausgegeben werden, nicht Dir-Pfade!

Vielleicht verstehe ich Dich gerade miss. Mein Sample-Code filtert die Verzeichnisse aus und lässt nur die Dateien stehen. Der übrige Code des OP setzt dann im click-Handler des Button location.href auf "./"+$dateiname, macht also einen Pseudolink daraus. Ich habe nicht getestet, ob das zuverlässig funktioniert, das mag der OP entscheiden.

Solange im aufgelisteten Ordner nur publizierte Dateien stehen, kann man auf diese Weise Verweise bilden. Wer sich so eine Adresse als Bookmark speichert, hat irgendwann Pech.

Good practice ist das Ganze nicht, das ist mir definitiv durchgegangen zu erwähnen. Buttons sind hier das falsche Element, es sollten Links sein, weil auf eine andere Ressource verwiesen wird. Und man braucht dann auch nicht unnötig Script im Browser. Diese Links kann man button-artig stylen, wenn's gewünscht ist.

Rolf

[beatovich]

hallo

Hallo beatovich,

Hier sollen URIs ausgegeben werden, nicht Dir-Pfade!

Vielleicht verstehe ich Dich gerade miss. Mein Sample-Code filtert die Verzeichnisse aus und lässt nur die Dateien stehen.

Meine Bemerkung betrifft die Art des Slashes. Hier muss nicht der default vom System übernommen werden sondern der für URIs vorgesehene.

Solange im aufgelisteten Ordner nur publizierte Dateien stehen, kann man auf diese Weise Verweise bilden. Wer sich so eine Adresse als Bookmark speichert, hat irgendwann Pech.

Da wäre dann im Fall von a-Elementen ein rel="noindex" angebracht.

Good practice ist das Ganze nicht, das ist mir definitiv durchgegangen zu erwähnen. Buttons sind hier das falsche Element, es sollten Links sein, weil auf eine andere Ressource verwiesen wird.

Nur wenn du diese Ressourcen auch indexiert haben willst.

Und man braucht dann auch nicht unnötig Script im Browser. Diese Links kann man button-artig stylen, wenn's gewünscht ist.

Kommt auf den Kontext, den wir nicht kennen an.

[Rolf B]

Hallo beatovich,

Meine Bemerkung betrifft die Art des Slashes. Hier muss nicht der default vom System übernommen werden sondern der für URIs vorgesehene.

Das passiert mNn nicht. Im glob-Ergebnis steht bei Directory-Einträgen, die Verzeichnissen entsprechen, ein betriebssystemabhängiger Slash am Namensende, und diese Einträge werden ausgefiltert. glob ist nicht rekursiv, d.h. Slashes innerhalb der Treffer kommen auch nicht vor. Beim Aufbauen der Buttons setzt der OP ein uri-konformes /.

Was übersehe ich?

Rolf

[beatovich]

hallo

Das passiert mNn nicht. Im glob-Ergebnis steht bei Directory-Einträgen, die Verzeichnissen entsprechen, ein betriebssystemabhängiger Slash am Namensende, und diese Einträge werden ausgefiltert. glob ist nicht rekursiv, d.h. Slashes innerhalb der Treffer kommen auch nicht vor. Beim Aufbauen der Buttons setzt der OP ein uri-konformes /.

Was übersehe ich?

Wenn Du nur Dateien willst, solltest Du mit glob(".", GLOB_MARK) arbeiten, da bekommst Du ein Array aus Strings mit Datei- und Verzeichnisnamen, und durch GLOB_MARK hängt an Verzeichnissen ein / oder \ hinten dran (der Wert von DIRECTORY_SEPARATOR).

[beatovich]

hallo

if($handle){ while(($entry = readdir($handle)) !== false){ if($entry != '.' && $entry != '..' && $entry != '.htaccess'){ echo "<button onclick="location.href='./$entry'">$entry</button><br>"; } }

Bei deinem $entry liegt Folgendes vor

• html kontext -> html-kodieren!
• javascript URI -> encodeURI()!

[Gunnar Bittersmann]

@@Michael w

Nun möchte ich das die Buttons

Nein, du möchtest keine Buttons.

Buttons sind für Aktionen auf einer Seite. Für Verlinkungen zu anderen Seiten sind Buttons falsch; Links richtig.

Nicht <button onclick="location.href='./$entry'">$entry</button>, sondern <a href='./$entry'>$entry</a>.

Insbesondere für Nutzer assisitver Technologien wie Screenreader ist wichtig, dass die richtigen HTML-Elemente für den richtigen Zweck verwendet werden.

Mit CSS kannst du den Links eine Hintergrundfarbe geben und sie wie Buttons aussehen lassen. Auch Rahmen, runde Ecken, …

Ob das gut ist, Links wie Buttons aussehen zu lassen, wäre noch eine andere Frage.

LLAP 🖖

[beatovich]

hallo

Ob das gut ist, Links wie Buttons aussehen zu lassen, wäre noch eine andere Frage.

Wie macht man das?

[Tabellenkalk]

Hallo,

Links wie Buttons aussehen zu lassen

Wie macht man das?

Bachgrund−Colour: gray

Gruß
Kalk

[Matthias Apsel]

Hallo beatovich,

Ob das gut ist, Links wie Buttons aussehen zu lassen, wäre noch eine andere Frage.

Wie macht man das?

Mit Vorsicht zu genießen: https://wiki.selfhtml.org/wiki/CSS/Eigenschaften/Anzeige/appearance

Bis demnächst
Matthias

[Gunnar Bittersmann]

@@beatovich

Ob das gut ist, Links wie Buttons aussehen zu lassen, wäre noch eine andere Frage.

Wie macht man das?

Mit „wie Buttons“ meinte ich nicht wie die Systembuttons auf dem jeweiligen System.

LLAP 🖖

[beatovich]

hallo

@@beatovich

Ob das gut ist, Links wie Buttons aussehen zu lassen, wäre noch eine andere Frage.

Wie macht man das?

Mit „wie Buttons“ meinte ich nicht wie die Systembuttons auf dem jeweiligen System.

sondern solche? https://t3.ftcdn.net/jpg/00/00/57/58/500_F_575800_S2HRbc8VfBqMVAgCqsjb8VAJTd9AKz.jpg