2008-12-18 25 views
6

Mam listbox na formularzu HTML z przyciskiem Prześlij. Listbox ma włączoną wielokrotną selekcję. Jestem w stanie wybrać wiele wartości w polu listy, ale nie wiem, jak określić, jakie wartości zostały wybrane, gdy formularz jest przesyłany. Również dodaję generowane przez użytkownika wartości do listy dynamicznie przy użyciu JavaScript i chciałbym móc powiedzieć dwie rzeczy, gdy postać przedkłada:Jak opublikować zaznaczenia pola listy HTML z wieloma wybranymi wartościami

  1. Jakie są opcje dodane do okna przez użytkownika?
  2. Jakie wartości wybierane są w polu przez użytkownika?

Czy to możliwe? Dzięki.

+2

To możliwe ... ale jakiego języka używasz po stronie serwera? ponieważ wydaje się, o co chodzi w większości twoich pytań .. – Jack

Odpowiedz

4

Poniżej znajduje się przykład strony.

zauważyć, że:

  • select elementu (i każdy element formularza) potrzebuje nazwy mają być zawarte w poście.
  • zostaną wyświetlone tylko wybrane opcje z wybranego elementu.

Jakie wartości wybierane są w ramce przez użytkownika?

Gdy użytkownik prześle formularz, tylko wybrane wartości zostaną wysłane na serwer. W zależności od języka używanego na serwerze istnieją różne sposoby uzyskiwania do nich dostępu.

Jakie są opcje dodane do skrzynki przez użytkownika?

Jak wspomniano wcześniej, widoczne są tylko wybrane opcje. Ale w jaki sposób można rozróżnić opcje i opcje użytkowników? To zależy od danych, które wysyłasz do użytkownika. Uniwersalną odpowiedzią jest to, że otrzymujesz wartość, której nie wysłałeś. Można to jednak uprościć w zależności od twoich danych. Ponieważ opcje mają zarówno wartość, jak i właściwość tekstową, można w jeden sposób wykorzystać wartość liczbową do wygenerowanych wartości. W ten sposób Twoje wartości będą numeryczne w odpowiedzi, a wartości użytkowników będą ciągiem tekstowym. W tym podejściu zakłada się, że użytkownik nie wprowadzi tylko wartości liczbowej. Innym podejściem jest dodanie prefiksu do wszystkich wartości tworzone przez użytkowników (pamiętać trzeba zarówno wartość i pole tekstowe do wszystkich opcji)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
    <title>Test of select box</title> 
    <script type="text/javascript"> 
     function addOpt(e) { 
     var o=document.createElement("option"); 
     //o.value= -e.options.length; 
     o.text = "Test " + e.options.length; 
     o.selected=true; 
     e.add(o,null); 
     } 
    </script> 
    </head> 
    <body> 
    <form method="post" action="mypage.html"> 
     <input type="button" onclick="addOpt(this.form.myselect)" value="Add option"/> 
     <br/> 
     <select id="myselect" name="mydata" multiple="multiple" size="10"> 
     <option value="0">Test 0</option> 
     <option value="1">Test 1</option> 
     <option value="2">Test 2</option> 
     </select> 
     <br/> 
     <input type="submit"/> 
    </form> 
    </body> 
</html> 
+2

można i prawdopodobnie powinno się to zrobić bez JavaScriptu używając [] – aleemb

+0

@aleemb: Jak dodaje [] odpowiedzi "Jakie są opcje dodane do skrzynki przez użytkownika" i "Jakie wartości są wybierane w polu przez użytkownika"? Jeśli rzeczywiście spojrzysz na javascript powyżej, to tylko doda opcje do pola wyboru, demonstrując, że tekst będzie użyty jako wartość. – some

36

Nazywając swoje select ze spływu nawiasów kwadratowych, PHP (i możliwych innych językach serwerowych) będzie umieścić dane w tablicy

ex:

<form action="process.php" method="post"> 
    <select name="multiSelects[]" multiple="multiple" size="5"> 
    <option value="0">Zero</option> 
    <option value="1">One</option> 
    </select> 
    <input type="submit" /> 
</form> 

Wybory będą dostępne w tablicy $_POST['multiSelects']

+1

działa to w Node.js/Express.js – prototype

+0

Działa to tylko z PHP jako językiem po stronie serwera – Ejaz

+1

@Ejay: Powinno to działać w każdym standardowym, zgodnym z serwerem języku, w którym warto kodować, – Mrchief

Powiązane problemy