Как отсортировать гиперссылки в DataTable численно?

Question

У меня есть следующий столбец просмотра сетки гиперссылки, который должен быть отсортирован по номеру IncidentId.Есть ли способ сохранить данные как гиперссылки и отсортировать их только по IncidentId?Когда я использую следующую функцию javascript для сортировки «числовой», она разбивается и столбец не сортируется.Если я объявляю sType как «string» или «html», он сортирует, но он сортирует данные в алфавитном порядке, а не в числовом формате, другими словами, он будет отображать их как 93, 82, 71, 40, 123, 122, 121 вместо123, 122, 121, 93, 82, 71, 40.

<asp:HyperLinkField HeaderText="Incident ID:" DataNavigateUrlFields="IncidentId" 
DataNavigateUrlFormatString="view.aspx?id={0}" DataTextField="IncidentId"/>


<script type="text/javascript">
    $(function () {
        $('#GridViewIncidents').dataTable({
            "bFilter": false,
            "bSort": true,
            "aoColumnDefs": [{ "sType": "numerical", "aTargets": [0]}]
        });
    });
</script>

Answer 1

Мое решение состоит в том, чтобы сначала определить точку расширения addType:

jQuery.extend(jQuery.fn.dataTableExt, {
    addType: function (options) {
        var optionsSpecified = options != null && options.name && options.detect && options.compare;
        if (!optionsSpecified) {
            alert('addColumnType: options are not specified correctly.');
        } else {
            this.aTypes.unshift(function (sData) {
                return options.detect(sData) ? options.name : null;
            });

            this.oSort[options.name + '-asc'] = function (x, y) {
                return options.compare(x, y);
            };

            this.oSort[options.name + '-desc'] = function (x, y) {
                return options.compare(x, y) * -1;
            };
        }
    }
});

После этого мы определяем расширение для распознавания целочисленных ссылок, используя вышеуказанную точку расширения:

(function () {
    var linkRegex = new RegExp("^<a.*>([0-9]+)</a>$");

    function parseIntLink(sData) {
        var result = linkRegex.exec(sData);
        return result == null ? NaN : parseInt(result[1], 10);
    }

    jQuery.fn.dataTableExt.addType({
        name: 'int-link',
        detect: function (sData) {
            return !isNaN(parseIntLink(sData));
        },
        compare: function (x, y) {
            return parseIntLink(x) - parseIntLink(y);
        }
    });
})();

Пожалуйста, смотрите этот блог для более подробной информации.(Отказ от ответственности: это мой блог).

Answer 2

Вам необходимо переопределить компараторы по умолчанию для функции сортировки таблиц данных.

jQuery.fn.dataTableExt.aTypes.unshift(
    function (sData) {
        if (sData !== null && sData.match('^<.*[0-9]+</.*>$')) {
            return 'intComparer';
        }
        return null;
    }
);

Приведенный выше код найдет любое целое число, заключенное в HTML-тег, и скажет Datatables использовать пользовательскую функцию сравнения.

Затем нам нужно определить функции compaere для этого:

    jQuery.fn.dataTableExt.oSort['intComparer-asc'] = function (a, b) {
        var value1 = parseInt(getInnerHTML(a));
        var value2 = parseInt(getInnerHTML(b));
        return ((value1 < value2) ? -1 : ((value1 > value2) ? 1 : 0));
    };

    jQuery.fn.dataTableExt.oSort['intComparer-desc'] = function (a, b) {
        var value1 = parseInt(getInnerHTML(a));
        var value2 = parseInt(getInnerHTML(b));
        return ((value1 < value2) ? 1 : ((value1 > value2) ? -1 : 0));
    };

Это удаляет теги и сортирует по числовому значению.

Просто поместите весь этот код в тег скрипта передВы настроили свой стол, и он должен работать!