2012-06-14 56 views
0

我們正在編寫一個AJAX沉重的Wicket應用程序,並通過renderHead()提供CSS的面板。但是,當通過AJAX替換面板時 - 比如說,通過AjaxTabbedPanel,舊面板的頭文件保留並污染應用程序的其餘部分。除了響應膨脹之外,當CSS聲明過於通用時會導致問題,從而導致在應用程序的其他區域出現問題。Wicket - 刪除過時的頭文件/ AJAX面板替換

有沒有辦法解決這個問題?例如,當面板已被替換/不再可見時,重新創建IHeaderReponse的機制?

對於它的價值,我們的頭貢獻者的一個例子是:

@Override 
public void renderHead(IHeaderResponse response) { 
    response.renderCSSReference(new SharedResourceReference(SearchMainPanel.class, "Search.css")); 
} 

我們正在使用的Wicket 1.5.3。

我曾與這在小組<body>標記呈現一個<link rel="stylesheet" ... />(即不使用頭貢獻者)的自定義標籤的成功,但是IE8拒絕承認這個CSS的存在 - 因此不得不重新思考我們的戰略。

+0

不知道這是否會攜手,也許你可以將這些貢獻移動到「行爲」並覆蓋['isTemporary'](ht tp://wicket.apache.org/apidocs/1.5/org/apache/wicket/behavior/Behavior.html#isTemporary%28org.apache.wicket.Component%29)在其上返回true。 –

回答

2

每個AjaxRequestTarget將收到專門用於該請求的新IHeaderResponse。您看到的問題是由於之前的請求使用樣式表作出迴應,您不再希望爲該頁面呈現樣式表。讓瀏覽器忽略已經在頁面上呈現的樣式表的唯一方法是重新呈現沒有該文件的頁面。

在這種情況下,您可以依賴級聯樣式來首次渲染每個選項卡,因爲Wicket會在渲染該面板時加載關聯的樣式表。但是,當您返回到先前已呈現的選項卡(Panel)時,Wicket將不會重新呈現已加載的樣式表。這意味着您需要有一種方法來克服級聯樣式的侷限性。

做到這一點,最好的辦法是命名您的樣式 ......這意味着你應該換每個面板與命名空間中的類標籤(如上下文更準確「TAB1」什麼的),那麼你將所有的基礎您的樣式關閉該等級:

.tab1 .heading { 
    font-weight: bold; 
} 

.tab1 .description { 
    background: blue; 
} 

.tab2 .heading { 
    font-size: 1.3em; 
} 

.tab2 .description { 
    background: lightblue; 
} 

這將確保你能夠每個標籤的個人風格之間和區分任何級聯您可能需要將仍然爲命名空間選擇

+1

謝謝;命名空間無疑是一種方法。雖然我可以理解,通過Javascript可以刪除外部引用的CSS文件(儘管我沒有測試過),所以希望Wicket的AJAX中內置一個方便的'清理'樣式功能,以類似的方式工作。事實上,這似乎是全面的默認行爲。 – nullPainter

+0

在某些情況下這可能會有所幫助,但在這種情況下,它會導致性能問題(多次加載相同的文件)。此外,當您進行更改時,您會得到一個無風格內容(FOUK)的閃光,因爲無論您加載新樣式的順序如何,替換DOM以及刪除舊樣式,渲染內容都會出現重疊。 –

+0

另外,我知道沒有辦法從Wicket中刪除JS/CSS文件的DOM –