Top-Themen

Aktuelle Themen (A bis Z)

Administrator.de FeedbackApache ServerAppleAssemblerAudioAusbildungAuslandBackupBasicBatch & ShellBenchmarksBibliotheken & ToolkitsBlogsCloud-DiensteClusterCMSCPU, RAM, MainboardsCSSC und C++DatenbankenDatenschutzDebianDigitiales FernsehenDNSDrucker und ScannerDSL, VDSLE-BooksE-BusinessE-MailEntwicklungErkennung und -AbwehrExchange ServerFestplatten, SSD, RaidFirewallFlatratesGoogle AndroidGrafikGrafikkarten & MonitoreGroupwareHardwareHosting & HousingHTMLHumor (lol)Hyper-VIconsIDE & EditorenInformationsdiensteInstallationInstant MessagingInternetInternet DomäneniOSISDN & AnaloganschlüsseiTunesJavaJavaScriptKiXtartKVMLAN, WAN, WirelessLinuxLinux DesktopLinux NetzwerkLinux ToolsLinux UserverwaltungLizenzierungMac OS XMicrosoftMicrosoft OfficeMikroTik RouterOSMonitoringMultimediaMultimedia & ZubehörNetzwerkeNetzwerkgrundlagenNetzwerkmanagementNetzwerkprotokolleNotebook & ZubehörNovell NetwareOff TopicOpenOffice, LibreOfficeOutlook & MailPapierkorbPascal und DelphiPeripheriegerätePerlPHPPythonRechtliche FragenRedHat, CentOS, FedoraRouter & RoutingSambaSAN, NAS, DASSchriftartenSchulung & TrainingSEOServerServer-HardwareSicherheitSicherheits-ToolsSicherheitsgrundlagenSolarisSonstige SystemeSoziale NetzwerkeSpeicherkartenStudentenjobs & PraktikumSuche ProjektpartnerSuseSwitche und HubsTipps & TricksTK-Netze & GeräteUbuntuUMTS, EDGE & GPRSUtilitiesVB for ApplicationsVerschlüsselung & ZertifikateVideo & StreamingViren und TrojanerVirtualisierungVisual StudioVmwareVoice over IPWebbrowserWebentwicklungWeiterbildungWindows 7Windows 8Windows 10Windows InstallationWindows MobileWindows NetzwerkWindows ServerWindows SystemdateienWindows ToolsWindows UpdateWindows UserverwaltungWindows VistaWindows XPXenserverXMLZusammenarbeit

Spezielle Multiple Select Box

Mitglied: Simplex-Media

Simplex-Media (Level 1) - Jetzt verbinden

24.10.2008, aktualisiert 25.10.2008, 4632 Aufrufe, 6 Kommentare

Hallo,
ich habe ein Problem mit einer Multiple Select Box und alles versucht ohne Ergebnis.... hoffe hier kann mir jemand weiterhelfen

Folgendes:
ich will ein input feld haben in welches nicht geschrieben werden kann, also readonly ist.
Bei klick auf dieses Feld soll eine Multiple Select Box unter dem Feld eingeblendet werden und die dortigen Einträge sollen wenn man sie anwählt in das readonly input feld geschrieben werden mit z.B. ; getrennt

Ich bin verzweifelt...
Mitglied: Arano
24.10.2008 um 01:53 Uhr
Aha, hm, hm, ähhm...

*tippel tippel*

01.
<html> 
02.
  <head> 
03.
    <title>Simplex</title> 
04.
    <style type="text/css"> 
05.
      <!-- 
06.
        .mjc fieldset        { border:1px solid #c0c0c0; } 
07.
        .mjc fieldset input  { width:250px; } 
08.
        .mjc fieldset select { display:none; } 
09.
      --> 
10.
    </style> 
11.
    <script type="text/javascript"> 
12.
      <!-- 
13.
        function copy(MC,TARGET_ID){ 
14.
            var TARGET = document.getElementById(TARGET_ID); 
15.
            var values = new Array(); 
16.
            for(x=0;x<MC.length;x++) 
17.
                  if(MC.options[x].selected === true) 
18.
                       values.push(MC.options[x].value); 
19.
            TARGET.value = values.join(';'); 
20.
21.
         
22.
        function toggleID(ID){ 
23.
            var TARGET = document.getElementById(ID); 
24.
            if(TARGET.style.display != 'block') 
25.
                  TARGET.style.display = 'block'; 
26.
            else 
27.
                  TARGET.style.display = 'none'; 
28.
29.
      --> 
30.
    </script> 
31.
  </head> 
32.
  <body> 
33.
   
34.
    <form class="mjc"> 
35.
      <fieldset> 
36.
        <legend>Multiple-Javascript-Choice</legend> 
37.
        <input type="text" id="target" value="" readonly onclick="toggleID('choice')"><br> 
38.
        <select size="6" id="choice" multiple onchange="copy(this,'target')"> 
39.
          <option>asdasd 1</option> 
40.
          <option>asdasd 2</option> 
41.
          <option>asdasd 3</option> 
42.
          <option>asdasd 4</option> 
43.
          <option>asdasd 5</option> 
44.
          <option>asdasd 6</option> 
45.
        </select> 
46.
      </fieldset> 
47.
    </form> 
48.
   
49.
  </body> 
50.
</html>
So oder ?

Gruß Arano
Bitte warten ..
Mitglied: Simplex-Media
24.10.2008 um 12:42 Uhr
Herzlichen Dank, genau das ist es jetzt trau ich mich schon fast nicht mehr zu fragen aber gibt es noch eine möglichkeit die multiple select box so umzustricken das man nicht mit der STRG taste arbeiten muss sondern die möglichkeit hat bei jedem eintrag über eine checkbox den wert zu selektieren?
Bitte warten ..
Mitglied: Arano
25.10.2008 um 00:15 Uhr
Hm... denkst du da an eine Selectbox die für jeden Eintrag einzeln noch extra eine Checkbox bereit stellt ?

Wozu dann die Selectbox ?

Dan würde eine einfache Liste mit Checkboxen doch ausreichen... oder nicht ?

Ein schönes Wochenende
~Arano
Bitte warten ..
Mitglied: Simplex-Media
25.10.2008 um 00:45 Uhr
Habe mal eine optimierung der multiple select box gesehen wo zu einfachen selection ohne STRG taste eine checkbox hinzugefügt wurde, wichtig ist mir das ich letztlich eine dropdownliste mit den entsprchenden werten habe und mehrere werte alleine mit der maus selectieren kann (ohne funktionstate wie STRG) und in dem obrigen feld wie von dir super umgesetzt die werte mit ; getrennt aufgelistet bekomme.
Leider ist JavaScript eine Sprache die ich verflucht habe, habe mehrfach versucht mich reinzufuchsen aber ging jedes mal leider nach hinten los weil immer irgendwas dazwischen gekommen ist nur wenn man es wirklich braucht ist die situation unschön
Bitte warten ..
Mitglied: Arano
25.10.2008 um 05:46 Uhr
Also mit einer Dropdownliste geht das nicht, da kann man nur eine Option markieren ;)

Nun denn, habe mich gerade noch mal rangesetzt und meinen ersten Gedenken den ich zu deinem vorherigem Beitag hatte niedergeschrieben:
01.
<html> 
02.
  <head> 
03.
    <title>Simplex</title> 
04.
    <style type="text/css"> 
05.
      <!-- 
06.
        .mjocc fieldset        { border:1px solid #c0c0c0; } 
07.
        .mjocc fieldset input  { width:250px; } 
08.
        .mjocc fieldset select { display:none; } 
09.
      --> 
10.
    </style> 
11.
    <script type="text/javascript"> 
12.
      <!-- 
13.
        function toggleID(ID){ 
14.
            var TARGET = document.getElementById(ID); 
15.
            if(TARGET.style.display != 'block') 
16.
                  TARGET.style.display = 'block'; 
17.
            else 
18.
                  TARGET.style.display = 'none'; 
19.
20.
         
21.
        // in diesem Array werden die schon getaetigten markierungen gespeichert 
22.
        var choices = new Array(); 
23.
        function copy(MC,TARGET_ID){ 
24.
            // MC        = objectreferenz auf die selectbox(MultipleCoice) 
25.
            // TARGET_ID = die ID des inputfields in dem die liste angezeigt werden soll 
26.
            // erstelle eine objectrefferenz zu dem inputfield und speichere sie in TARGET 
27.
            var TARGET = document.getElementById(TARGET_ID); 
28.
             
29.
            // eine schleife die jede option der selectbox abarbeitet 
30.
            for(x=0;x<MC.length;x++) 
31.
                  // wenn die aktuelle option markiert wurde... 
32.
                  if(MC.options[x].selected === true) 
33.
                        // ...fuege sie dem array choices hinzu. 
34.
                        // wenn die position in dem array choices schon belegt ist, ... 
35.
                        if(choices[x] != null) 
36.
                              // ... hebe markierung auf und speichere statt dessen NULL 
37.
                              choices[x] = null; 
38.
                        // andernfalls speichere den wert in dem array 
39.
                        else  choices[x] = MC.options[x].value; 
40.
             
41.
            // in diesem array werden nur die markierten werte aus dem array<choices gespeichert (ohne leere zwischenpositionen) 
42.
            var output = new Array(); 
43.
            // eine schleife die jedes element in dem choices array abarbeitet 
44.
            for(x=0;x<choices.length;x++) 
45.
                  // wenn das element nicht gleich NULL ist,... 
46.
                  if(choices[x] != null){ 
47.
                        // ...kopiere es ins output array und... 
48.
                        output.push(choices[x]); 
49.
                        // ...markiere es in der selectbox 
50.
                        MC.options[x].selected = true; 
51.
                  // wenn es doch gleich NULL ist,... 
52.
                  } else { 
53.
                        // ...hebe die markierung in der selectbox auf. 
54.
                        MC.options[x].selected = false; 
55.
56.
             
57.
            // schreibe alle verbliebenen elemente aus dem output array durch ein semicolon getrent in das inputfield 
58.
            TARGET.value = output.join(';'); 
59.
60.
      --> 
61.
    </script> 
62.
  </head> 
63.
  <body> 
64.
   
65.
     
66.
    <form class="mjocc"> 
67.
      <fieldset> 
68.
        <legend>Multiple-Javascript-One-Click-Choice</legend> 
69.
        <input type="text" id="target" value="" readonly onclick="toggleID('choice')"><br> 
70.
        <select size="6" id="choice" multiple onclick="copy(this,'target')"> 
71.
          <option value="1">asdasd 1</option> 
72.
          <option value="2">asdasd 2</option> 
73.
          <option value="3">asdasd 3</option> 
74.
          <option value="4">asdasd 4</option> 
75.
          <option value="5">asdasd 5</option> 
76.
          <option value="6">asdasd 6</option> 
77.
        </select> 
78.
      </fieldset> 
79.
    </form> 
80.
   
81.
  </body> 
82.
</html>
Habe es auch mal mit ein paar Kommentaren versehen ;)

Fehlt noch was... ahja:
  • Habe es nur im Firefox getestet und
  • Wenn man nun beim markieren die Steuerungstaste gedrückt hält, kommt es zu einem unerwünschtem Ergebnis. Ob man diese beheben kann weiss ich nicht, ich habe da jedenfalls gerade keine spontane Idee zu.

Wenn ich mal fragen darf, wozu brauchst du das eigentlich in dieser Form - also die Übertragung von den Markierungen in eine Semikolon getrennte Zeichenkette ?

Gruß Arano
Bitte warten ..
Mitglied: Simplex-Media
11.03.2009 um 09:31 Uhr
Hallo,
dein Script ist nice .
Gibt es evtl. noch die Möglichkeit das beim laden der Seite die Auswahl automatisch anhand vom value im input feld ausgewählt werden?
Bitte warten ..
Ähnliche Inhalte
Batch & Shell

Powershell Multiple Select Box und Dateien kopieren

gelöst Frage von BuggerBatch & Shell7 Kommentare

Hallo zusammen, ich möchte gerne über eine Box mehrere Server auswählen und auf diesen sollen dann Dateien kopiert werden. ...

Datenbanken

SQL Abfrage (Multiple Rows in singleton select)

Frage von Triforce500Datenbanken2 Kommentare

Hallo, ich habe zwei Tabellen (1:N), heißt: auf einen Datensatz in Tabelle A werden zwei Datensätze in Tabelle B ...

Datenbanken

Select Statement

gelöst Frage von pauls1Datenbanken4 Kommentare

Hallo, ich bin neu hier im Forum und habe schon gleich folgende Frage. Und zwar habe zwei Tabellen ('post' ...

Router & Routing

Multiple Port Forwarding

gelöst Frage von easy4breezyRouter & Routing17 Kommentare

Hi Leute, ich beschäftige mich schon eine Weile mit den Ports und wie das Forwarding läuft etc. Nun möchte ...

Neue Wissensbeiträge
Google Android

Googles "Android Enterprise Recommended" für Unternehmen

Information von kgborn vor 8 StundenGoogle Android3 Kommentare

Hier eine Information, die für Administratoren und Verantwortliche in Unternehmen, die für die Beschaffung und das Rollout von Android-Geräten ...

Sicherheit

Intel gibt neue Spectre V2-Microcode-Updates frei (20.02.2018)

Information von kgborn vor 8 StundenSicherheit

Intel hat zum 20. Februar 2018 weitere Microcode-Updates für OEMs freigegeben, um Systeme mit neueren Prozessoren gegen die Spectre ...

Microsoft
ARD-Doku - Das Microsoft Dilemma
Tipp von Knorkator vor 11 StundenMicrosoft3 Kommentare

Hallo zusammen, vor einigen Tagen lief in der ARD u.a. Reportage. Das Youtube Video dazu dürfte länger verfügbar sein. ...

Windows 10

Neue Sicherheitslücke in Windows 10 (Version 1709) durch Google öffentlich geworden

Information von kgborn vor 1 TagWindows 10

Vor ein paar Tagen haben Googles Sicherheitsforscher vom Projekt Zero eine Sicherheitslücke im Edge-Browser publiziert. Jetzt wurde eine weitere ...

Heiß diskutierte Inhalte
Windows Server
AD DS findet Domäne nicht, behebbar?
Frage von schapitzWindows Server40 Kommentare

Guten Tag, ich habe bei einem Kunden ein Problem mit den AD DS. Umgebung ist folgende: Windows Server 2016 ...

Router & Routing
LANCOM VPN CLIENT einrichten
Frage von Finchen961988Router & Routing27 Kommentare

Hallo, ich habe ein Problem und hoffe ihr könnt mir helfen, wir haben einen Kunden der hat einen Speedport ...

Router & Routing
ISC DHCP 2 Subnetze
gelöst Frage von janosch12Router & Routing19 Kommentare

Hallo, ich betreibe bei mir im Netzwerk einen ISC DHCP Server auf Debian, der DHCP verwaltet aktuell ein /24 ...

Switche und Hubs
Cisco SG350X-48 AdminIP in anderes VLAN
Frage von lcer00Switche und Hubs14 Kommentare

Hallo zusammen, ich habe ein Problem mir einem Cisco SG350X-48 bei der Erstinstallation wurde eine IP 192.168.0.254 (Default VLAN ...