Sorting non-ASCII characters and data-content HTML Tag sorting

Sorting non-ASCII characters and data-content HTML Tag sorting

markjomarkjo Posts: 66Questions: 0Answers: 0
edited April 2012 in DataTables 1.9
In my table contents i have cells which have non-ASCII Turkish characters.

For example datatables sort my column like this:
[code]Alli
Beni
May
Zarra
Şahin[/code]

But the last word "Şahin" must be placed between "may" and "zarra"
Because in Turkish language "ş" letter comes after "s" letter.

Is it possible to sort the column regarding to UTF-8 characters?
Thank you for help.

Replies

  • markjomarkjo Posts: 66Questions: 0Answers: 0
    edited April 2012
    I also added [code]charset="utf-8"[/code] attribute to between my script tags.
    But it didn't help.
  • allanallan Posts: 49,056Questions: 1Answers: 7,171 Site admin
    In theory you should be able to use a sorting plug-in that uses localeCompare. I'd suggest trying that and seeing how it goes for you. The reason it isn't in DataTables core is that I've found localeCompare to be unreliable across browsers.

    I'd suggest also having a look at the answers to this SO question: http://stackoverflow.com/questions/3630645/how-to-compare-utf-8-strings-in-javascript

    Allan
  • allanallan Posts: 49,056Questions: 1Answers: 7,171 Site admin
    edited April 2012
    For reference - this is where I tired to use localeCompare:
    https://github.com/DataTables/DataTables/commit/f535031e41462f4c2d700d08d8f1aa5996b5ae21

    And this is where I rolled it back (unit test errors in IE9):
    https://github.com/DataTables/DataTables/commit/b447a0d4a92791a9cdc44006fadc47b5a845f340

    And the thread where tis was discussed:
    http://datatables.net/forums/discussion/7441

    Allan
  • markjomarkjo Posts: 66Questions: 0Answers: 0
    @Allan thank you for detailed help.
  • markjomarkjo Posts: 66Questions: 0Answers: 0
    If the localCompare has browser compatibility issues i don't prefer to use it..
    Because %35 of my visitors use IE browser.
    That can be an option if IE usage percentage lowers more.

    The first thing cam to my mind is to "transliterate" the cell text, and put transliterated text into title attribute of cell and sort by using hidden title..
  • markjomarkjo Posts: 66Questions: 0Answers: 0
    edited April 2012
    I transliterated cell contents to ASCII characters and sorting worked fine.
    That makes most of job well.

    But there is one more issue.
    In table there exist 100 string entries.
    Although all of them have ASCII characters,
    10 entries doesn't sorted properly.
    I transliterated it, escaped special characters, removed all characters like /()&;
    But still some of the entries behaves strangely.

    When i removed html tags in "td" everything works fine. But it behaves strange in html tags.

    Actual cell is like this:
    [code]
    $content = htmlspecialchars($oldContent);



    Name
    [/code]

    Library automatically marks cell as "html".
    When i change "sType" to "string", table was sorted regarding to "data-content" attribute's text.
    I need to sort column regarding to "Name".

    I also use "title" tag of "button" for my popover.
    So it seems like "title" doesn't solve my issue.
  • markjomarkjo Posts: 66Questions: 0Answers: 0
    edited April 2012
    As far as i find code breaks from the
    "data-content" attribute. IT works well without "data-content".

    In datatables.js I put alert into this:
    [code]"html-asc": function ( x, y )[/code]

    I saw that for problematic entries "x" value comes with full html, while y comes only text inside "span"
    Like this:

    [code]"html-asc": function ( x, y )
    {
    alert("string-desc \n\n\n x: " + x + "\n\n\n y: " + y +
    "\n\n\n result: " + (x > y));

    return ((x < y) ? -1 : ((x > y) ? 1 : 0));
    },[/code]

    and one of myproblematic entry shows like this:

    [code]x: john

    y: williams

    result: true[/code]
  • markjomarkjo Posts: 66Questions: 0Answers: 0
    In this issue, in html sorting is it possible to ignore other attributes and only compare plaintext of the cell ?
    Thank you
  • allanallan Posts: 49,056Questions: 1Answers: 7,171 Site admin
    Just strip out the HTML?

    [code]
    a.replace( /<.*?>/g, "" );
    [/code]

    Allan
  • markjomarkjo Posts: 66Questions: 0Answers: 0
    edited May 2012
    Jsfiddle example:
    http://jsfiddle.net/axfsD/1/

    -----------

    Thank you @Allan

    Doesn't "html-pre" does this?

    I edited html-pre like this:
    [code]
    "html-pre": function ( a )
    {
    var sonuc = a.replace( /<.*?>/g, "" ).toLowerCase();
    if (sonuc.indexOf("button") != -1 && sonuc.indexOf("popover") != -1) {
    $('body').append('' + a + '

    ' + sonuc);
    }

    return a.replace( /<.*?>/g, "" ).toLowerCase();
    },
    [/code]

    One of the result is like this:
    [code]
    mihan tosun





    mihan tosun
    [/code]

    Should I change something more in html-pre?
  • allanallan Posts: 49,056Questions: 1Answers: 7,171 Site admin
    > Doesn't "html-pre" does this?

    IOh I see - you are actually editing DataTables core rather than using a plug-in? In which case, yes it would. I'd suggest echoing out the data being sorted in the sorting functions to check that it is what you expect.

    Allan
  • markjomarkjo Posts: 66Questions: 0Answers: 0
    I edited core to check the behaviour of "html-asc" and "html-desc".
    So in my case a.replace() didn't strip all html tags.
    I suppose it is a bug of replace() method.
    So maybe other people would suffer from it later.
    Is there an advantage of replace() to jquery.text() function ?

    I created a plugin like below. It works as i needed.
    Thank you very much for your guidance.

    [code]
    jQuery.fn.dataTableExt.oSort['html-better-asc'] = function(a,b) {
    var x = $(a).text();
    var y = $(b).text();
    return ((x < y) ? -1 : ((x > y) ? 1 : 0));
    };


    jQuery.fn.dataTableExt.oSort['html-better-desc'] = function(a,b) {
    var x = $(a).text();
    var y = $(b).text();
    return ((x < y) ? 1 : ((x > y) ? -1 : 0));
    };
    [/code]
  • arunhi2arunhi2 Posts: 1Questions: 0Answers: 0
    I am using datatable with python and django. DataTable fails due to invalid json. Following is my JSON response. i was able to find the problemetic line after validating the json with an online json validator (http://jsonlint.com/). This is failing due to a back slash , can any one help me , how to deal this ?

    {
    "sEcho": 3,
    "iTotalRecords": 93,
    "iTotalDisplayRecords": 93,
    "aaData": [
    [
    "ARUN\SAMPLE",
    "323",
    "None",
    "Active"
    ]
    ]
    }
This discussion has been closed.