X-Cart forums

[Thomasb134]

The width of the related products popup is too narrow and the truncated text makes it difficult to choose the correct item when the catalog and product names are similar. This popup is also the same one that is seen when using the AOM to add products to an order. The popup's code is /skin/common_files/main/popup_product.tpl.

For reference I have attached a screen print from the user manual that shows the popup that I am referring to.

I used webmaster mode and firebug to hunt down the CSS style that controls the width. I found that the existing width is a computed value that is 800px wide. But I can't find where/how it inherits this value.

The best I can come up with is that it involves the /skin/common_files/lib/jqueryui/jquery.ui.admin.css styles. But there's nothing there that controls the popup width. I've run out of ideas on where to find it.

In a perfect world I'd like the width to auto size to the show the entire text in the two populated columns. But if that is not possible I would like to change it to be a fixed 1000px wide and just accept the truncations that occur.

It would be awesome to know the trick to finding the file I need to edit. And any tips to make it auto size.

[Thomasb134]

I spent more time on this today and still have not figured out how to increase the width of the popup. The existing 800px width appears to be inherited, but I don't know enough about CSS to solve what I though was going to be an easy task. Long story short, I sure could use some advice on how to increase the size.

[cflsystems]

The height/weight of the popup is set in js file

/public_html/skin/common_files/js/popup_product.js

[Thomasb134]

Steve, you are a lifesaver! Although changing the width value to 1000 in the popup_product.js file did not completely do the trick, you pointed me in the right direction.

It turns out that the width is also set in file popup_open.js by a function called popupOpen(). I changed the maxWidth value there to 1000. Now I don't have to struggle with finding the right catalog or product name due to the truncated text of the previously smaller popup window size.

I also added the product's SKU number to the product's name. We have a lot of products with very similar names so seeing the SKU's in the populated list is very helpful. These two simple changes are awesome; I am a very happy guy, thanks to you.

[DrQuietus]

Hey Thomas, what code did you add to popup_product.js to get the sku to show. I have the same issue with product names.

[Thomasb134]

what code did you add to popup_product.js to get the sku to show.

In /skin/common_files/main/popup_product.tpl
Find:

<option value="{$products[prod_idx].productid}">{$products[prod_idx].product}</option>

And change to:

 <option value="{$products[prod_idx].productid}">{$products[prod_idx].productcode}{": "}{$products[prod_idx].product}</option>