Adding images to unitlist

Webix JS
#1

Hi,

I’m using unitlist component of webix to show/display the user information sorted by name. I would like to add images along with the name in this list. Could you please provide me the sample code to achieve this requirement.

Thanks.

#2

Hi,

Can you please update on this?

Regards,
Prashanth

#3

Hi,

You can add IMG tag or div with background-image into template.

webix.ui({
     view:"unitlist", 
     type:{
		height: 50,
		template:"<img class='contact_img' src='#img#'>#name#"
     },
	...
});
#4

Thanks. The images are not visible when I convert the HTML files to Java Web Project. Should I take care of any specific CSS changes??

#5

Hi,

I would like to show some text right next to picture. I’m able to achieve this view in a form view and the sample code is pasted below. Could you please help me on how this code can be used within the unitlist to show the text right next to the picture?

body:{
	view:"form",align:"center",
	elements: [
	
		{
			rows:[ 
				//{ 
				{cols:[
				{view:"template", autoheight :true, template:"<img src='defaultavatar.png' height='100px' width='100px'/>",align:'center', maxWidth:115, borderless:true},
					{ view:"template", template:'<B>Name</B><BR/>Designation', autoheight :true, borderless:true}
				]}
				
				]
				}
	]

}
#6

Check the next example
http://webix.com/snippet/9b387d8c

#7

Thanks Viktor. This works as intended.