Estoy tratando de imprimir datos de objetos en modal usando jQuery. Cuando hago clic en el botón, envía el objeto Java a jQuery y luego lo imprime, pero lo imprime en este formato:
Viaje [tid=1, tname=Norte, tplace=Ladhak, tpackage=12000, tfrom=2022-05-21, tto=2022-05-31, lastdate=2021-12-22, tinfo=XYZ]
Quiero acceder a los datos del objeto y mostrarlo.
<button class="btn btn-primary open" id="${t}" data-toggle="modal" style="color:white;" data-target="#infoModal">more info</button>
Código jQuery:
< script type = "text/javascript" > $(document).ready(function() { $('.open').click(function() { var obj = $(this).attr('id'); $("#show-data").html(obj); }); }); < /script>
.split(' ')
.div
del deseo. $('.open').click(function() { var html = ""; var obj = "Trip [tid=1, tname=North, tplace=Ladhak, tpackage=12000, tfrom=2022-05-21, tto=2022-05-31, lastdate=2021-12-22, tinfo=XYZ]"; var data = obj.substr(obj.indexOf(' ') + 1).replace('[', '').replace(']', '').split(' '); $.each(data, function(index, value) { var key = value.split('=')[0]; // format these data on your desire shape var val = value.split('=')[1]; html += '<span class="key">' + key + ' </span>'; html += '<span class="val">' + val + ' </span>'; html += '</br>'; }); $("#show-data").html(html); });
.key { color: red } .val { color: green }
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <button class="btn btn-primary open" id="${t}" data-toggle="modal" style="color:white;" data-target="#infoModal">more info</button> <div id="show-data"></div>