[JQUERY]Array multidimensionali in javascript

**gaten** · 04-02-2010, 20:29

Salve ragazzi ho creato un sistema javascript che mi permette di selezionare un valore tramite un combo/menu e poi tramite un altro combo/menu man mano che seleziono i valori, questi vengono inseriti in un'array ottenendo una cosa del genere:

valoreMenu1 -> valore1menu2, valore2menu2, valore3menu2...

Ecco il codice:

codice:

<head>	
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.ui.js"></script>
<script type="text/javascript" src="jquery.asmselect.js"></script>

<script type="text/javascript">

		$(document).ready(function() {
			$("select[multiple]").asmSelect({
				addItemTarget: 'bottom',
				animate: true,
				highlight: true,
				sortable: true
			});
			
		}); 

</script>
</head>

<select id="colors" title="Scegli il colori del prodotto">
<option value="Bianco">Bianco</option>
<option value="Verde">Verde</option>
<option value="Rosso">Rosso</option>
...
</select>

Ecco il secondo menu:

<select id="size" multiple="multiple" name="size[]" title="Scegli le taglie del prodotto">
<option>X</option>
<option>XXL</option>
<option>S</option>
...
</select>

Adesso, io dovrei fare una cosa, prima di inviare il tutto alla pagina legata al form, dovre avere la possibilità di memorizzare tutti i colori con le relative taglie associate, ottenendo una cosa del genere:

bianco->x, xxl, s
rosso->m, xs, l
verde->l
...

Dopo di chè posso inviare il tutto, e come se dovessi crerare un array multidimensionale.

Grazie anticipatamente.
Se avete dubbi su quello che ho postato, chiedete.

**artorius** · 05-02-2010, 15:47

Vediamo se ho capito bene: tu generi un Object (un array con chiavi alfanumeriche) dove la chiave di ogni elemento è il colore scelto nella prima select ed il valore dell'elemento è un Array contenente le taglie scelte per il colore. Giusto?

Quello che devi fare è inviare questo Object al server con il submit di una form. Giusto?

Se è tutto così, la cosa più semplice è, a mio avviso, fare una richiesta Ajax al server quando premi il bottone di salvataggio inviando il POST l'oggetto che hai generato (ci pensa jQuery a trasformarlo nella query HTTP corretta) disabilitando il bottone dopo la richiesta, poi, a seconda della risposta, redirezioni alla pagina successiva, o mostri un messaggio di errore.

Per esempio, il login di Alfresco Share: http://share.alfresco.com/share/page/site-index

Quando premi su login, lui disabilita il bottone, fa una richiesta ajax ed in base alla risposta ti manda un messaggio di errore se il login non funziona, o ti ridireziona alla pag principale se ha avuto successo.

**gaten** · 08-02-2010, 18:27

No artorius, non è come dici tu. Forse mi sono esposto male io.
Cerco di essere più chiaro:

Praticamente stò creando un sistema per l'inserimento di prodotti su un database, e adesso stò creando una parte che mi permette di gestire i colori e le taglie del prodotto.

Per ora tramite jQuery sono riuscito a trovare questo script:

http://www.maenladivisa.it/MenuJS/esempio.php

Praticamente io seleziono il colore, dopo di chè gli associo una lista di taglie(es. X, XL, S...) dopo di chè quando clicco su "Submit", leggo tutto in php. Ottenendo una variabile che contiene il Colore scelto e un array che contiene la lista delle taglie associate al colore.

Adesso io dovrei fare così:

1) Seleziono il colore.
2) Seleziono le taglie da associare.
3) Prima di inviare, creare una sorta di array multidimensionale, che contiene una cosa del genere man mano che inserisco colore e taglie.

Ottenendo una cosa del genere in php:

$array = array("Bianco" => array("XL", "S", "L"),
"Nero" => array("XL", "M", "XXL", "L"),
"Verde" =>array(...));

Ovviamente avrò due pulsanti associati al form:

[Inserisci in memoria](legato alla funzione javascript) > Pulsante che mi permette di inserire il colore e l'insieme delle taglie associate, nell'array multidimensionale

[Invia tutto] > Pulsante che mi invia tutte le info alla pagina .php legata al form.

Grazie anticipatamente,

Gaten

**artorius** · 08-02-2010, 19:00

mmm devo dire che quello script non è proprio il più customizzabile del mondo...

se le cose restano costanti devi fare:

codice:

var MyObj = {};

function myOnSubmit(){
   MyObj = {};
   $('#asmList0 span.asmListItemLabel').each(function(item){
      var str = item.text();
       MyObj[str] = [];
   });
   $('#asmList1 span.asmListItemLabel').each(function(item){
      var str = item.text();
      for(var x in MyObj){
         MyObj[x].push(str);
      }
   });

   $.ajax({
      'url' : 'file.php',
      'type' : 'post',
      'success' : CallbackFunction,
      'data' : MyObj
   });
   return false;
}

function CallbackFunction(data){
    alert("Dati inviati al server\n Risposta: "+data);
}

$(document).ready(function(){
    $("#IDForm").bind('submit', myOnSubmit); //Ovviamente devi mettere l'id alla form
});

Dovrebbe andare, spero (io non lo uso jQuery)...

**gaten** · 09-02-2010, 00:17

Artorius, poichè di Javascript sò poco o quasi NIENTE, potresti farmi un esempio sull'html che ti ho scritto io?

codice:

<form name="stock" method="POST" action="page.php">
<input name="nome" type="text" />
<input name="prezzo" type="text" />
<select id="color" title="Scegli il colori del prodotto">
<option value="Bianco">Bianco</option>
<option value="Verde">Verde</option>
<option value="Rosso">Rosso</option>
...
</select>

Ecco il secondo menu:

<select id="size" multiple="multiple" name="size[]" title="Scegli le taglie del prodotto">
<option>X</option>
<option>XXL</option>
<option>S</option>
...
</select>
<input type="submit" name="memorizza" value="submit" /> <--- Questo pulsante quando clicco non deve eseguirmi il refresh della pagina, ma bensì inserirmi i valori nell'array 
multidimensionale
<input type="submit" name="invia" value="submit" /> <--- Questo pulsante invece mi invia tutto alla pagina
</form>

Grazie anticipatamente.

**artorius** · 09-02-2010, 12:34

quello che ho scritto È sull'html della pagina che hai postato prima, e dovrebbe andare anche su questo, basta che metti alla form id="IDForm" ed aggiungi

$("#IDForm").bind('submit', myOnSubmit);

dopo l'instanziazione delle asmSelect

Discussione: [JQUERY]Array multidimensionali in javascript

Strumenti discussione

Ricerca discussione

Visualizza

[JQUERY]Array multidimensionali in javascript

Permessi di invio