# ComboItem image [closed]

rdgrimes
735 7

Ok, so this shouldn't be that hard to follow the Demo of the combobox where an image is included in each comboitem. But, I'm having no success with this.

<?init class="org.zkoss.zkplus.databind.AnnotateDataBinderInit" ?>
<?variable-resolver class="org.zkoss.zkplus.spring.DelegatingVariableResolver"?>
<?page id="cardsummary" title="Card Summary" contentType="text/html;charset=UTF-8"?>
<zk xmlns:c="client">
<style dynamic="true">
.z-label
{
font-size:			12px;
font-weight:			bold;
}

.z-combobox-pp .z-comboitem .z-comboitem-text
{
font-size:			11px;
font-style:			italic;
font-weight:			bold;
height:			48px;
}

.evenItem
{
background-color:		#E6EDEC;
font-size:			11px;
font-style:			italic;
font-weight:			bold;
height:			48px;
}
</style>
<window title="${labels.card.summary.title}" border="normal" apply="com.soc.ds.view.CardSummaryComposer"> <image id="image1" src="/assets/images/month_jan.png"></image> <vbox> <hbox spacing="5"> <label value="${labels.app.location}" ></label>
<combobox id="authorized_locations_cb" ></combobox>
<label value="${labels.app.month}" ></label> <combobox readonly="true"> <comboitem label="${labels.app.month1}" image="/assets/images/month_jan.png" ></comboitem>
<comboitem label="${labels.app.month2}" image="/assets/images/month_feb.png" sclass="evenItem"></comboitem> <comboitem label="${labels.app.month3}" image="/assets/images/month_mar.png"></comboitem>
<comboitem label="${labels.app.month4}" image="/assets/images/month_apr.png" sclass="eventem"></comboitem> <comboitem label="${labels.app.month5}" image="/assets/images/month_may.png"></comboitem>
<comboitem label="${labels.app.month6}" image="/assets/images/month_jun.png" sclass="evenItem"></comboitem> <comboitem label="${labels.app.month7}" image="/assets/images/month_jul.png"></comboitem>
<comboitem label="${labels.app.month8}" image="/assets/images/month_aug.png" sclass="evenItem"></comboitem> <comboitem label="${labels.app.month9}" image="/assets/images/month_sep.png"></comboitem>
<comboitem label="${labels.app.month10}" image="/assets/images/month_oct.png" sclass="evenItem"></comboitem> <comboitem label="${labels.app.month11}" image="/assets/images/month_nov.png"></comboitem>
<comboitem label="\${labels.app.month12}" image="/assets/images/month_dec.png" sclass="evenItem"></comboitem>
</combobox>
</hbox>
<button id="clickBtn" label="click" ></button>
</vbox>
</window>
</zk>


I can't get the image to appear in either the image tag shown, or in any of the comboitems. I have placed the images in WebContent/assets/images/ . The odd thing is the image (for the image tag) shows up in ZUL Visual Editor, but when I deploy to Tomcat and call the app from the browser command line, everything loads and works fine EXCEPT for the images.

I have defined the png mime in the web.xml, but nothing. If I try to pull up the image directly by typing http://localhost:8080/soc-ds-zk/assets/images/month_jan.png, I get a not found (404).

I'm a new customer of ZK, just playing around with this stuff, but something as simple as image loading seems to be extraordinarily complicated to get working. It would be nice if ZKoss published a full blown project with ALL the config files (ZK.xml, lang-addon.xml, etc.), with the image files as well, that show features people commonly ask about. Unfortunately, the litle samples projects included are too short and simple to be of much use.

Thanks for any help.

Ron

delete retag edit

## 5 Replies

RichardL
768 4

Hi rdgrimes,
Welcome to the ZK community! Removing the front slash should do it.

rdgrimes
735 7

Thanks, Richard. But, I've tried it that way too. I've also tried putting the images at the same level as card_summary.zul and just referring to them as month_jan.png, month_feb.png, etc. Nothing works. I've been doing web apps for 12 years on a variety of technologies, and so I'm very familiar with relative paths. Never had a problem before ZK.

Ron

matthewgo
375

Hi rdgrimes,
Can you show us more detail (composer or *.xml)?
I tried your demo code without composer and image works well .

rdgrimes
735 7

I have a bit more information. I tried deploying this (from MyEclipse IDE) to the internal MyEclipse Tomcat server, and it works fine. Now, when I deploy the same project to the stand alone Tomcat (6.0.23) instance, everything works fine except the images don't pull in. Not sure what could be the difference, since both containers have the same zk.xml, web.xml config files. But, obviously, therein lies the difference. If you have any ideas on what might be tripping it up, please let me know.

Thanks,

Ron

rdgrimes
735 7

One more thing. The really odd thing is I deployed this "play" project to my production server and it also worked fine there. So, it only does not work from the stand-alone on my desktop, which is really strange because I've been using it for years to run tests of web apps, and it's never been problematic. Does anyone know what would cause a local stand-alone instance of Tomcat to fail to render images?

Ron