Hello,
we have a button on our workspace form of a custom table 'Complaint", and when clicked on it, it shows all the relevant invoices associated with the company of the Complaint. When clicked on each invoice, there will be a pdf shown with some content
We have a similar button on native UI as well and this correctly shows the data, however the one which is on CSM workspace, shows blank page and its not showing any data. Also, this shows correct data in firefox browser wvwn in CSM workspace but not in Edge and Chrome. Could you please help us with this issue?
This is the workspace client script written on complaint table
function onClick(g_form) {
var url = "/old_sp?id=test_invoice_manager&assessor_mode=true&sys_id=" + '2936b8de3b4a1610333b3f3a85e45a44'; //g_form.getUniqueValue(); //gave some valid sys_id for testing //test_invoice_manager is the page
g_modal.showFrame({
url: url,
title: g_form.getValue('number') + " - " + getMessage('Invoice Manager'),
size: 'fw',
height: '50em'
});
}
HTML widget configuration :
<div class="panel b">
<div class="panel-heading">
<div class="h3 font-bold">
<!-- ${Invoice list} -->
<span>${Invoice List}</span> <span class="glyphicon glyphicon-triangle-top cursor pull-right" data-toggle="collapse" data-target="#invoice-list-container"></span>
</div>
</div>
<div id="invoice-list-container" class="collapse in">
<div class="scroll-x">
<div class="table-toolbar">
<div class="table-toolbar__data">
{{filteredInvoices.length}} ${invoices} | <strong>{{selectedInvoiceIds.length}} ${selected}</strong>
<a class="a" ng-if="selectedInvoiceIds.length" ng-click="addInvoiceToComplaint()"> ${Add to Complaint} </a>
</div>
<div class="table-toolbar__action">
<div class="input-field">
<div class="input-field__input">
<input class="form-control search-query" type="text" ng-model="query" ng-change="search()" placeholder="${Search keywords}" />
</div>
<button class="input-field__action-button" type="submit"><i class="ui-search"></i></button>
</div>
</div>
</div>
<table class="width-100 table" >
<tbody>
<th class="table__col-shrinked"></th>
<th><a ng-click="sortBy('invoice_id')" href="javascript:void(0)">${Invoice ID} <i class="fa fa-sort"></i></a></th>
<th><a ng-click="sortBy('invoice_date')" href="javascript:void(0)">${Invoice Date} <i class="fa fa-sort"></i></a></th>
<th><a ng-click="sortBy('invoice_amount')" href="javascript:void(0)">${Amount} <i class="fa fa-sort"></i></a></th>
<th><a ng-click="sortBy('customer_number')" href="javascript:void(0)">${Customer ID} <i class="fa fa-sort"></i></a></th>
<th><a ng-click="sortBy('account_number')" href="javascript:void(0)">${Account Number} <i class="fa fa-sort"></i></a> </th>
<th><a ng-click="sortBy('bill_stream_id')" href="javascript:void(0)">${Bill Stream} <i class="fa fa-sort"></i></a></th>
<th><a ng-click="sortBy('payer_name')" href="javascript:void(0)">${Payer Name} <i class="fa fa-sort"></i></a></th>
<th> </th>
</tbody>
<!-- Pagination Start -->
<tfoot>
<tr><td colspan="10">
<div class="row">
<div class="col-md-9 text-center">
<ul class="pagination">
<li ng-class="{disabled: currentPage == 0}">
<a href="javascript:void(0);" ng-click="prevPage()">« ${Previous}</a>
</li>
<li ng-repeat="n in range(pagedInvoices.length)" ng-class="{active: n == currentPage}" ng-click="setPage()">
<a href="javascript:void(0);" ng-bind="n + 1">1</a>
</li>
<li ng-class="{disabled: currentPage == pagedInvoices.length - 1}">
<a href="javascript:void(0)" ng-click="nextPage()"> ${Next} »</a>
</li>
</ul>
</div>
<div class="col-md-2 text-center m-t-lg">
<select class="form-control input-sm pull-right" ng-model="invoicesPerPage" ng-change="perPage()" ng-options="('${Show} '+size+' ${invoices per page}') for size in pageSizes"></select>
</div>
</div>
</td>
</tr>
</tfoot>
<!-- Pagination End -->
<tbody ng-repeat="invoice in pagedInvoices[currentPage] | orderBy:sortingOrder:reverse">
{{invoice.invoice_id}}
<tr class="table__row-collapsed" ng-class="{'table__row-expanded': rowExpand == invoice.invoice_id}" >
<td><input class="input" type="checkbox" ng-disabled="invoice.linked" ng-model="invoice.checked" ng-click="addInvoiceToSelectedList(invoice.invoice_id)"/></td>
<td title="{{invoice.invoice_id}}">{{invoice.invoice_id}}</td>
<td title="{{invoice.invoice_date}}">{{invoice.invoice_date}}</td>
<td title="{{invoice.invoice_amount}}">{{invoice.invoice_amount}}</td>
<td title="{{invoice.customer_number}}">{{invoice.customer_number}}</td>
<td title="{{invoice.account_number}}">{{invoice.account_number}}</td>
<td title="{{invoice.bill_stream_id}}">{{invoice.bill_stream_id}}</td>
<td title="{{invoice.payer_name}}">{{invoice.payer_name}}</td>
<td class="text-align-right" ng-disabled="disableClick" ng-click="expandRow(invoice)">
<div class="action-menu" >
<a class="action-menu__trigger" ></a>
</div>
</td>
</tr>
<tr class=" " id="{{invoice.invoice_id}}" ng-show="rowExpand == invoice.invoice_id">
<td colspan="9">
<div ng-if="isLoader" class="loaderPosition">
<div id="cover-spin"></div>
</div>
<div class="panel-body" ng-if="c.data.base64" on-error-src="http://google.com/favicon.ico">
<object id="docFrame" data="{{c.data.base64}}" type="application/pdf" width="100%" height="100%" class="internal">
<embed src="{{c.data.base64}}" type="application/pdf" />
<param name="view" value="FitH" />
</object>
</div>
<div ng-if="!c.data.base64 && !loadingData" class="alert alert-info text-center">
${Sorry, Can't get invoice file}.
</div>
</td>
</tr>
<div ng-if="fullInvoiceList.length == 0 && !loadingData" class="alert alert-info text-center">
${Sorry, Unable to load invoice list}.
</div>
</tbody>
</table>
</div>
</div>
</div>
<!--Loading Spinner -->
<div ng-if="loadingData">
<div class="loaderPosition">
<div id="cover-spin"></div>
</div>
</div>
The yellow highlighted area is supposed to show content of document
