implement image error handling to display 'no-image.png' on missing image
This commit is contained in:
parent
e2e528430b
commit
2c6665ecf1
6 changed files with 27 additions and 9 deletions
|
@ -58,7 +58,9 @@
|
|||
<div class="col-sm-2">
|
||||
<div class="position-relative">
|
||||
<div class="product-image">
|
||||
<img class="img-fluid img-thumbnail" src="@product.PictureLink?height=100" alt="@product.Description"/>
|
||||
<img class="img-fluid img-thumbnail" src="@product.PictureLink?height=100"
|
||||
onerror="this.onerror=null;this.src='https://assets.innotec.dk/images/no-image.png?height=100'"
|
||||
alt="@product.Description"/>
|
||||
</div>
|
||||
@if (product.Discontinued)
|
||||
{
|
||||
|
|
|
@ -69,6 +69,9 @@
|
|||
@product.Quantity
|
||||
</div>
|
||||
<div class="col-sm-2">
|
||||
<img class="img-fluid img-thumbnail" src="@product.PictureLink?height=100"
|
||||
onerror="this.onerror=null;this.src='https://assets.innotec.dk/images/no-image.png?height=100'"
|
||||
alt="@product.Description"/>
|
||||
</div>
|
||||
<div class="col-sm-1" @onclick="@(() => ProductCheck(product.Sku))">
|
||||
<input type="checkbox" class="btn-check" id="btn-@product.Sku.Replace(",", "")" autocomplete="off"/>
|
||||
|
|
|
@ -31,6 +31,7 @@
|
|||
</th>
|
||||
</tr>
|
||||
<tr class="bg-black text-white opacity-75">
|
||||
<th scope="col"></th>
|
||||
<th scope="col">Navn</th>
|
||||
<th scope="col">Fork</th>
|
||||
<th scope="col" class="text-nowrap">Varenr</th>
|
||||
|
@ -41,6 +42,12 @@
|
|||
@foreach (var salesItem in ItemList)
|
||||
{
|
||||
<tr>
|
||||
<td>
|
||||
<img class="img-fluid img-thumbnail"
|
||||
src="@salesItem.PictureLink?height=100"
|
||||
onerror="this.onerror=null;this.src='https://assets.innotec.dk/images/no-image.png?height=100'"
|
||||
alt="@salesItem.Name"/>
|
||||
</td>
|
||||
<td class="align-middle">
|
||||
@salesItem.Name
|
||||
</td>
|
||||
|
|
|
@ -19,6 +19,7 @@
|
|||
<table class="table table-hover table-striped justify-content-center">
|
||||
<thead>
|
||||
<tr class="bg-black text-white opacity-75">
|
||||
<th scope="col"></th>
|
||||
<th scope="col">Navn</th>
|
||||
<th scope="col">Fork</th>
|
||||
<th scope="col" class="text-nowrap">Varenr</th>
|
||||
|
@ -30,6 +31,11 @@
|
|||
@foreach (var salesItem in ItemList)
|
||||
{
|
||||
<tr>
|
||||
<td>
|
||||
<img class="img-fluid img-thumbnail" src="@(salesItem.PictureLink)?height=100"
|
||||
onerror="this.onerror=null;this.src='https://assets.innotec.dk/images/no-image.png?height=100'"
|
||||
alt="@salesItem.Name"/>
|
||||
</td>
|
||||
<td class="align-middle">
|
||||
@salesItem.Name
|
||||
</td>
|
||||
|
@ -42,13 +48,13 @@
|
|||
</td>
|
||||
<td class="align-middle">
|
||||
<ul class="list-group">
|
||||
@foreach (var rate in salesItem.Rates)
|
||||
{
|
||||
<li class="list-group-item d-flex justify-content-between align-items-end">
|
||||
<div class="pe-2">@rate.Quantity</div>
|
||||
<div class="text-end pe-2">@rate.Rate</div>
|
||||
</li>
|
||||
}
|
||||
@foreach (var rate in salesItem.Rates)
|
||||
{
|
||||
<li class="list-group-item d-flex justify-content-between align-items-end">
|
||||
<div class="pe-2">@rate.Quantity</div>
|
||||
<div class="text-end pe-2">@rate.Rate</div>
|
||||
</li>
|
||||
}
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
{
|
||||
"appInfo": {
|
||||
"name": "Wonky Online",
|
||||
"version": "183.0",
|
||||
"version": "185.0",
|
||||
"rc": true,
|
||||
"sandBox": true,
|
||||
"image": "grumpy-coder.png",
|
||||
|
|
Loading…
Reference in a new issue