✔ jQuery UI MultiSelect Widget

Q

querytail

Erfahrenes Mitglied
Guten Tag,

ich möchte habe folgendes gefunden und möchte die Werte eines Multiselects

Code: 
<select id="example" name="example" multiple="multiple">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
<option value="4">Option 4</option>
<option value="5">Option 5</option>
</select>

über

Code: 
$.ajax({
            url: 'myside.php',
            data: {'selectednumbers':JSON.stringify(selectednumbers)},
            type: 'POST',
            success: function(data) {
              alert('Success!');
            }
        });

verwerten. Wie macht man sowas?

Danke im Voraus

querytail (Michael Meyer)
 
Hi,

lies mit val die Werte des Select-Elements aus:
Code: 
data: {'selectednumbers':JSON.stringify($('#example').val())}

Ciao
Quaese
 
Hallo.

Das ist super. Danke.

Damit steuere ich nun ein Select an. Aber wie macht man das, wenn man mehrere MultiSelect-Felder hat?

Danke im Voraus

querytail (Michael Meyer)
 
Hi,

das ist sicherlich weniger trivial, da du auf der Serverseite sicherlich die unterschiedlichen Selectelelemente getrennt bearbeiten willst.

Mein Lösungsvorschlage geht folgendermassen vor:
- einer Funktion werden in einem Array die IDs der Selektgruppen übergeben
- in der Funktion werden die Arrays der ID als Eigenschaft einem Objekt zugewiesen
- das Objekt wird mit der Methode stringify in ein JSON-Objekt überführt

Beispiel:
Code: 
<html>
<head>
<title>www.tutorials.de</title>
<meta name="author" content="Quaese">
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<script src="jquery-1.4.2.js" type="text/javascript"></script>
<script src="json2.js" type="text/javascript"></script>
<script type="text/javascript">
  <!--
function testIt(arrSel){
  var objAll = {};
  for(strKey in arrSel){
    $.extend(
      objAll, 
      (function(key, val){
        var obj = {};
        obj[key]=val;
        return obj;
      })(arrSel[strKey], $('#'+arrSel[strKey]).val())
    );
  }

  $.ajax({
    url: 'myside.php',
    data: {'selectednumbers':JSON.stringify(objAll)},
    type: 'POST',
    success: function(data) {
      alert(data);
    }
  });
}
 //-->
</script>
</head>
<body>
<button onclick="testIt(['example','example1']);">testIt</button>
<select id="example" name="example" multiple="multiple">
	<option value="1">Option 1</option>
	<option value="2">Option 2</option>
	<option value="3">Option 3</option>
	<option value="4">Option 4</option>
	<option value="5">Option 5</option>
</select>
<select id="example1" name="example" multiple="multiple">
	<option value="1">Option 1</option>
	<option value="2">Option 2</option>
	<option value="3">Option 3</option>
	<option value="4">Option 4</option>
	<option value="5">Option 5</option>
</select>
</body>
</html>

Ciao
Quaese
 
Hallo.

Also ich habe das versucht einzubauen und es bewegt sich nichts (also keine Wirkung beim Klick auf den Button).

Jetzt habe ich den gesamten Quelltext in einem HTML-Dokument gespeichert (jquery und json2 habe ich runtergeladen) und wollte das local probieren. Da passiert auch nichts. Woran kann das denn liegen ?

Danke im Voraus

querytail (Michael Meyer)
 
Hi,

solange das auf einem Webserver läuft, sollte es funktionieren.

Hier eine lauffähige Version zum Testen.

Ciao
Quaese
 
Hallo.

Wow, dankeschön. Jetzt funktioniert es sogar schon in meiner Seite. Hatte wohl die falsche jquery.

Nun mein letztes Problem: Gibt es eine Möglichkeit, Infos von anderen Feldern quasi "mitzunehmen" ?

Danke im Voraus

querytail (Michael Meyer)
 
Hi,

klar gibt es die Möglichkeit. Du musst nur das Array um die IDs der auszuwertenden Felder ergänzen - sollte eigentlich ausreichen.

Ciao
Quaese
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück