Disable "Quantity" field next to "Add to cart" button when Quantity options active

[chcsep]

I have some products (not all) with the "Qty" type option which is required, so that people can order multiple items of a similar type and still get bulk pricing.

However, in addition to the "Quantity" textbox next to each option, the "Quantity" textbox appears next to the "Add to cart" button also.

In order to purchase this item, my customers must enter the number of items they want of the various options next to each option, then click "Add to cart". The "Quantity" textbox next to the "Add to cart" button effectively does nothing, so they can add whatever they want there without messing up the order, but it's superfluous and confusing.

I still need that box to appear on other items where quantity options are not in effect.

I suppose the only way to do this is to duplicate my listing template and remove that box in the copy, then set the Listing Template to the copy in the product's Advanced options. Anyone know of a better way than this?

[cbsteven]

I just did something similar to this where I hide the "make an offer" link if an item is out of stock. I used a javascript snippet to detect if the item was in stock and if so to set the HTML element of the link to be display:hidden. I assume you could do something similar here if you are confident in your HTML skills and not afraid to play with javascript. It looks something like this for me:

<script type="text/javascript">
if ("[availability]" != "[productAvailability-Instock]")
	{
		document.getElementById('offerLink').style.display = 'none';
	}
</script>

[chcsep]

Cool, thanks! I'll check that out.

[user001]

the script is looking for an ID this means that your button must have an ID if it doesnt have one add one ( id="buy-disable" ) if it does have one then just change the script to call the ID of your button.

[chcsep]

I ended up just creating an additional layout, copying the first one. It's not as elegant as a script (because now I'll have to make further template changes to both), but it works. For others' reference, this involved a couple of things:

- Note that the HTML files to be edited are called item_listing_0.html, item_listing_1.html, item_listing_2.html, etc., whereas the layout selection options in the "advanced" tab of the item editor starts the numbering at 1 (so "layout 1" uses the filename "item_listing_0.html")

- In the HTML for the item listing template, I removed the text for the [product_quantity] label (including brackets) to remove the text.
- Next to it, for the quantity textbox cannot simply be removed, so I gave it a CSS class "txtBoxStyleHide"
- I then copied the existing "txtBoxStyle" CSS class, renamed the copy "txtBoxStyleHide", and altered it to blend into the background. I assume these CSS classes may be different depending on your template, and the values would very likely be different. Luckily, my background is white so I've copied the original CSS class and the new one below.
- I also adjusted the table in which the quantity button was located to add a cell on the right of the one containing the "add to cart" button the same width as the cell containing the hidden QTY textbox. This way the "add to cart" button is centred.
- After applying the new code, I selected the new layout in the product's "Advanced" tab, for all products with the quantity option.

/*txtBoxStyle:: Controls the text and style of the Text Boxes.*/  	
.txtBoxStyle {

border-top: 1px solid #b4b4ac;
border-bottom: 1px solid #b4b4ac;
border-left: 1px solid #b4b4ac;
border-right: 1px solid #b4b4ac;
background-color: #fdfdfd;
font-weight: normal;
font-size: 11px;
color: #81827f;
line-height: 27px;
height: 27px;
padding: 0px 0px 0px 8px;

}
/*txtBoxStyleHide:: Hides the Quantity box.*/  	
.txtBoxStyleHide {

border-top: 0px;
border-bottom: 0px;
border-left: 0px;
border-right: 0px;
background-color: #ffffff;
font-weight: normal;
font-size: 11px;
color: #ffffff;
line-height: 27px;
height: 27px;
padding: 0px 0px 0px 8px;

}

The QTY textbox is still there, but customers are highly unlikely to see it. Even if they do change the number in there, it doesn't affect the selection (since the option is required in my case)