English 中文(简体)
基于单元格列数据样本添加一个排序解析器。
原标题:
  • 时间:2009-05-12 18:47:28
  •  标签:

This is the last part of this project, thanks to all who ve helped with syntax correction on other parts. I m using the tablesorter plugin for jQuery. Basically, what I want to accomplish is for my custom sort function to pick a table header based on whether or not it has a class, namely "SortableHeader". It then has to decide what metadata parser to add to the header of that particular column based on the data in that column. I ve taken the more complex approach and decided to take a sample of the data from a single cell( say the first row of the column) and compare it to different patterns, or regular expressions, the sorter will then add the proper metadata parser based on the comparison result, e.g. if it matches the date pattern, the sorter will add the date parser, if it matches the URL pattern, it adds the URL parser, etc. I have two issues:

  1. I can t figure out how to select a single row from a column, I ve tried looking, but I only find tutorials for traversing all rows in a table, as opposed to selecting a single row from a column based on the column header information.

  2. I m not sure how to do patterns and/or regular expressions in jQuery. e.g. How would a date regular expression/pattern that looks for dates of the form March 2, 2009, look in jQuery??

我目前有以下大纲。

    //Add parser to each table header that has a class="SortableHeader"
    $("th[class= SortableHeader ]").each(function(column){
        //Take a sample of data from a single cell in this column 
        // compare it to various patterns to determine what type 
       //of data it contains in order to apply the appropriate parser   
    });

一个示例的标题部分来执行排序搜索会是:

<table id="myTable" summary="Table is used to list available workshops"  cellspacing="0">
            <thead>
                <tr>
                    <th class="SortableHeader"><a rel = "Header" href="#" title="Sort title in decending order" class="">Title</a></th>
                    <th><a rel = "Header" href="#" title="Sort instructor in descending order" class="">Instructor</a></th>
                    <th class="SortableHeader"><a rel = "Header" href="#" title="Sort column in decending order" class="">Date</a></th>
                    <th>Start/End</th>
                    <th><a rel = "Header" href="#" title="Sort column in decending order" class="">Seats Available</a></th>
                    <th><a rel = "Header" href="#" title="Sort column in decending order" class="">Enrolled</a></th>
                    <th><a rel = "Header" href="#" title="Sort column in decending order" class="">Pre-Requisites</a></th>
                    <th>Workshop Actions</th>
                </tr>
            </thead>

The last question I have is, might there be a much simpler way of doing this?? I figure I could just take the title from the header and base the parser selector on that, but I wanted to avoid this since it seems to be a bit less flexible, I d have to hard code specific strings to check the title of the header against and anyone who is implementing this would only be able to use those specific strings as the title of there header in order to apply specific sort parsers. I want ot avoid this if I can.

最佳回答
  1. Use a selector that returns the columns in the first row, and then select the column you want from that.

    var firstColumn = $("#myTable TBODY TR:first TD")[0];

  2. I would try to coerce the value for date and numeric types, and then you can get into subtypes and regular expression matching when you re looking at various string type variations (URLs, etc...)

  3. If you d like to make it more decarative, I would just add another class to the column headers that indicate the comparer you want to use in the sort.

    < th class="SortableHeader DataTypeDate">...< /th> < th class="SortableHeader DataTypeURL">...< /th>

当你初始化排序时,你可以使用hasClass方法来查看一个列是否与特定的日期类型相关联。

$("#myTable THEAD TR:first TH").each(function(column) {
    if ($(this).hasClass("DataTypeDate")) {
        // ...
    }
});
问题回答

暂无回答




相关问题
热门标签