Simple
//Code ------------
let template = `
<div>
{{#with res}}
<p>{{title}} - {{author}} - {{price}}</p>
{{/with}}
</div>
`;
pm.visualizer.set(template, {
res: pm.response.json().book
});
//Response ------------
{
"book": {
"category": "reference",
"author": "Nigel Rees",
"title": "Sayings of the Century",
"price": 8.95
}
}
//Display ------------
Sayings of the Century - Nigel Rees - 8.95
|
Simple Table
//Code ------------
const template = `
<div>
<table>
<thead>
<tr>
<th>Title</th>
<th>Author</th>
<th>Category</th>
<th>Price</th>
<th>Isbn</th>
</tr>
</thead>
<tbody>
{{#each data}}
<tr>
<td>{{title}}</td>
<td>{{author}}</td>
<td>{{category}}</td>
<td>{{price}}</td>
<td>{{isbn}}</td>
</tr>
{{/each}}
</tbody>
</table>
</div>
`
var data = pm.response.json().store.book;
pm.visualizer.set(template, { data });
//Response ------------
{
"store": {
"book": [
{
"category": "reference",
"author": "Nigel Rees",
"title": "Sayings of the Century",
"price": 8.95
},
{
"category": "fiction",
"author": "Evelyn Waugh",
"title": "Sword of Honour",
"price": 12.99
},
{
"category": "fiction",
"author": "Herman Melville",
"title": "Moby Dick",
"isbn": "0-553-21311-3",
"price": 8.99
},
{
"category": "fiction",
"author": "J. R. R. Tolkien",
"title": "The Lord of the Rings",
"isbn": "0-395-19395-8",
"price": 22.99
}
]
}
}
|
|
|
Complex table + css
//Code ---------------------
const template = `
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.22/css/jquery.dataTables.min.css">
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="https://cdn.datatables.net/1.10.22/js/jquery.dataTables.min.js"></script>
<h2 style="text-align:center">Book Store</h1>
<style>
#book {
font-family: Arial, Helvetica, sans-serif;
border-collapse: collapse;
width: 100%;
}
#book td, #book th {
border: 1px solid #ddd;
padding: 8px;
}
#book tr:nth-child(even){background-color: #f2f2f2;}
#book tr:hover {background-color: #ddd;}
#book th {
padding-top: 12px;
padding-bottom: 12px;
text-align: left;
background-color: #04AA6D;
color: white;
}
</style>
<div class="table">
<table id="book">
<thead>
<tr>
<th>Title</th>
<th>Author</th>
<th>Category</th>
<th>Price</th>
<th>Isbn</th>
</tr>
</thead>
<tbody>
{{#each data}}
<tr>
<td>{{title}}</td>
<td>{{author}}</td>
<td>{{category}}</td>
<td>{{price}}</td>
<td>{{isbn}}</td>
</tr>
{{/each}}
</tbody>
</table>
</div>
<script>
$('table').DataTable()
</script>
`
var data = pm.response.json().store.book;
pm.visualizer.set(template, { data });
|
Display - Complex table + css
|