File Selector

By | June 14
2 Comments

Um dieses Teil handelt es sich: File Selector DEMO

Letztens hab ich für ein Projekt ein Control benötigt welches Dateien aus einem bestimmten Ordner ausliest und diese zum Auswählen bereit stellt. Man soll ein oder mehrere Files auswählen können, ausserdem sollen Files auch vorselektiert werden. Durch dieses Problem ist ein nettes Control entstanden welches ich mal “FileSelector” benamst hab.
Mit Hilfe dessen kann man nun einiges im Filesystem anstellen. mögliche Szenarien: selektierte dateien löschen, verschieben, umbennen, etc. oder (wie in meinem fall) in die Datenbank schreiben. Hier mal ein Screenshot wie das Control live aussieht:

Fileselector

Einige Features:

  • Für jeden Dateityp kann ein eigenes Icon anzeigt werden. Zur Zeit 26 unterstützte Dateitypen. Um einen neuen Dateityp zu unterstützen muss lediglich ein GIF-image in den images-ordner kopiert werden.
  • Selektieren von mehreren (checkboxes) Dateien erlauben oder nur ein einzelnes (radiobutton).
  • Radiobuttons durch doppelklick wieder deaktivierbar
  • Styles komplett mit CSS.
  • Vorselektieren von Dateien. (Ordner werden automatisch geöffnet und Files selektiert)
  • unterstützt StringBuilder: DLL wird aber benötigt. ist standardmäßig aus. Durch den Stringbuilder wirds um 100% schneller.
  • Komplett mit Tooltips
  • Getestet im Internet Explorer und Firefox (funktioniert auch)
  • Dateien werden per Doppelklick geöffnet
  • Objektorientiert
  • und mehr

Anbei ein kurzes Code-Beispiel wie man den File Selector verwendet:

asp
< view plain text >
  1. <!--#include file="../fileSelector.asp"-->
  2. <%
  3. set fs = new fileSelector
  4. with fs
  5.   .sourcePath = "/michal/files/"
  6.   if request.form.count > 0 then
  7.     .selected = .selected
  8.   end if
  9. end with
  10. %>
  11. <form action="index.asp" method="post" name="frm">
  12.   <div style="padding:30;"><% fs.draw() %></div>
  13.   <div><input type="Submit" name="submit"></div>
  14. </form>
  15. <% set fs = nothing %>

Es wird ein FileSelector instanziert und dessen Höhe und der Ursprungspfad (sourcPath) eingestellt. (in diesem Fall “/michal/files”). Weiter unten sieht man die Ausgabe des Selectors mittels der draw()-methode. Klickt man nun auf den Submit-Button merkt sich das Control die Auswahl. Dies geschieht in bei Zuweisung des selected-getter- an das selected-setter -property. Ich denke mit diesem Control kann man einiges anstellen. So wäre es z.b. kein Problem mehr die selektierten Dateien einfach zu löschen. Viel Spaß beim experimentieren!

Fileselector download
(es liegt ein readme-file bei in dem noch einige Bemerkungen zu finden sind.)

2 comments on “File Selector”

  1. Pingback: ajax image viewer using jquery & ASP classic

  2. Very nice keep on, Cheers;)