在jquery數據表中,我必須用精確匹配過濾結果並突出顯示它。完全匹配我正在嘗試下面的代碼,但它不起作用。 fiddle搜索完全匹配,並突出顯示jquery數據表正則表達式
table.aoPreSearchCols[ iCol ].sSearch = "^\\s*"+'1'+"\\s*$";
table.aoPreSearchCols[ iCol ].bRegex = false;
table.aoPreSearchCols[ iCol ].bSmart= false;
在jquery數據表中,我必須用精確匹配過濾結果並突出顯示它。完全匹配我正在嘗試下面的代碼,但它不起作用。 fiddle搜索完全匹配,並突出顯示jquery數據表正則表達式
table.aoPreSearchCols[ iCol ].sSearch = "^\\s*"+'1'+"\\s*$";
table.aoPreSearchCols[ iCol ].bRegex = false;
table.aoPreSearchCols[ iCol ].bSmart= false;
我認爲你需要使用一個word boundary,\b
:
匹配單詞邊界。單詞邊界與單詞字符未被跟隨或前面有另一個單詞字符的位置匹配。
所以,當你有搜索術語「限制」和字符串「我的話有沒有限制」,「是無限」只有第一個字符串匹配。所以
$('#search-inp').keyup(function(){
var term = $(this).val(),
regex = '\\b' + term + '\\b';
table.columns(1).search(regex, true, false).draw();
})
亮點
定義一些靜態的「高亮標記」注入,爲了去除突出的搜索匹配:
var hlBegin = '<strong class="highlight">',
hlEnd = '</strong>';
添加亮點標籤欄內容:
function highlight(term) {
var row, str,
rowCount = table.rows().nodes().length,
regexp = new RegExp('('+term+')', 'ig');
for (row=0; row<rowCount; row++) {
str = table.cell(row, 1).data();
str = str.replace(regexp, function($1, match) {
return hlBegin + match + hlEnd;
})
table.cell(row, 1).data(str).draw();
}
}
刪除高亮標記:
function removeHighlight() {
var row, str,
rowCount = table.rows().nodes().length;
for (row=0; row<rowCount; row++) {
str = table.cell(row, 1).data();
str = str.replace(/(<([^>]+)>)/ig, '');
table.cell(row, 1).data(str).draw();
}
}
設置它一起:
$('#search-inp').keyup(function(){
var term = $(this).val(),
regex = '\\b' + term + '\\b';
removeHighlight();
table.columns(1).search(regex, true, false);
highlight(term);
})
分叉的小提琴 - >http://jsfiddle.net/Lnvbnp6c/
更新。我得到了印象(通過評論),任何地方的單詞都應該匹配。如果它是關於在列的開始全字匹配:
regex = '^' + term + '\\b';
http://jsfiddle.net/Lnvbnp6c/1/
如果只是匹配字符列開始,而不是nessecarily整個單詞:
regex = '^' + term;
http://jsfiddle.net/Lnvbnp6c/2/
當用戶在搜索字段中輸入內容時,最後一個用戶可能會最喜歡。
作爲一種替代方法,你可以嘗試使用自定義過濾器:
$('#search-inp').keyup(function() {
var str,
term = $(this).val(),
regexp = new RegExp('\\b' + term + '\\b', 'ig');
removeHighlight();
$.fn.dataTable.ext.search.push(
function(settings, data, dataIndex) {
str = data[1];
return regexp.test(str) ? true : false;
}
);
table.draw();
highlight(term);
$.fn.dataTable.ext.search.pop();
})
演示與亮點如上 - >http://jsfiddle.net/x96hzok4/
我的印象是,這是一點點更快。當然,如果你有很多行,並且想在多列上搜索,我認爲你應該考慮一個自定義過濾器,並且考慮不要在所有字符串上製作耗時的完整正則表達式。
非常感謝你的回答。還有一個想法。我檢查了你附帶的小提琴。我需要修改字邊界。正則表達式應該匹配世界首發。 – Carlos
就像我輸入「Tige」一樣。然後它應該首先選擇,我已經從正則表達式中刪除了最後一個'\\ b',但是當我輸入「T」時,那麼單詞之間的單詞也會突出顯示 – Carlos
哎@amit,實際上是我開始了與 - 但當我看到評論時: - 我有兩段「我的話沒有限制」「它是無限的」。如果我輸入限制,那麼第一段應顯示並更改focus_。查看更新是否有完全匹配的開始單詞,或只匹配起始字符......似乎是您真正想要的起始字符。 – davidkonrad
嘗試
$('#search-inp').keyup(function(){
var elem = $(this)
table.columns(1)
.search("^\\s*"+elem.val()+"\\s*$", true)
.draw()
});
的jsfiddle http://jsfiddle.net/yg32o2yh/6/
謝謝你的努力。您的代碼正在從段落的開頭和結尾進行搜索。我們可以使用\ b,當我們在搜索文本框中留空時,它有問題 – Carlos
@amit在原始帖子中使用了'RegExp'。不正確的解釋 - 「我們在搜索文本框中留空時存在問題」_正確?可以描述細節? – guest271314
如果你搜索一些東西,如果你刪除搜索文本,那麼所有的列表應該對用戶可見,但它沒有發生 – Carlos
嘗試
$('#search-inp').keyup(function(){
var key = $(this).val();
var regExp = "."
if (key)
regExp = "^\\s*" + key + "\\s*$";
table.columns(1).search(regExp, true).draw();
});
當搜索key
是空始終將其設置爲.
比賽any
在regex
。
可以描述_「它不工作」_?似乎在http://jsfiddle.net/yg32o2yh/5/返回匹配? – guest271314
當我鍵入「xon」時,則選擇第一行。但在沒有詞從「xon」盯着 – Carlos
預期結果查詢'xon' _不匹配'老虎尼克松'? – guest271314