jqGrid filterToolbar不区分大小写的搜索找不到特殊的土耳其语字符 [英] Case insensitive search by jqGrid filterToolbar can't find special Turkish character
问题描述
使用jqGrid filterToolbar时出现问题.工具栏进行搜索，但找不到包含"ı"的字符.例如，我可以搜索"yapi"单词，但搜索工具栏找不到"yapı".
I have a problem when I'm using jqGrid filterToolbar. Toolbar make a search but cant find the character which is contain "ı". Forexample I can search the "yapi" word but search toolbar can't find the "yapı".
jQuery("#grid-table").jqGrid('filterToolbar',
{ stringResult: false, searchOperators: false, defaultSearch: "cn" });
我的页面编码是；
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
我的ajax帖子在这里
and my ajax post is here
$.ajax({ 类型:发布"， 网址:"page/get.aspx， contentType:"application/json; charset = utf-8"， dataType:"json"， 数据: "{}"， 成功:功能(){ // }， 错误:功能(){ // } });
$.ajax({ type: "Post", url: "page/get.aspx, contentType: "application/json; charset=utf-8", dataType: "json", data: "{}", success: function () { // }, error: function () { // } });
推荐答案
我确定问题出在您使用的HTML页面的编码中.我试图重现该问题，并打开了一个以ANSI编码保存的旧演示.在将测试yapı插入数据并保存后，我可以重现该问题，但是对代码的验证表明，由于ANSI编码，字符串yapı被保存为yapi.然后，我使用记事本打开了相同的演示(我在Windows计算机上工作)，重复相同的操作，并使用SaveAs来选择UTF-8编码.现在，人们可以看到网格中确实显示了yapı字符串，而不是以前显示的yapi字符串，并且我可以成功过滤出该字符串.当然，在两个实验中我都<meta charset="utf-8">.
I'm sure that the problem is in the encoding of the HTML page which you use. I tried to reproduced the problem and opened an old demo saved in ANSI encoding. After I inserted the test yapı in the data and saved I could reproduces the problem, but verification of the code shows that the string yapı was saved as yapi because of ANSI encoding. Then I opened the same demo using Notepad (I work on Windows computer) repeat the same and I used SaveAs to be able to choose UTF-8 encoding. Now one could see really yapı string displayed in the grid instead of yapi before and I could successfully filter for the string. Of cause I had <meta charset="utf-8"> during both experiments.
因此，您应该验证HTML页面的<head>中不仅存在<meta charset="utf-8">，而且数据也采用UTF-8编码.如果是嵌入数据(例如在我的实验中)，则文件需要以UTF-8格式保存.
So you should validate that not only <meta charset="utf-8"> exist in the <head> of your HTML page, but the data are in UTF-8 encoding too. In case of embedded data (like in my experiment), the file need be saved in UTF-8 format.
更新:评论中的讨论表明，主要问题是不区分大小写的土耳其语文字.
UPDATED: The discussion in comments shows that the main problem was case insensitive filtering of Turkish text.
这个问题对我来说绝对是新问题，但是土耳其语有两个 i:一个在i上，而另一个在上在ı上.两个i都有相应的大写字母I:İ和I.所有信息与许多其他语言并无不同.主要问题在于如何选择4个字符的Unicode表示形式:土耳其语字符i和I使用与拉丁字符相同的代码:U+0069和U+0049.仅将字符ı和İ映射到U+0131和U+0130(请参见
The problem was absolutely new for me, but Turkish language have two i: one with point over i and another one without point ı. Both the i have the corresponding capital I: İ and I. All the information is not different from many other languages. The main problem is in the choice of Unicode representation of the 4 characters: the Turkish characters i and I use the same codes like Latin characters: U+0069 and U+0049. Only the characters ı and İ will be mapped on U+0131 and U+0130 (see here). Such mapping makes impossible to implement case insensitive compare or JavaScript functions .toUpperCase() and .toLowerCase(). If the input text contains Latin letter i then the function .toUpperCase() should convert it to I, but it's wrong for Turkish and it should be İ instead. In the same way .toLowerCase() should produce ı for the Turkish text and i for the English text.
因此，第一个重要信息是:如果不输入语言，就不可能实现一个通用的不区分大小写的比较.
Thus the first important information: it's impossible to implement one universal version of case insensitive compare without the knowledge of input language.
好.现在回到问题所在.如何在土耳其语文本中实现不区分大小写的搜索?在4.7.1版中更改了jqGrid的许可协议后，我继续以免费jqGrid的名称开发其免费版本(在MIT和GPL v2许可下).我在免费的jqGrid的第一个版本(版本4.8)中实现了许多新功能.
OK. Now back to the problem. How to implement case insensitive searching inside of Turkish texts? After changing of licence agreement of jqGrid in version 4.7.1 I continue developing of free version of it (under MIT and GPL v2 licence) under the name free jqGrid. I implemented many new features in the first release of free jqGrid: version 4.8. The "custom filtering" feature described in the wiki article can help in the implementation.
基于我创建的功能 以下演示 .在实施期间，我在免费jqGrid的代码中进行了一些小错误修复.因此，我在演示中使用了来自GitHub(http://rawgit.com/free-jqgrid/jqGrid/master/js/jquery.jqgrid.src.js)的最新资源(请阅读
Based on the feature I created the following demo. I made some small bug fixes in the code of free jqGrid during the implementation. So I use the latest sources from GitHub (http://rawgit.com/free-jqgrid/jqGrid/master/js/jquery.jqgrid.src.js) in the demo (read wiki about the URLs).
我在jqGrid中使用了以下选项
I used the following options in jqGrid
ignoreCase: false,
customSortOperations: {
teq: {
operand: "==",
text: "Turkish insensitive \"equal\"",
filter: function (options) {
var fieldData = String(options.item[options.cmName]).replace(/i/g,'İ').toUpperCase(),
searchValue = options.searchValue.replace(/i/g,'İ').toUpperCase();
return fieldData === searchValue;
}
},
tne: {
operand: "!=",
text: "Turkish insensitive \"not equal\"",
filter: function (options) {
var fieldData = String(options.item[options.cmName]).replace(/i/g,'İ').toUpperCase(),
searchValue = options.searchValue.replace(/i/g,'İ').toUpperCase();
return fieldData !== searchValue;
}
},
tbw: {
operand: "^",
text: "Turkish insensitive \"begins with\"",
filter: function (options) {
var fieldData = String(options.item[options.cmName]).replace(/i/g,'İ').toUpperCase(),
searchValue = options.searchValue.replace(/i/g,'İ').toUpperCase();
return fieldData.substr(0,searchValue.length) === searchValue;
}
},
tbn: {
operand: "!^",
text: "Turkish insensitive \"does not begin with\"",
filter: function (options) {
var fieldData = String(options.item[options.cmName]).replace(/i/g,'İ').toUpperCase(),
searchValue = options.searchValue.replace(/i/g,'İ').toUpperCase();
return fieldData.substr(0,searchValue.length) !== searchValue;
}
},
tew: {
operand: "|",
text: "Turkish insensitive \"end with\"",
filter: function (options) {
var fieldData = String(options.item[options.cmName]).replace(/i/g,'İ').toUpperCase(),
searchValue = options.searchValue.replace(/i/g,'İ').toUpperCase(),
searchLength = searchValue.length;
return fieldData.substr(fieldData.length-searchLength,searchLength) === searchValue;
}
},
ten: {
operand: "!@",
text: "Turkish insensitive \"does not end with\"",
filter: function (options) {
var fieldData = String(options.item[options.cmName]).replace(/i/g,'İ').toUpperCase(),
searchValue = options.searchValue.replace(/i/g,'İ').toUpperCase(),
searchLength = searchValue.length;
return fieldData.substr(fieldData.length-searchLength,searchLength) !== searchValue;
}
},
tcn: {
operand: "~",
text: "Turkish insensitive \"contains\"",
filter: function (options) {
var fieldData = String(options.item[options.cmName]).replace(/i/g,'İ').toUpperCase(),
searchValue = options.searchValue.replace(/i/g,'İ').toUpperCase();
return fieldData.indexOf(searchValue,0) >= 0;
}
},
tnc: {
operand: "!~",
text: "Turkish insensitive \"does not contain\"",
filter: function (options) {
var fieldData = String(options.item[options.cmName]).replace(/i/g,'İ').toUpperCase(),
searchValue = options.searchValue.replace(/i/g,'İ').toUpperCase();
return fieldData.indexOf(searchValue,0) < 0;
}
}
}
选项customSortOperations定义了新的自定义操作，用于不区分大小写的土耳其语文本比较.要使用该选项，只需在searchoptions中为包含土耳其语文本的列指定操作即可:
The option customSortOperations defined new custom operation for case-insensitive compare of Turkish texts. To use the option one need just specify the operations in searchoptions for the columns which contains Turkish texts:
searchoptions: { sopt: ["tcn", "tnc", "teq", "tne", "tbw", "tbn", "tew", "ten"] }
结果是，过滤使用"tcn"(Turkish insensitive "contains")作为默认过滤操作.如果使用filterToolbar的searchOperators: true选项，则可以选择另一种搜索操作.我希望以上所有自定义比较操作都是正确的，并且可以在土耳其语网格中使用.
As the result the filtering uses "tcn" (Turkish insensitive "contains") as the default filtering operation. If one uses searchOperators: true option of filterToolbar then another searching operations could be chosen. I hope that all above custom compare operations are correct and there can be used in Turkish grids.
UPDATED 2: I have found one more interest implementation option: the method localeCompare which supports parameters. I tested that in Google Chrome
"i".localeCompare("İ", "tr", { sensitivity: "base" }) === 0
"i".localeCompare("I", "tr", { sensitivity: "base" }) === 1
"ı".localeCompare("I", "tr", { sensitivity: "base" }) === 0
"ı".localeCompare("İ", "tr", { sensitivity: "base" }) === -1
或
"i".localeCompare("İ", "tr", { sensitivity: "accent" }) === 0
"i".localeCompare("I", "tr", { sensitivity: "accent" }) === 1
"ı".localeCompare("I", "tr", { sensitivity: "accent" }) === 0
"ı".localeCompare("İ", "tr", { sensitivity: "accent" }) === -1
，但是与有关浏览器兼容性的信息.上面所有对localeCompare的调用都在IE11中返回0.可能是可以使用sensitivity的另一个值来获得预期的结果. IE9会为上述localeCompare的调用返回1或-1.我想它只考虑第一个参数，而忽略了"tr", { sensitivity: "base" }部分. Chrome中的结果看起来如此
but the same tests in IE11 failed opposite to the information about the browser compatibility. All the above calls of localeCompare returns 0 in IE11. It can be that one can use some another value of sensitivity to have the expected results. IE9 instead returns 1 or -1 for above calls of localeCompare. I suppose that it take in consideration only the first parameter and ignores "tr", { sensitivity: "base" } part. The results in Chrome looks so
在Firefox中，结果相同
One have the same results in Firefox
但不在IE11中
另一种选择是使用 ECMAScript国际化API 类 Intl.Collator (请参阅 ecma-402 和
One more options would be to use The ECMAScript Internationalization API class Intl.Collator (see ecma-402 and here), like
new Intl.Collator("tr", { sensitivity: "base" }).compare("i", "İ")
例如，但是在这种情况下，IE似乎并没有好很多.
for example, but IE seems be not much better in the case.
无论如何，我认为可以通过包括浏览器检测部分来改进上述解决方案，该部分选择闭包以实现比较的实现，并在稍后的customSortOperations内部使用最佳实现.尽管如此，上面的代码可以安全地工作，但是它的原因可能不太优雅.
In any way I suppose that one can improve the above solution by including browser detection part which choose the closure for the implementation of compare and the usage of the best implementation inside of customSortOperations later. Nevertheless the above code works safe, but it's of cause not so elegant probably.
这篇关于jqGrid filterToolbar不区分大小写的搜索找不到特殊的土耳其语字符的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
