Использование JQXGrid с виджетом вкладок JQueryUI

Надеюсь, кто-то может помочь.

У меня возникла небольшая проблема с загрузкой сетки JQWidgets (JqxGrid) в виджет вкладок JQueryUI. Всякий раз, когда я устанавливаю ширину сетки в процентах, она, кажется, меняет ее на значение в пикселях. Так, например, ширина 100% преобразуется в 100 пикселей. Теперь я знаю, что была похожая проблема с предыдущими версиями JqxGrid и компонентов JqxTab, и она была решена, но, к сожалению, на данный момент я не в состоянии изменить виджет своей вкладки. Если кто-то знает, как обойти эту проблему, ваша помощь будет очень признательна.

Спасибо

Вот мой код:

$("#studentgrid").jqxGrid({
        width: '100%',
        source: studentAdapter, 
        theme: theme,     
        filterable: true,
        sortable: true,
        pageable: true,
        autoheight: true,
        altrows: true,
        enabletooltips: true,
        autoshowfiltericon: true,
        groupable: true,
        columns: [
            {text: 'Programme / Unit', datafield: 'student_unit', width: '30%'},
            {text: "Involvement Type", datafield: 'student_type', width: '30%' },                
            {text: 'Student Count', datafield: 'student_count', width: '20%' },
            {text: 'Student Level', datafield: 'student_level', width: '20%' }
        ]
    });

person Ashraf Abrahams    schedule 14.08.2013    source источник
comment
пожалуйста, опубликуйте код для инициализации вашей сетки .... вы помещаете 100% в одинарные кавычки? =› width: '100%' ....... вы также можете попробовать использовать =› width: 'auto' ...... и я столкнулся с неожиданным поведением, используя проценты для ширины и высоты из-за порядка, в котором создаются элементы....   -  person A.O.    schedule 14.08.2013
comment
Привет. Я добавил свой блок кода. Я пробовал использовать одинарные кавычки, двойные кавычки, помещать объявление ширины впереди, а также в конце. Нет разницы. Это происходит только в виджете вкладок пользовательского интерфейса. Если я создаю сетку вне вкладок, она работает так, как ожидалось. Кроме того, если я использую группировку, заголовок группы также отображается неправильно. Как только я перепривязываю сетку, она отображается, как и ожидалось.   -  person Ashraf Abrahams    schedule 14.08.2013
comment
Возможно ли, что ваша сетка создается в DOM до полной инициализации вкладок?   -  person A.O.    schedule 14.08.2013


Ответы (2)


Хм ... После дня борьбы я решил это. Я думаю, что это сбой с JqxGrid, потому что он превращает процентные значения в значения пикселей, поэтому 85% становится 85px, а 100% становится 100px. (опять же, возможно, я тоже что-то делаю не так). В любом случае, оказывается, что если вы скрываете вкладки контента ДО инициализации сетки, процентные значения преобразуются в значения пикселей. Так, например, у меня был следующий код над инициализацией сетки

$("#tabContainer").tabs();  
    $(".tab_content").hide(); //Hide all content
    $("ul.tabs li:first").addClass("active").show(); //Activate first tab
    $(".tab_content:first").show(); //Show first tab content
    //On Click Event
    $("ul.tabs li").click(function() {
        $("ul.tabs li").removeClass("active"); //Remove any "active" class
        $(this).addClass("active"); //Add "active" class to selected tab
        $(".tab_content").hide(); //Hide all tab content

        var activeTab = $(this).find("a").attr("href"); 
        $(activeTab).fadeIn(); //Fade in the active ID content                     
        return false;
    });

и сетка вела себя странно, но как только я переместил ее ниже инициализации сетки, все снова заработало как положено.

person Ashraf Abrahams    schedule 14.08.2013

jqxGrid не преобразует проценты в пиксели, по крайней мере, в последней версии — http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/autosize.htm

person scripto    schedule 15.08.2013
comment
Последняя версия, похоже, меняет процент на пиксели, но только при использовании внутри виджета вкладки и только тогда, когда вкладка, содержащая сетку, скрыта до инициализации сетки. Протестируйте и посмотрите. - person Ashraf Abrahams; 22.08.2013