¿Alguien sabe cómo convertir la salida de este código en una lista desordenada?
$.fn.serializeObject = function() { var o = {}; var a = this.serializeArray(); $.each(a, function() { if (o[this.name] !== undefined) { if (!o[this.name].push) { o[this.name] = [o[this.name]]; } o[this.name].push(this.value || ''); } else { o[this.name] = this.value || ''; } }); return o; }; $(function() { $('form').submit(function() { $('#result').text(JSON.stringify($('form').serializeObject())); return false; }); });El código anterior genera, por ejemplo, algo así:
{"costPerDay":"20","numberOfDays":"20","designCost":"40","cmsIntegration":"64","seoContentStrategy":"75"}¿Esperaba si hay una manera de hacer que salga en una lista desordenada?
No estoy seguro de cómo se supone que debe verse el resultado deseado, pero de cualquier manera puede iterar sobre su objeto:
// let obj = JSON.stringify($('form').serializeObject()) let obj = {"costPerDay":"20","numberOfDays":"20","designCost":"40","cmsIntegration":"64","seoContentStrategy":"75"}; $("#result").empty().append("<ul></ul>"); for (const entry in obj){ $("#result > ul").append(`<li>${entry}: ${obj[entry]}</li>`); } <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div id="result"></div>O si prefieres una sola línea:
$("#result").empty().append( "<ul>" + Object.entries(obj).map(e => `<li>${e[0]}: ${e[1]}`).join("") + "</ul>" );demostración de trabajo:
Supongo que el código que creaste no funciona, tal vez esto te ayude a descubrir mejor a qué me refiero. Se adjunta el código completo que quería que saliera como "Lista desordenada" y la fuente en CodePen http://jsfiddle. net/JOEHOELLER/217m94fk/2/ Si desea ver el control deslizante de rango en funcionamiento. Gracias
function proRangeSlider(sliderid, outputid, colorclass) { var x = document.getElementById(sliderid).value; document.getElementById(outputid).innerHTML = x; document.getElementById(sliderid).setAttribute('class', colorclass); updateTotal(); } var total = 0; function updateTotal() { var list= document.getElementsByClassName("range"); [].forEach.call(list, function(el) { console.log(el.value); total += parseInt(el.value); }); document.getElementById("n_total").innerHTML = total; } $.fn.serializeObject = function() { var o = {}; var a = this.serializeArray(); $.each(a, function() { if (o[this.name] !== undefined) { if (!o[this.name].push) { o[this.name] = [o[this.name]]; } o[this.name].push(this.value || ''); } else { o[this.name] = this.value || ''; } }); return o; }; $(function() { $('form').submit(function() { $('#result').text(JSON.stringify($('form').serializeObject())); return false; }); });