2010-12-01 22 views
8

¿Cómo puedo obtener las .val() y .html() de todas las opciones de una lista de selección múltiple en un objeto json? Preferiblemente utilizando jQuery.Convertir la lista de selección a JSON usando jQuery

¡Gracias de antemano!

Un poco más de información:

estoy usando dos múltiples cajas de selección. Seleccionar elementos en el cuadro de la izquierda y moverlos a la derecha. Una vez que tienen todos los elementos que desean seleccionar, presionarán enviar y tomarán todos los elementos en el cuadro de selección de la derecha y los moverán a una lista principal.

Aquí está el código que estoy utilizando una vez que consiga el objeto JSON:

datalistObject = JSON.parse(response); 
if (datalistObject.length){ 
    $(".data-list tbody").empty(); 
    for (var i=0; i < datalistObject.length; i++) { 
     var newrow = "<tr><td><input type='checkbox' name='user_id' value='" + datalistObject[i][0] + "' class='data-list-check'></td><td>" + datalistObject[i][1] + "</td></tr>"; 
     $(newrow).appendTo($(".data-list tbody")); 
    } 
} 

Ejemplo html y salida sería:

<select name="selecteditems"> 
    <option value="op1">Option 1</option> 
    <option value="op2">Option 2</option> 
    <option value="op3">Option 3</option> 
</select> 

[ 
    ["op1","Option 1"], 
    ["op2","Option 2"], 
    ["op3","Option 3"] 
] 
+0

¿Todas las opciones seleccionadas o todos los elementos? – Orbling

+0

¿Por qué lo necesitas en un objeto JSON? Si proporciona un poco más de información sobre lo que está tratando de lograr, obtendrá mejores respuestas. – Lazarus

+0

Por favor dé ejemplos de salida html y json. –

Respuesta

13

¿Algo como esto?

var items = $("#select > option").map(function() { 
    var opt = {}; 
    opt[$(this).val()] = $(this).text(); 
    return opt; 
}).get(); 

for(var i = 0; i < items.length; i++) { 
    for(key in items[i]) { 
     alert(key + ': ' + items[i][key]); 
    } 
} 

Demostración: http://jsfiddle.net/eNGUL/

EDIT: Para obtener una estructura como su ejemplo de datos:

var items = $("#select > option").map(function() { 
    var arr = []; 
    arr.push([$(this).val(), $(this).text()]); 
    return arr; 
}).get(); 
for(var i = 0; i < items.length; i++) { 
    alert(items[i]); 
} 

Demostración: http://jsfiddle.net/karim79/eNGUL/2/

Ver .map.

+0

¿Puedes explicar esto un poco? Nunca he usado el método del mapa. ¿Cómo podría obtener el resultado que especifiqué anteriormente? ¡Gracias! – RandyLahey

+0

@RandyLahey - He editado mi respuesta. Si lees la página de doc para '.map' y miras los ejemplos que creo que obtendrás, es bastante sencillo. – karim79

Cuestiones relacionadas