2012-12-22 42 views
6

Nhóm,Tắt thanh cuộn ngang trong bảng điều khiển EXTJS

Có ai biết cách vô hiệu thanh cuộn ngang trong bảng điều khiển. Tôi đang sử dụng EXTJS 3.4

Về cơ bản, tôi chỉ muốn thanh cuộn dọc hiển thị và không nằm ngang.

Tôi đã thử autoScroll = true làm thuộc tính bảng nhưng nếu tôi làm như vậy tôi có thể thấy cả thanh cuộn ngang và dọc.

đây là mã.

<html> 
<head> 
<title>Hello World Window</title> 
<link rel="stylesheet" type="text/css" href="ext-3.4.0/resources/css/ext-all.css" /> 
<script type="text/javascript" src="ext-3.4.0/adapter/ext/ext-base.js"></script> 
<script type="text/javascript" src="ext-3.4.0/ext-all.js"></script> 
</head> 

<body> 
<script type="text/javascript"> 


    Ext.onReady(function(){ 
     var tab2 = new Ext.FormPanel({ 
      labelAlign: 'left', 
      labelStyle: 'font-weight:bold;', 
      labelWidth: 85, 
      title: 'Run Report', 
      bodyStyle:'padding:5px', 
      border : true, 
      style: 'margin:0 auto;margin-top:50px;margin-left:50', 
      width: 900, 
      height:600, 
        items: 
        [{ 

         xtype:'panel', 
         border:true, 
         height:75, 
         title:'Inner Panel', 
         bodyStyle:'padding:5px', 
         autoScroll:true, 
        items: [{ 
        layout:'column', 
        border :false, 
        items:[{ 
         columnWidth:.3, 
         layout: 'form', 
         border :false, 
         items: [{ 
          xtype:'textfield', 
          fieldLabel: 'First Name', 
          name: 'first', 
          anchor:'95%' 
         }, { 
          xtype:'textfield', 
          fieldLabel: 'Company', 
          name: 'company', 
          anchor:'95%' 
         }] 
        },{ 
         columnWidth:.3, 
         layout: 'form', 
         border :false, 
         items: [{ 
          xtype:'textfield', 
          fieldLabel: 'Last Name', 
          name: 'last', 
              anchor:'95%' 
         },{ 
          xtype:'textfield', 
          fieldLabel: 'Email', 
          name: 'email', 
          vtype:'email', 
          anchor:'95%' 
         }] 
        }] 
       }] 
      }] 
     , 
      buttons: [{ 
      text: 'Save' 
      },{ 
      text: 'Cancel' 
      }] 
     }); 

    tab2.render(document.body); 


}); 
</script> 

</div> 
</body> 
</html> 
+0

Rất vui được xem cách bạn xem xét toàn bộ cộng đồng ngăn xếp nhóm như một phần của nhóm của bạn! – hbulens

Trả lời

13

Giải pháp là đặt overflowY thành 'auto' và sau đó xóa autoScroll hoàn toàn.

xtype:'panel', 
border:true, 
height:75, 
title:'Inner Panel', 
bodyStyle:'padding:5px', 
//autoScroll:true, 
overflowY: 'auto' 
+0

Đã hoạt động hoàn hảo –

0

Tôi biết điều này là muộn nhưng điều này là cài đặt thực tế để sử dụng:

bodyStyle:'overflowY: auto', 

Hy vọng nó sẽ giúp một ai đó. Nên có thể làm cho nó hoạt động trong triển khai 4.x quá. Cho đến nay tôi chỉ thử nghiệm nó trong 3.4.

5

Sử dụng 4.2.1 gì làm việc cho tôi trong Chrome, FF và IE11 đang sử dụng này:

style: 'overflow-y: scroll; overflow-x: hidden;' 
1
// autoScroll:true, 
// style:'overflow-y:auto;overflow-x:hidden;', 
overflowY: 'auto', 

Nó hoạt động với thay thế ý kiến ​​với overflowY.

Các vấn đề liên quan