Enviar Formulario con <select multiple> via POST

[Computer XTress]

Hola a todos

Necesito hacer POST de un formulario que tiene un SELECT múltiple y no logro idear una forma de lograrlo. Tengo una función que recoge todos los valores de un formulario pero por el tipo elemento (<select>) no me sirve de nada...

¿Cual sería la metodología correcta para lograr esto?

Muchas gracias!

[Computer XTress]

Solucionado:

Arme esta función. Está en BRUTO, sin optimizar... algo que voy a hacer dentro de 20 min despues de mi descanso :P

Código:

ffunction setQueryString() {
	queryString = "";

	var frm = document.forms[0];
	var numberElements = frm.elements.length;

	for (var i = 0; i < numberElements; i++) {

		if (i < numberElements - 1) {

			if (frm.elements[i].tagName == "SELECT"){
				var select = frm.elements[i].name +"=";
				for (y=0; y < frm.elements[i].options.length; y++) {
					if (frm.elements[i].options[y].selected) {
						select += frm.elements[i].options[y].value + ",";
					}
				}

				queryString += select + "&";
				select = "";
			}

			queryString += frm.elements[i].name + "=" + encodeURIComponent(frm.elements[i].value) + "&";

		} else {

			if (frm.elements[i].tagName == "SELECT"){
				var select = frm.elements[i].name +"=";
				for (y=0; y < frm.elements[i].options.length; y++) {
					if (frm.elements[i].options[y].selected) {
						select += frm.elements[i].options[y].value + ",";
					}
				}

				queryString += select;
				select = "";
			}
			queryString += frm.elements[i].name + "=" + encodeURIComponent(frm.elements[i].value);
		}
	}
}

Saludos.

[Lorsui]

Hola!!!, yo estoy ahora con ese mismo problema. Pero lo estaba haciendo en php.
Una pregunta, vos utilizás 2 códigos para hacer toda la función de formulario?
Podrías pasarme los códigos con que lograste hacerlo, no sólo el que pegaste, sino también los otros, cómo es el formulario en ajax?
Graciassss

[Computer XTress]

Holas

Sip, te explico como lo hice... tengo estas funciones:

sendData(): Envía un request por background. Espera una URL apuntando hacia un script que recibirá y procesará información.

setQueryString(): Recorre el primer formulario del documento capturando elementos y valores. Genera un string con formato nombreElemento=valorElemento&. Es llamada internamente desde la funcion sendData();


En el formulario no usas ningun action... pero le aplicas un evento onsubmit indicando que llame a la función sendData(). De forma tal que se genere el string con toda la data y se envíe al URL deseado.

Vamos a las funciones... todavia no optimize la función setQueryString(), fijate de hacerlo vos para no repetir estructuras...

FUNCION sendData()

Código:

function sendData(vUrl) {
	setQueryString();
	httpRequest("POST", vUrl, true, handleResponse, queryString);
}

Como ves, se llama a setQueryString(), luego se envia un request indicando el URL (vUrl), la función handler y el string con toda la data.


La funcion setQueryString()

Código:

function setQueryString() {
	queryString = "";

	var frm = document.forms[0];
	var numberElements = frm.elements.length;

	for (var i = 0; i < numberElements; i++) {

		if (i < numberElements - 1) {

			if (frm.elements[i].tagName == "SELECT"){
				var select = "_"+ frm.elements[i].name +"=";
				for (y=0; y < frm.elements[i].options.length; y++) {
					if (frm.elements[i].options[y].selected) {
						select += encodeURIComponent(frm.elements[i].options[y].value) + "-";
					}
				}

				queryString += select + "&";
				select = "";
			}

			queryString += frm.elements[i].name + "=" + encodeURIComponent(frm.elements[i].value) + "&";

		} else {

			if (frm.elements[i].tagName == "SELECT"){
				var select = "_"+ frm.elements[i].name +"=";
				for (y=0; y < frm.elements[i].options.length; y++) {
					if (frm.elements[i].options[y].selected) {
						select += encodeURIComponent(frm.elements[i].options[y].value) + "-";
					}
				}

				queryString += select;
				select = "";
			}
			queryString += frm.elements[i].name + "=" + encodeURIComponent(frm.elements[i].value);
		}
	}
}

Si la analizas detenidamente la vas a entender... es simple la cuestión. No solo recorro el form creando un STRING, sino que analiso los elementos en busqueda de elementos tipo "SELECT". Si aparece alguno, creo una segunda string y en su contenido voy a colocar el nombre del SELECT y todos los "values" separados por coma de los <OPTION>'s seleccionados. Esto me quedaría asi:

"_"+ Nombre_Del_SELECT + "=" + valor_1 +", "+ valor_2 +", "+ valor_3

Luego sumo ese string al string principal queryString.

Me queda algo asi... ejemplo:

nombre=Pedro&apellido=Fernandez&_saboresdehelado=1 , 2, 3&[email protected]


Ahora.. fijate un detalle...

var select = "_"+ frm.elements[i].name +"=";

En el PHP vos sabes que si tu <select> tenia name="modulos", el post correspondiente a éste será $_POST["_modulos"]. Por que en el string le agregaste "_" adelante... esto es para no confundir la información real del form !!


CONCLUSION

Código:

...
<form action="javascript:void%200;" method="post" onsubmit="sendData('../scripts/proceso_forms.php');">

<select name="modulos">
 <option id='1' value='SISTEMA'>SISTEMA</option>
 <option id='2' value='USUARIOS'>Usuarios</option>
 <option id='19' value='WEBS'>webs</option>
</select>

<input type='submit' value='manda' />
...
</form>

Código PHP:

  <?php

if ($_POST['_modulos') {
   $ar_modulos = array();

   $ar_modulos = explode(", ", $_POST['_modulos']);
}

  foreach($ar_modulos as $value) {
   echo $value."<br/>";
 }
}

?>   

Bueno, espero sirva. Un saludo