Help with Javascript for an invoice created

[julius1973]

Hi,

This is my first post. I am using Channel Grabber. This is multi channel e-commerce cloud based software. Within that I am designing an invoice using html. On a previous invoicing system where the quantity ordered was more than 1 it would have t QTY number in red and bold. Is there any way I can add this to my HTML.
Looking at the code the QTY has a tag of {orderitem_qty}.

Many thanks in advance.

><div style='width:19cm;position:relative;'>
<div class="style1">
<style>
@page:297mm 210mm; margin:1cm;
@media:print;
body{
font-size:12px;
}
.style1 {
	text-align: left;
}
.style2 {
	font-size: small;
}
.style3 {
	font-weight: normal;
	font-size: xx-small;
}
.style6 {
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
	font-size: x-small;
}
.style5 {
	text-align: left;
	font-size: x-small;
}
.style7 {
	font-weight: normal;
	font-size: 6pt;
}
.style8 {
	text-align: center;
}
</style>
<!-- Logo Start -->
 <!-- Logo End --><b>INVOICE</b> <br>
<img src="http://www.uksoftwaredeals.biz/ebaypics/logo/gizmo_deals.jpg" style="float:left;" width="122" height="30"/><img src="http://www.uksoftwaredeals.biz/ebaypics/logo/lupo.jpg" style="float:left;" width="132" height="28"/><br />


<!-- Your Companies Detail -->
</div>
<div style="font-size:12px;">
<p>From:</p>
	{{remove_extra_breaks}}
	{{trading_company_name}}<br />
	{{trading_address_1}}<br />
	{{trading_address_2}}<br />
	{{trading_address_city}}<br />
	{{trading_address_state}}<br />
{{trading_address_postcode}}<br />        
<br />
	{{remove_extra_breaks}}
	Phone: {{trading_address_phonenumber}}<br />
Email: sales@gizmo-deals.com<br />
{{trading_address_website}}<br />

</div>

<!-- Your Customers Details --> 

<div style="font-size:12px;">
<p>To:</p>
	{{remove_extra_breaks}}
	{{shipping_recipient_name}}<br />
	{{shipping_address_1}}<table style="float:right;font-size:12px;display:block;position:absolute;top:7.1cm; left:13.8cm; width: 221px;">
<tr><th style="width: 61px"></th><th></th></tr>
<tr><td style="width: 61px">Invoice No.</td><td>{{order_orderid}}</td></tr>
<tr><td style="width: 61px">Invoice Date</td><td>{{order_purchasedate}}</td></tr>
</table>


<br />
	{{shipping_address_2}}<br />
	{{shipping_address_city}}<br />
	{{shipping_address_state}}<br />
	{{shipping_address_postcode}}<br />
	{{shipping_address_country}}<br />
	{{remove_extra_breaks}}
</div>
<br />

<!-- Invoice Number and Purchase Date -->


<!-- Contents of the Order -->

<table width="100%" style="font-size:12px;">
	<rt>
		<td>Qty</td>
		<td>Item</td>
		<td>Our Price</td>
		<td>Vat Rate</td>
		<td>Total Price</td>
	</tr>
	{{loop}}
		<tr>
			<td style="width:40px;" >{{orderitem_qty[loop-count]}}</td>
			<td>
				{{orderitem_name[loop-count]}} <br />
				<span style="color:grey;font-size:95%;"><i>{{orderitem_variations[loop-count]}}</i><span><br />
				<span style="color:red;" class="style2"> <strong>SKU : {{orderitem_sku[loop-count]}}</strong></span>
			</td>
			<td>{{order_currency}} {{orderitem_price[loop-count]}}</td>
			<td>20%</td>
			<td>{{order_currency}} {{orderitem_linetotal[loop-count]}}</td> 
		</tr>
	{{loop}}
</table>

<table style="font-size:12px;float:right;margin-left:460px;margin-right:30px;text-align:right;">
<tr><th></th><th></th></tr>
<tr><td>Dispatched Via</td><td>{{order_shippingmethod}}</td></tr>
<tr><td></td><td></td></tr>
<tr><td>Sub Total</td><td>{{order_currency}}{{order_subtotal}}</td></tr>
<tr><td>Delivery</td><td>{{order_currency}}{{order_postage}}</td></tr>
<tr><td>VAT</td><td>{{order_currency}}{{order_vat}}</td></tr>
<tr><td>Total</td><td>{{order_currency}}{{order_total}}</td></tr>
</table>

<!-- Address Label --> 

<div style="width:8cm;height:5cm;position:absolute;top:218mm;left:18mm;font-size:12px;" class="style1">
<strong style="position:absolute;top:-211mm; font-size:1.2em; left: 325px; width: 328px; height: 208px;">
	<div class="style1">
	{{remove_extra_breaks}}
	{{shipping_recipient_name}}<br />
	{{shipping_address_1}}<br />
	{{shipping_address_2}}<br />
	{{shipping_address_city}}<br />
	{{shipping_address_state}}<br />
	{{shipping_address_postcode}}<br />
	{{shipping_address_country}}<br />
	{{remove_extra_breaks}}
<br>
<br>
		<span class="style7">GIZMO DEALS, 2 Wold Farm Park, Broughton Road, Old, 
		Northants, NN6 9RH, UK</span><span class="style3"><br>
		 </span>
<strong style="font-size:1.2em; width: 328px; height: 208px;">
		<span class="style3">
		 <div class="style8">
<strong style="font-size:1.2em; width: 328px; height: 208px;">
		<span class="style3">
		 <img src="http://www.uksoftwaredeals.biz/ebaypics/logo/tracking.jpg" width="219" height="45" style="float: left" class="style9" ></span></strong></div>
		</span>
</strong>
 </div>
</strong>
<p style="position:absolute;top:-213mm; left:129mm; height: 9px;">{{order_orderid}}</p>
</div>

<!-- Foorer -->

<div class="footer" style="position:absolute;top:270mm;width:19cm;font-size:80%;color:grey;">
{{registered_address_name}},
{{registered_address_1}}, {{registered_address_2}}, {{registered_address_city}},  {{registered_address_postcode}}, VAT:  {{registered_address_vat}}


</div> 
<DIV style="page-break-before:never"></DIV><html>
	<head><style type="text/css">
#orderitem_qty {
    font-weight:bold;
    color:#f00;
 }
.style9 {
	margin-top: 0px;
}
</style>
		<title></title>
	</head>
	<body>
		<p class="style6">
			 </p>
<p class="style6">
			 </p>
<p class="style6">
			 </p>
<p class="style6">
			 </p>
<p class="style6">
			 </p>
<p class="style6">
			 </p>
<p class="style6">
			 </p>
<p class="style6">
			 </p>
<p class="style6">
			*</p>
<p class="style6">
			*</p>
<p class="style6">
			*</p>
<p class="style6">
			*</p>
<p class="style6">
			*</p>
<p class="style6">
			*</p>
<p class="style6">
			*</p>
<p class="style6">
			*</p>
<p class="style6">
			*</p>
<p class="style6">
			*</p>
<p class="style6">
			<span class="style2">Thank you for shopping with us. <br />
			Queries: Please contact us via sales@gizmo-deals.com quoting your order details. Please refrain from leaving any negative feedback as we will resolve problems swiftly.<br />
			Please leave us good feedback if you are happy with our service and if you like the product you ordered via Amazon please provide a positive product review to assist other buyers make a qualified purchase.<br />
			Please check our seller terms on both Amazon.co.uk and eBay.co.uk</span><br />
			<br />
			</p>
		<p class="style5" style="font-family: Arial, Helvetica, sans-serif; text-align: center; ">
			PLEASE LIKE US ON FACEBOOK FOR INFO ON NEW PRODUCTS AND SPECIAL DEALS: </p>
		<p class="style6">
			<img height="22" src="http://www.uksoftwaredeals.biz/ebaypics/facebook.png" width="100" />FACEBOOK.COM/GIZMODEALS</p>
	</body>
</html>

[NotionCommotion]

Yes, you could do it client side with JavaScript. Looking at your code, however, it appears that you are using some sort of server side parsing framework, and you would want add the CSS server side.

If you wanted to toggle red/not red whenever the user enters a value, then you can set up an onkeyup event and every time check the value and add/remove a class or CSS as appropriate.

[julius1973]

thanks for the reply.

[julius1973]

I have spoken to the website and they say they can do it but want to charge quite a bit. I am sure it is some fairly simple coding so I am unwilling to pay them for this. Any ideas would be greatly appreciated.