Hello community. Since a few days, the batch view option is not working properly, see the attached screenshot. Instead of showing all of the selected invoices (in this case) to be able to print them all on one PDF, it is showing only empty boxes.
Hello @WILLMOREY,
I have moved your post to this bug report.
Please elaborate more on your case, are you using old Themes? New Themes? Theme Enhancer? Or maybe Footers?
Hello,
Thanks for the merging of subjects.
I’ve never touched the Themes setting. The bug with the Batch views started just a few days ago and I’m noticing that the formats of the PDFs have changed since the same time.
I’ve just restarted the cloud server as recommended and the bug is still there.
1 Like
Batch view still not working 
batch view is still not working @lubos
When Lubos fixes it he removes it from Bugs.
As he has not fixed it then removed it from Bugs he knows it is not fixed
It seems the bug is still there, i found one alternative to go around it but it will take a bit of time and accuracy, Note: the time that will be consumed won’t be for future records but the past that you want to print in batch…
1- Go to Setting → Themes and create new (name it: “Original theme with small tweaks for Batch View”)
replace the existing code and paste this below code;
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<!-- Styling for consistent look and feel -->
<style>
*, ::after, ::before, ::backdrop, ::file-selector-button {
margin: 0;
padding: 0;
}
*, ::after, ::before, ::backdrop, ::file-selector-button {
box-sizing: border-box;
border: 0 solid;
}
body {
margin: 0;
padding: 30px;
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
color: #171717;
font-size: 12px;
line-height: 1.428571429;
min-width: 800px;
}
table {
font-size: 12px;
}
tr#table-headers th {
font-weight: bold;
padding: 5px 10px;
border: 1px solid #000;
text-align: start
}
tbody#table-rows td {
padding: 5px 10px;
border-left: 1px solid #000;
border-right: 1px solid #000;
text-align: start;
vertical-align: top
}
tbody#table-rows tr:last-child td {
padding-bottom: 30px;
border-bottom: 1px solid #000;
}
</style>
</head>
<body>
<!-- Top section: document title and optional business logo -->
<table style="margin-bottom: 20px; width: 100%">
<tbody>
<tr>
<td style="vertical-align: top">
<div style="font-size: 32px; line-height: 32px; font-weight: bold">{{ title }}</div>
</td>
{% if business.logo != null %}
<td style="text-align: end">
<img src="{{ business.logo }}" style="max-height: 150px; max-width: 300px; display: inline" />
</td>
{% endif %}
</tr>
</tbody>
</table>
<!-- Second section: recipient info, document fields (like date, invoice #), and business info -->
<table style="margin-bottom: 20px; width: 100%">
<tbody>
<tr>
<td style="vertical-align: top">
<div style="font-weight: bold">{{ recipient.name }}</div>
<div>{{ recipient.address | newline_to_br }}</div>
<div>{{ recipient.identifier }}</div>
</td>
<td style="text-align: end; vertical-align: top">
{% for field in fields %}
<div style="font-weight: bold">{{ field.label }}</div>
<div style="margin-bottom: 10px">{{ field.text }}</div>
{% endfor %}
</td>
{% if business.address != null %}
<td style="width: 20px"></td>
<td style="width: 1px; border-left-width: 1px; border-left-color: #000; border-left-style: solid"></td>
<td style="width: 20px"></td>
<td style="width: 1px; white-space: nowrap; vertical-align: top">
<div style="font-weight: bold">{{ business.name }}</div>
<div>{{ business.address | newline_to_br }}</div>
{% for field in business.custom_fields %}
<div>{{ field.label }} {{ field.text }}</div>
{% endfor %}
</td>
{% endif %}
</tr>
</tbody>
</table>
<!-- Description block -->
<div style="font-weight: bold; font-size: 14px; margin-bottom: 20px">{{ description }}</div>
<!-- Main table containing column headers, line items, and totals -->
<table style="border-collapse: collapse; width: 100%">
<thead>
<tr>
{% for column in table.columns %}
<th style="font-weight: bold; padding: 5px 10px; border: 1px solid #000; text-align: {{ column.align }}{% if column.nowrap %}; white-space: nowrap; width: 80px{% endif %}">{{ column.label }}</th>
{% endfor %}
</tr>
</thead>
<tbody>
{% for row in table.rows %}
<tr>
{% for cell in row.cells %}
<td style="padding: 5px 10px; border-left: 1px solid #000; border-right: 1px solid #000; text-align: {{ table.columns[forloop.index0].align }}{% if table.columns[forloop.index0].nowrap %}; white-space: nowrap; width: 80px{% endif %}">{{ cell.text | newline_to_br }}</td>
{% endfor %}
</tr>
{% endfor %}
<tr>
{% for column in table.columns %}
<td style="padding-bottom: 30px; border-left: 1px solid #000; border-right: 1px solid #000; border-bottom: 1px solid #000"> </td>
{% endfor %}
</tr>
</tbody>
<tbody>
{% for total in table.totals %}
<tr>
<td colspan="{{ table.columns | size | minus:1 }}" style="text-align: end; padding: 5px 10px{% if total.emphasis == true %}; font-weight: bold{% endif %}">{{ total.label }}</td>
<td style="border: 1px solid #000; text-align: right; white-space: nowrap; padding: 5px 10px{% if total.emphasis == true %}; font-weight: bold{% endif %}">{{ total.text }}</td>
</tr>
{% endfor %}
</tbody>
</table>
<!-- Section for any additional custom fields -->
{% for field in custom_fields %}
<div style="font-weight: bold; padding-top: 20px">{{ field.label }}</div>
<div>{{ field.text | newline_to_br }}</div>
{% endfor %}
<!-- Section for footers -->
<table><tr><td>
{% for footer in footers %}
<div style="margin-top: 20px">{{ footer }}</div>
{% endfor %}
</td></tr></table>
<!-- Section for final status (e.g. PAID, VOID) with special styling -->
{% if emphasis.text != null %}
<div style="text-align: center; margin-top: 40px">
<span style="border-width: 5px; border-style: solid; padding: 10px; font-size: 20px; text-transform: uppercase{% if emphasis.positive %}; color: green; border-color: green{% endif %}{% if emphasis.negative %}; color: red; border-color: red{% endif %}">{{ emphasis.text | upcase }}</span>
</div>
{% endif %}
<!-- QR Code section (for Saudi Arabia) -->
{% if legacyQrCodeForSaudiArabia %}
<div id="qrcode" style="margin-bottom: 20px"></div>
<script src="resources/qrcode/qrcode.js"></script>
<script>
function appendTLV(tag, text, byteList) {
const encoded = new TextEncoder().encode(text);
byteList.push(tag);
byteList.push(encoded.length);
for (let b of encoded) byteList.push(b);
}
const byteList = [];
let businessName = '{{ business.name }}' || 'No name';
let vatNumber = '0000000000000';
{% for field in business.custom_fields %}
{% if field.key == "d96d97e8-c857-42c6-8360-443c06a13de9" %}
vatNumber = '{{ field.text }}';
{% endif %}
{% endfor %}
let timestamp = new Date(({{ timestamp }} - 621355968000000000) / 10000).toISOString();
let total = 0;
{% for total in table.totals %}
{% if total.key == 'Total' %}
total = {{ total.number }};
{% endif %}
{% endfor %}
let vat = 0;
{% for total in table.totals %}
{% if total.class == 'taxAmount' %}
vat += {{ total.number }};
{% endif %}
{% endfor %}
appendTLV(1, businessName, byteList);
appendTLV(2, vatNumber, byteList);
appendTLV(3, timestamp, byteList);
appendTLV(4, total.toFixed(2), byteList);
appendTLV(5, vat.toFixed(2), byteList);
// Convert to Uint8Array
const tlvBytes = Uint8Array.from(byteList);
// Convert to Base64
const qrData = btoa(String.fromCharCode(...tlvBytes));
new QRCode(document.getElementById("qrcode"), {
text: qrData,
width: 128,
height: 128,
colorDark: "#000000",
colorLight: "#ffffff",
correctLevel: QRCode.CorrectLevel.L
});
</script>
{% endif %}
</body>
</html>
2- Go to sale or purchase invoice tab, below is a box named “form default” click on it and it will show an empty invoice, then go to down to “custom theme” and select the theme which was created by the name of “Original theme with small tweaks for Batch View”. and click update.
3- Now all future invoices will have a default theme that can be viewed/printed in batch view.
4- To make previously created invoices show in a batch view, is to update their theme, and the fastest and best way to do it is to use “batch update”.
5- When you paste the data into an excel sheet from the batch update, search for “SalesInvoiceCustomTheme” if you first want to update sale invoices, check which sale invoice you have the theme activated (it will show a code like this “f56hha2e-6203-46bf-9a33-700g50c09qa7”) on and copy paste it for others, but be careful not to change any format while updating the batch.
NOTE: This is a temporary solution to go around the bug till they fix is permanently.
3 Likes
Same here. Batch view not working. Post have been up for 9 days and still not fixed.
I too am having the same problem.
However, I have a different account setup and that seem to show batch view.
Please advise
batch views still isnt working ? it has been more than a week but still like this
Hi all,
In addition to @Aryan_Mohammed’s contribution.
I made this other temporary fix for those who weren’t using any themes or extensions also using Liquid Custom Theme.
This is the theme code:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<!-- Styling for consistent look and feel -->
<style>
*, ::after, ::before, ::backdrop, ::file-selector-button {
margin: 0;
padding: 0;
}
*, ::after, ::before, ::backdrop, ::file-selector-button {
box-sizing: border-box;
}
#docbody {
margin: 0;
padding: 30px;
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
color: #171717;
font-size: 12px;
line-height: 1.428571429;
min-width: 800px;
}
table {
font-size: 12px;
}
tr#table-headers th {
font-weight: bold;
padding: 5px 10px;
border: 1px solid #000;
text-align: start
}
tbody#table-rows td {
padding: 5px 10px;
border-left: 1px solid #000;
border-right: 1px solid #000;
text-align: start;
vertical-align: top
}
tbody#table-rows tr:last-child td {
padding-bottom: 30px;
border-bottom: 1px solid #000;
}
</style>
</head>
<body><div id="docbody">
<table style="padding: 30px; width: 100%">
<thead>
<tr>
<td colspan="99">
<table style="margin-bottom: 20px; width: 100%"><tr>
<td style="font-weight: bold; font-size: 32px; vertical-align: top">{{ title }}</td>
{% if business.logo != null %}<td style="text-align: end"><img src="{{ business.logo }}" style="max-height: 150px; max-width: 300px; display: inline" /></td>{% endif %}
</tr></table>
<table style="margin-bottom: 20px; width: 100%"><tr>
<td style="vertical-align: top">
<div style="font-weight: bold">{{ recipient.name }}</div>
<div>{{ recipient.address | newline_to_br }}</div>
<div>{{ recipient.identifier }}</div>
</td>
<td style="text-align: end; vertical-align: top">
{% for field in fields %}
<div style="font-weight: bold">{{ field.label }}</div>
<div style="margin-bottom: 10px">{{ field.text }}</div>
{% endfor %}
</td>
{% if business.address != null %}
<td style="width: 20px"></td>
<td style="width: 1px; border-left-width: 1px; border-left-color: #000; border-left-style: solid"></td>
<td style="width: 20px"></td>
<td style="width: 1px; white-space: nowrap; vertical-align: top">
<div style="font-weight: bold">{{ business.name }}</div>
<div>{{ business.address | newline_to_br }}</div>
{% for field in business.custom_fields %}
<div>{{ field.label }} {{ field.text }}</div>
{% endfor %}
</td>
{% endif %}
</tr></table>
<div style="font-size: 14px; font-weight: bold; margin-bottom: 20px">{{ description }}</div>
</td>
</tr>
<tr>
{% for column in table.columns %}
<td style="writing-mode: horizontal-tb; border-inline-start-width: 1px; border-inline-start-style: solid; border-inline-start-color: #000; {% if forloop.last == true %} border-inline-end-width: 1px; border-inline-end-style: solid; border-inline-end-color: #000{% endif %}; text-align: {{ column.align }}; font-weight: bold; padding: 5px 10px; border-bottom-width: 1px; border-bottom-color: #000; border-top-width: 1px; border-top-color: #000; border-top-style: solid; border-bottom-style: solid{% if column.nowrap %}; width: 80px{% endif %}">{{ column.label }}</td>
{% endfor %}
</tr>
</thead>
<tbody>
{% for row in table.rows %}
<tr>
{% for cell in row.cells %}
<td style="writing-mode: horizontal-tb; border-inline-start-width: 1px; border-inline-start-style: solid; border-inline-start-color: #000; {% if forloop.last == true %} border-inline-end-width: 1px; border-inline-end-style: solid; border-inline-end-color: #000{% endif %}; padding: 5px 10px; text-align: {{ table.columns[forloop.index0].align }}; {% if table.columns[forloop.index0].nowrap %}; white-space: nowrap; width: 80px{% endif %}">{{ cell.text | newline_to_br }}</td>
{% endfor %}
</tr>
{% endfor %}
<tr>
{% for column in table.columns %}
<td style="writing-mode: horizontal-tb; border-inline-start-width: 1px; border-inline-start-style: solid; border-inline-start-color: #000; {% if forloop.last == true %} border-inline-end-width: 1px; border-inline-end-style: solid; border-inline-end-color: #000{% endif %}; border-bottom-width: 1px; border-bottom-color: #000000; border-bottom-style: solid"> </td>
{% endfor %}
</tr>
{% for total in table.totals %}
<tr>
<td colspan="{{ table.columns | size | minus:1 }}" style="text-align: end; padding: 5px 10px{% if total.emphasis == true %}; font-weight: bold{% endif %}">{{ total.label }}</td>
<td style="border-left-width: 1px; border-left-style: solid; border-left-color: #000; border-right-width: 1px; border-right-style: solid; border-right-color: #000; text-align: right; white-space: nowrap; border-bottom-width: 1px; border-bottom-color: #000000; border-bottom-style: solid; padding: 5px 10px{% if total.emphasis == true %}; font-weight: bold{% endif %}">{{ total.text }}</td>
</tr>
{% endfor %}
{% for field in custom_fields %}
<tr>
<td colspan="99">
<div style="font-weight: bold; padding-top: 20px">{{ field.label }}</div>
<div>{{ field.text | newline_to_br }}</div>
</td>
</tr>
{% endfor %}
<tr>
<td colspan="99">
{% if emphasis.text != null and emphasis.positive %}
<div style="text-align: center; margin-top: 40px"><span style="color: #006400; border-width: 5px; border-color: #006400; border-style: solid; padding: 10px; font-size: 20px">{{ emphasis.text | upcase }}</span></div>
{% endif %}
{% if emphasis.text != null and emphasis.negative %}
<div style="text-align: center; margin-top: 40px"><span style="color: #FF0000; border-width: 5px; border-color: #FF0000; border-style: solid; padding: 10px; font-size: 20px">{{ emphasis.text | upcase }}</span></div>
{% endif %}
</td>
</tr>
</tbody>
</table>
</div><body>
</html>
Copy this theme code and create a new Theme with it, I named it “Temporary Plain Theme” for the sake of this example:
You then have to enable it in a single document (Sales Invoice, Receipts, etc.) and then Batch update all other documents.
This should make batch update and customer portals works for as long as Liquid code is supported – which should be more than enough for this bug to be ultimately fixed.
Portal View
Batch View
PS.
Sorry @Aryan_Mohammed if this seems but I just remembered your post after posting this and I didn’t include any QR code here, so if you are using a QR code, you should use this instead
1 Like
@Ealfardan Its totally fine, you put detailed steps with pics which is good for others that are not familiar with some details.
1 Like
Just to give update on this topic. Views in customer portal are now working and batch view works almost everywhere now with exception of customer/supplier statements.
2 Likes
Dear @lubos,
I appreciate of the new update. But mine is still not working. Batch view is now being displayed, but the invoices were truncated. It also happens when printed. Cloud version 25.7.11.2492
Update.
After several restart server attempts, I can confirm now the batch view is completely works. Cloud version 25.7.11.2492.
Thanks a lot.
Note: But I think the batch view cannot accommodate when a custom theme is used. Otherwise, it will be truncated again (see the attached image). The first invoice is using a custom theme generated by theme enhancer is truncated, whilst the second invoice is without a custom theme.
@killaruna04 your HTML theme needs to call this function whenever size changes. Typically you just include this code when all processing is finished.
window.parent.postMessage({
type: "resize",
width: document.documentElement.scrollWidth + 1,
height: document.documentElement.scrollHeight + 1
}, "*");
This is already part of default theme.