我正在製作頁面,您可以在其中上傳圖片並預覽它們。上傳和預覽都能正常工作。但問題是,如果我上傳圖像,然後預覽它,然後回到上傳圖像頁面,圖像就消失了。這裏是我的代碼如何維護頁面重定向之間的狀態JSf 2.0
<h:panelGrid columns="4"
border=""
width="20%"
style="position: absolute; top: 50px;"
columnClasses="asteriskColumns, nameColumns" >
<h:outputText value="*" />
<h:outputText value="Map: " />
<p:fileUpload id="cityMap"
description="Image"
update="mapImage messages"
allowTypes="*.jpg;*.png;*.gif;*.jpeg;"
auto="true"
fileUploadListener="#{cityDetail.imageUpload}" >
</p:fileUpload>
<p:graphicImage id="mapImage"
value="#{cityDetail.imagePath}"
width="80"
height="50"
cache="false" />
<h:outputText value="*" />
<h:outputText value="Image1: " />
<p:fileUpload id="cityImage1"
description="Image"
update="city_Image1 messages"
allowTypes="*.jpg;*.png;*.gif;*.jpeg;"
auto="true"
fileUploadListener="#{cityDetail.imageUpload}" >
</p:fileUpload>
<p:graphicImage id="city_Image1"
value="#{cityDetail.imagePath}"
width="80"
height="50"
cache="false" />
<h:outputText value="*" />
<h:outputText value="Image2: " />
<p:fileUpload id="cityImage2"
description="Image"
update="city_Image2 messages"
allowTypes="*.jpg;*.png;*.gif;*.jpeg;"
auto="true"
fileUploadListener="#{cityDetail.imageUpload}" >
</p:fileUpload>
<p:graphicImage id="city_Image2"
value="#{cityDetail.imagePath}"
width="80"
height="50"
cache="false" />
這裏是我的豆
@ManagedBean
@ViewScoped
@SessionScoped
public class CityDetail {
private StreamedContent image;
private ArrayList images;
private ArrayList imageNames;
private String imagePath = "/resources/images/Untitled.jpg";
private String imagePath1 = "/resources/images" + "/";
public CityDetail() {
images = new ArrayList();
images.add(null);
images.add(null);
images.add(null);
images.add(null);
images.add(null);
imageNames = new ArrayList();
imageNames.add("");
imageNames.add("");
imageNames.add("");
imageNames.add("");
imageNames.add("");
// Getting session ID from seession variable that is set in the City_Review Page
cityID = Integer.parseInt(ConnectionUtil.session.getAttribute("CityID").toString());
System.out.println();
}
public void imageUpload(FileUploadEvent event) {
imagePath = "";
// Variable to ensure that the query is always enter to same index.
int index = -1;
String query = "";
FacesContext facesContext = FacesContext.getCurrentInstance();
ExternalContext externalContext = facesContext.getExternalContext();
HttpServletResponse response = (HttpServletResponse) externalContext.getResponse();
// File
UploadedFile uploadedFile = event.getFile();
// File Name
String fileName = uploadedFile.getFileName();
//File Extension
String fileExtension = fileName.substring(fileName.lastIndexOf('.'), fileName.length());
String path = externalContext.getRealPath("/resources/images") + "/" ;
try {
//<p:fileUpload id="cityMap" .../>
String componentID = event.getComponent().getClientId();
if (componentID.equalsIgnoreCase("cityMap")) {
index = 0;
/**
* UPDATE table_name SET column1=value, column2=value2,... WHERE some_column=some_value
*/
query = "UPDATE city set citymap=(?) where cityid=" + cityID;
boolean reslut = ConnectionUtil.deleteImageIfExist(path, "cityMap_" + cityID);
boolean outcome = ConnectionUtil.createFile("cityMap_" + cityID, fileExtension ,path, uploadedFile);
if (outcome) {
addImageNameToList(index, "cityMap_" + cityID + fileExtension);
setImage(imagePath1, "cityMap_" + cityID + fileExtension);
//imagePath = imagePath + "cityMap" + fileExtension;
}
} else if (componentID.equalsIgnoreCase("cityImage1")) {
index = 1;
query = "UPDATE city set cityimage1=(?) where cityid=" + cityID;
boolean reslut = ConnectionUtil.deleteImageIfExist(path, "cityImage1_" + cityID);
boolean outcome = ConnectionUtil.createFile("cityImage1_" + cityID, fileExtension ,path, uploadedFile);
if (outcome) {
addImageNameToList(index, "cityImage1_" + cityID + fileExtension);
setImage(imagePath1, "cityImage1_" + cityID + fileExtension);
}
} else if (componentID.equalsIgnoreCase("cityImage2")) {
index = 2;
query = "UPDATE city set cityimage2=(?) where cityid=" + cityID;
boolean reslut = ConnectionUtil.deleteImageIfExist(path, "cityImage2_" + cityID);
boolean outcome = ConnectionUtil.createFile("cityImage2_", fileExtension ,path, uploadedFile);
if (outcome) {
addImageNameToList(index, "cityImage2_" + cityID + fileExtension);
setImage(imagePath1, "cityImage2_" + cityID + fileExtension);
}
} else if (componentID.equalsIgnoreCase("cityImage3")) {
index = 3;
query = "UPDATE city set cityimage3=(?) where cityid=" + cityID;
boolean reslut = ConnectionUtil.deleteImageIfExist(path, "cityImage3_" + cityID);
boolean outcome = ConnectionUtil.createFile("cityImage3_" + cityID, fileExtension ,path, uploadedFile);
if (outcome) {
addImageNameToList(index, "cityImage3_" + cityID + fileExtension);
setImage(imagePath1, "cityImage3_" + cityID + fileExtension);
}
} catch (Exception e) {
FacesMessage msg = new FacesMessage("Exception happen");
FacesContext.getCurrentInstance().addMessage(null, msg);
e.printStackTrace();
// return null;
}
} //end of imageUpload()
private void setImage(String path, String fileName) {
imagePath = path + fileName;
}
現在,當我預覽,然後走了圖像之後再回到這個網頁。我怎樣才能防止這一點?我是否創建5個圖像路徑變量,然後將它保存在其他地方?但是如果我有50張圖片呢。有沒有更好的選擇?當我再次回來上傳頁面時,所有內容都保持原樣嗎?
嗨,我已經做到了。是的,我爲所有圖像使用了相同的路徑,並使用系統事件完成了它。我不知道如何在我的評論中放置代碼。另外限制是非常有限的,否則我告訴你我的代碼。每件事情都很好。其實我使用視圖範圍,因爲我希望我的構造函數不會被稱爲當我按文件上傳按鈕。因爲我在我的頁面上有5個文件上傳按鈕,我注意到每次我點擊文件上傳按鈕的構造函數調用。我使用會話範圍,因爲我將圖像名稱保存在列表中,然後將該列表保存在會話變量中。 – Basit
如果我只使用視圖範圍,那麼我如何將圖像名稱保存到會話中。如果我只使用視圖範圍,然後我的構造函數多次調用。這就是爲什麼我使用了兩個範圍。如果這是不好的做法,請讓我知道,因爲我想知道最佳做法。哦,對不起,其實我沒有顯示getter屬性,因爲它只是返回圖像路徑。這是我的財產:)公共字符串getImagePath(){ return imagePath; }謝謝:) – Basit
一個託管bean不能有兩個作用域,並且sessionscope會比viewcope持續時間更長,所以這可能就是您要做的。如果要在瀏覽時保持頁面狀態,則必須將其放置在會話範圍內,或者將Viewscope與FlashScope一起使用(http://www.jroller.com/HazemBlog/entry/understanding_the_jsf_2_0)。 Flash範圍可以與其他範圍一起使用,因爲它的工作方式不同。 –