jqgrid многоточие

Question

В jqGrid есть собственный способ показать "..." в конце столбца, если его текст не уместился и был усечен?

Я вижу, что существует класс ui-ellipsisно я запутался, если он будет автоматически добавлен, если текст обрезан, и если он автоматически исчезнет после изменения размера столбца?

Answer 1

Вы можете решить проблему, используя следующий CSS

<style type="text/css">
    .ui-jqgrid tr.jqgrow td { text-overflow: ellipsis;-o-text-overflow: ellipsis; }
</style>

В случае, если у вас будут результаты, как показано ниже:

(см. здесь live)

В некоторых других ситуациях лучше использовать другой стиль CSS:

<style type="text/css">
    .ui-jqgrid tr.jqgrow td {
        white-space: normal !important;
        height:auto;
        vertical-align:middle;
        padding-top:3px;
        padding-bottom:3px
    }
</style>

В случае, если результаты следующие:

(см. здесь live).

Обе вышеуказанные настройки являются моими общими настройками, которые я часто использую, в зависимости от требований клиентов.

Answer 2

fit text plugin:

 (function($) {
        $.fn.fitText = function(options) {
            options = $.extend({
                width: 0,
                height: 0
            }, options);

            $(this).each(function() {
                var elem = $(this);
                if (options.height > 0) {
                    while (elem.height() > options.height) {
                        elem.text(elem.text().substring(0, (elem.text().length - 4)) + "...");
                    }
                }
                if (options.width > 0) {
                    while (elem.width() > options.width) {
                        elem.text(elem.text().substring(0, (elem.text().length - 4)) + "...");
                    }
                }
            });
        }
    })(jQuery);


calling the function:

    $('.ADHrefUserName').fitText({ width: 200, height: 25 });