ExtJs之Panel基本布局

简介:
复制代码
<!DOCTYPE html>
<html>
<head>
    <title>ExtJs</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
          <link rel="stylesheet" type="text/css" href="ExtJs/packages/ext-theme-crisp/build/resources/ext-theme-crisp-all.css">
      <script type="text/javascript" src="ExtJs/ext-all.js"></script>
      <script type="text/javascript" src="ExtJs/bootstrap.js"></script>
      <script type="text/javascript" src="ExtJs/packages/ext-theme-crisp/build/ext-theme-crisp.js"></script>
        <script type="text/javascript">
            Ext.onReady(function() {
                Ext.create('Ext.panel.Panel', {
                    title: 'Local',
                    height: 550,
                    width: 250,
                    Frame: true,
            collapsible: true,
            autoScroll: true,
                    renderTo: Ext.getBody(),
                    bodyPadding: 5,
                    bodyStyle: 'background-color: #FFFFFF',
            layout: 'vbox',
            items: [{
              title: 'localElement',
              contentEl: 'localElement'
            },{
              xtype: 'datepicker',
              minDate: new Date()
            },{
              xtype: 'datepicker',
              minDate: new Date()
            }]
                });
            });
    </script>
</head>
<body>
  <table border=1 id='localElement'>
    <tr><th colspan="2">Staff List</th></tr>
    <tr>
      <th width="60">Number</th>
      <th width="60">Value</th>
    </tr>
    <tr><td>1</td><td>One</td></tr>
    <tr><td>2</td><td>One</td></tr>
    <tr><td>3</td><td>One</td></tr>
    <tr><td>4</td><td>One</td></tr>
    <tr><td>5</td><td>One</td></tr>
    <tr><td>6</td><td>One</td></tr>
    <tr><td>7</td><td>One</td></tr>
    <tr><td>8</td><td>One</td></tr>
    <tr><td>9</td><td>One</td></tr>
  </table>
</body>
</html>
复制代码

目录
相关文章
|
JavaScript 前端开发
|
JavaScript 前端开发 HTML5
ExtJS中的accordion布局如何展开特定的item
因为项目需要,使用了extJS作为后台管理系统的前端框架。 众所周知,后台管理系统一般是根据权限来展示菜单的。 菜单使用了panel的accordion布局,然后内部使用panel包裹了一棵树(treepanel)。
1091 1
|
JavaScript 前端开发
|
JavaScript 前端开发
|
JavaScript 容器 数据安全/隐私保护