Howto show and save image as blob type with seam screenshot select image1

Howto show and save image as blob type with seam

In a project where i am working on, we needed to show an image and the image should be change when a user would like to do that. For that we need to hava an attribute in a table called photo and it has to be a blob. See below:
Howto show and save image as blob type with seam screenshot blob datatype

We have now a photo attribute as a blob, the next thing we need to do, is to make an entity with a photo attribute. The entity is called Person and has a byte[] variable called photo. See below for an example:

@Entity
@Table(name=”PERSON”)
public class Person{
private byte[] photo = null;

@Column(name=”PHOTO”)
@Lob
public byte[] getPhoto(){
return photo;
}

public void setPhoto(byte[] photo){
this.photo = photo;
}
}

For the front-end we need to make a page with the next part(just make a simple xhtml page):
<h:panelGrid columns=”2″>
<h:panelGroup>
<s:graphicImage id=”currentImage” value=”#{person.photo}”
rendered=”#{person.photo != null}” styleClass=”vpaPhoto” />
<s:graphicImage id=”defaultImage” value=”/img/default.png”
rendered=”#{person.photo == null}” styleClass=”vpaPhoto” />
</h:panelGroup>
<s:fileUpload id=”imageUploader” data=”#{person.photo}” onchange=”submit()” styleClass=”imageUploader”  />
</h:panelGrid>

The appearance should look like this(you can choose any picture you would like for the default.png file):
Howto show and save image as blob type with seam screenshot default image
Ok and now we click on browse an select an image(i’ve downloaded one from google, m_mylle.jpg)
Howto show and save image as blob type with seam screenshot select image
So i’ve selected the m_mylle.jpg file and then i click open. The result is shown below:
Howto show and save image as blob type with seam screenshot selected image
Good luck, all suggestions and improvements are welcome.

One Response

  1. onsir February 4, 2009