Wicket datatable更改字體或更改後的單元格的css

在我的應用程序中，我有一個defaultDataTable，帶有可點擊的列和用於過濾表的搜索字段。過濾器在將字符插入輸入字段後過濾數據表的內容。我的目標是在適用於用戶輸入的字段中強調（或其他css）文本部分。Wicket datatable更改字體或更改後的單元格的css

示例：如果用戶輸入'ab'，字符串'abc'的字符'a'和'b'應加下劃線。使用Javascript，我可以添加一些樣式，但是我的函數用數據表做了一些奇怪的事情。它會刪除表格標籤中的所有內容，並將新的HTML放在那裏。所有其他信息都沒有了。我究竟做錯了什麼？

<script> 
    $('.searchField').keyup(function(){ 
     var page = $('.datatable'); 
     alert(page.text()); 
     var pageText = page.text().replace("<span>","").replace("</span>"); 
     alert(pageText); 
     var searchedText = $('#searchField').val(); 
     var theRegEx = new RegExp("("+searchedText+")", "igm");  

     var newHtml = pageText.replace(theRegEx ,"<b>$1</b>"); 
     alert(newHtml); 
     page.html(newHtml); 
    }); 
</script>

新表：

<table id="ID" class="datatable" wicket:id="ID"> 
Col1 Col2 123 
<b>MATCHEDCHAR</b> 
TEXT 
<b>MATCHEDCHAR</b> 
TEXT 
</table>

舊錶（摺疊機身連接頭）：

<table id="ID" class="datatable" wicketsource="URL.java" wicket:id="ID"> 
<thead wicketsource="org.apache.wicket.extensions.markup.html.repeater.data.table:DataTable.java:181" wicket:id="topToolbars"> 
<tbody wicketsource="org.apache.wicket.extensions.markup.html.repeater.data.table:DataTable.java:207" wicket:id="body"> 
<tr class="even" wicketsource="org.apache.wicket.extensions.markup.html.repeater.data.table:DefaultDataTable.java:71" wicket:id="rows"> 
</tbody> 
</table>

來源

2013-04-18 Attiej

我覺得你有searchField其執行表刷新的處理程序。所以你只需要在complete ajax event上標註。

Wicket.Event.subscribe('/ajax/call/complete', function(jqEvent, attributes, jqXHR, errorThrown, textStatus) { 
    // call code that highlight the text 
});

您可以將此訂閱方法放在頁面中（在script標記中）。如果要鏈接JS調用到一個特定的行爲說OnChangeAjaxBehavior，那麼你需要調用target.appendJavaScript：

new OnChangeAjaxBehavior(){ 
     @Override 
     protected void onUpdate(AjaxRequestTarget target) { 
      target.appendJavaScript("<call highlight function here>"); 
     } 
    };

嘗試this的jQuery插件的亮點。更多關於ajax全球通話聽衆here。

我已經做了一個簡單的demo，所以你可以檢查它。

來源

2013-04-18 18:09:34

謝謝你的回答。我不明白如何訂閱ajax事件。我的searchfield附帶了一個onChangeAjaxBehavior＆onUpdate，但wicket.event.subscribe永遠不會被調用。你如何連接它們？ – Attiej

我已更新答案，請檢查它。請接受答案，如果它解決您的問題，請。 –

注意：Wicket.Event.subscribe ...是一個js代碼 –

Wicket datatable更改字體或更改後的單元格的css

回答

相關問題