0

希望有人可以提供帮助。

我在将 JQWidgets Grid (JqxGrid) 加载到 JQueryUI 选项卡小部件时遇到了一些问题。每当我将网格宽度设置为百分比值时,它似乎都会将其更改为像素值。例如,100% 的宽度被转换为 100px。现在我知道以前版本的 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%' }
        ]
    });
4

2 回答 2

0

jqxGrid does not turn percentage into pixels or at least it does not in its latest version - http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/autosize.htm

于 2013-08-15T05:01:22.023 回答
0

Uhm...After a day of struggling, I solved it. I think it's a a glitch with JqxGrid because it's turning the percentage values to pixel values, so 85% becomes 85px and 100% becomes 100px. (then again, it's possible I'm doing something wrong as well). Anyway, turns out that if you hide content tabs BEFORE initializing the grid, the percentage values get converted to pixel values. So for example, I had the following code above the grid initialization

$("#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;
    });

and the grid behaved strangely, but as soon as I moved it below the grid initialization, everything worked as expected again.

于 2013-08-14T17:54:32.080 回答