How to icons for availability

This topic was automatically closed 365 days after the last reply. New replies are no longer allowed.
7 years ago
Hi all,

I want to share something. I needed to add an icon for the stock status. But the data didn't come up as needed.
I developed a solution to this. We can now assign a class for "in stock" and "out of stock" situations.

Go -> Themes/OurTheme/Views/Product/_Availability.cshtml
and see this :

<div class="stock">
<strong>@T("Products.Availability"):</strong>
<span class="value" id="stock-availability-value[email protected]">@Model.StockAvailability</span>
</div>

Everything is ok but where is the if structure ? Keep kalm.. we know it come from model..
Mmm. But how we edit ?

Now we create 3 variable type of string. Like this :

@{
string StockAvailability = Model.StockAvailability;
string StockAvailabilityNoStock = T("products.availability.outofstock").Text;
string StockAvailabilityInStock = T("products.availability.instock").Text;
}

And checking for true type of availability. Like this :

if (StockAvailabilityNoStock == StockAvailability)
{ <span class="value no-stock" id="stock-availability-value[email protected]">@Model.StockAvailability</span> }
if (StockAvailabilityInStock == StockAvailability)
{ <span class="value in-stock" id="stock-availability-value[email protected]">@Model.StockAvailability</span> }

Now we can add specific class names for both of them. I added icons on class. Eg on product page:



All :

<div class="stock">
<strong>@T("Products.Availability"):</strong>
@{
string StockAvailability = Model.StockAvailability;
string StockAvailabilityNoStock = T("products.availability.outofstock").Text;
string StockAvailabilityInStock = T("products.availability.instock").Text;
if (StockAvailabilityNoStock == StockAvailability)
{ <span class="value no-stock" id="stock-availability-value[email protected]">@Model.StockAvailability</span> }
if (StockAvailabilityInStock == StockAvailability)
{ <span class="value in-stock" id="stock-availability-value[email protected]">@Model.StockAvailability</span> }
}
</div>

Have a nice day, cu !
7 years ago
Nice idea
7 years ago
manjunatha.govindappa wrote:
Nice idea


Always better can be done. :)
This topic was automatically closed 365 days after the last reply. New replies are no longer allowed.