2013-08-14 2 views
0

누군가 도움을 줄 수 있기를 바랍니다.JQueryUI 탭 위젯과 함께 JQXGrid 사용

나는 JQueryUI 탭 위젯에 JQWidgets 그리드 (JqxGrid를)로드 약간의 문제가 있어요. 격자 너비를 백분율 값으로 설정할 때마다 픽셀 값으로 변경되는 것으로 보입니다. 예를 들어 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%' } 
     ] 
    }); 
+0

당신이 따옴표 안에 100 %를 배치하는 .... 그리드 초기화에 대한 코드를 게시하시기 바랍니다? => width : '100 %'.......... => width : 'auto'...... 그리고 폭과 높이에 대해 퍼센트를 사용하여 예기치 않은 동작을 경험했습니다. 요소가 생성되는 순서 때문에 ... –

+0

안녕하세요. 코드 블록을 추가했습니다. 나는 작은 따옴표, 큰 따옴표, 폭 선언을 앞과 뒤에 넣으려고했다. 차이 없음. 이 동작은 UI 탭 위젯에서만 발생합니다. 탭 외부에 눈금을 만들면 예상대로 작동합니다. 또한 그룹화를 사용하면 그룹 머리글이 올바르게 표시되지 않습니다. 표를 리바 인하는 즉시 예상대로 표시됩니다. –

+0

탭이 완전히 초기화되기 전에 DOM에 그리드가 생성 될 수 있습니까? –

답변

0

음은 ... 고투의 하루를 보낸 후, 나는 그것을 해결했다. 나는 백분율 값을 픽셀 값으로 바꾸고 있기 때문에 JqxGrid의 결함이라고 생각합니다. 따라서 85 %는 85 %가되고 100 %는 100 %가됩니다. (다시 한 번 잘못된 일을하고있는 것 같습니다). 어쨌든 그리드를 초기화하기 전에 내용 탭을 숨기면 백분율 값이 픽셀 값으로 변환됩니다. 그래서 예를 들면, 나는 그리드 초기화

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

위의 다음 코드를했다 그리드는 이상하게 행동, 그러나 다시 예상대로 최대한 빨리 그리드 초기화 아래에 이동로, 모든 일했다.

0

jqxGrid 픽셀로 비율을 설정하지 않거나 적어도 그것의 최신 버전으로하지 않습니다 - http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/autosize.htm

+0

최신 버전은 백분율을 픽셀로 변경하지만 그리드가 초기화되기 전에 그리드가 포함 된 탭이 숨겨져있는 경우에만 탭 위젯 내부에서만 사용됩니다. 그것을 시험하고보십시오. –

관련 문제