如何使用 jQuery 在模态中打印 Java 对象

Question

我正在尝试使用 jQuery 以模式打印对象数据。当我单击按钮时，它将 Java 对象发送到 jQuery 然后打印它，但它以这种格式打印：

旅行 [tid=1, tname=North, tplace=Ladhak, tpackage=12000, tfrom=2022-05-21, tto=2022-05-31, lastdate=2021-12- 22、tinfo=XYZ]

我想访问对象的数据并显示它。

<button class="btn btn-primary open" id="${t}" data-toggle="modal" style="color:white;" data-target="#infoModal">more info</button>

jQuery代码：

    < script type = "text/javascript" >
      $(document).ready(function() {
        $('.open').click(function() {
          var obj = $(this).attr('id');
          $("#show-data").html(obj);
        });
      }); <
    /script>

Answer 1

使用 .split(' ') 拆分您的数据以获得所需的形状。
从数据中删除不需要的字符。
内部循环生成标记。
根据需要附加标记 div。

$('.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>

如何使用 jQuery 在模态中打印 Java 对象

How to print Java object in modal using jQuery

javascript

java

model-view-controller

jquery

spring