搭建环境

Eclipse项目工程: Extjs

    ext-js/resources

            /shared

            /bootstrap.js

            /ext.js

            /ext-all.js

            /ext-all-debug.js

            /ext-all-debug-w-comments.js

            /ext-all-dev.js

            /ext-debug.js

            /ext-dev.js

    WEB-INF

    index.html

    xml-grid.js

配置文件(这里没有部署到默认的webapps下)。

C:\software\apache-tomcat-6.0.32\conf\Catalina\localhost\extjs.xml

extjs.xml内容:

<Context path="/extjs" reloadable="true" docBase="C:\PMD\Extjs\WebContent" />

index.html:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title></title>

<link rel="stylesheet" type="text/css"
    href="./ext-js/resources/css/ext-all.css" />
<script type="text/javascript" src="./ext-js/bootstrap.js"></script>

<script type="text/javascript" src="xml-grid.js"></script>
</head>
<body>
<div id="example-grid"></div>
</body>
</html>

xml-grid.js:

Ext
        .onReady(function() {

            Ext
                    .define(
                            'profile',
                            {
                                extend : 'Ext.form.FieldSet',
                                alias : 'widget.profile',
                                itemId : 'profile',
                                width : 500,
                                title : 'Client Profile',
                                collapsible : true,
                                layout : 'column',
                                defaults : {
                                    labelWidth : 150,
                                    labelStyle : 'font-size: 11px;',
                                    fieldStyle : 'font-size: 11px;'
                                },
                                items : [
                                        {
                                            xtype : 'datefield',
                                            itemId : 'clientID',
                                            fieldLabel : '<a class="black" tabindex="-1" href="javascript:showHelp(\'Client ID\');">Client ID</a><font color=red>*</font>',
                                            name : 'clientId',
                                            columnWidth : 0.7
                                        },
                                        {
                                            xtype : 'displayfield',
                                            itemId : 'cliendIdBlank',
                                            columnWidth : 0.3
                                        },
                                        {
                                            xtype : 'combo',
                                            itemId : 'PA1200_CLIENT_NAME',
                                            fieldLabel : '<a href="javascript:showHelp(\'Client Name\');">Client Name</a><font color=red>*</font>',
                                            name : 'clientName',
                                            store : new Ext.data.ArrayStore(
                                                    {
                                                        fields : [ 'value','text' ],
                                                        data : [
                                                                    [ '','Select One' ],
                                                                    [ 'E','Enrolled (E)' ],
                                                                    [ 'T','Terminated (T)' ],
                                                                    [ 'L','LOA (L)' ],
                                                                    [ 'S','Suspended (S)' ]
                                                                ]
                                                    }),
                                            displayField : 'text',
                                            valueField : 'value',
                                            mode : 'local',
                                            editable : false,
                                            typeAhead : false,
                                            triggerAction : 'all',
                                            lazyRender : true,
                                            columnWidth : 0.7
                                        },
                                        {
                                            xtype : 'displayfield',
                                            columnWidth : 0.3
                                        },
                                        {
                                            xtype : 'combo',
                                            itemId : 'PA1200_ADDRESS_LINE_1',
                                            fieldLabel : '<a href="javascript:showHelp(\'Address 1\');">Address 1</a>',
                                            name : 'addressLine1',
                                            store : new Ext.data.ArrayStore(
                                                    {
                                                        fields : [ 'value','text' ],
                                                        data : [
                                                                    [ '','Select One' ],
                                                                    [ 'E','Enrolled (E)' ],
                                                                    [ 'T','Terminated (T)' ],
                                                                    [ 'L','LOA (L)' ],
                                                                    [ 'S','Suspended (S)' ]
                                                                ]
                                                    }),
                                            displayField : 'text',
                                            valueField : 'value',
                                            mode : 'local',
                                            editable : false,
                                            typeAhead : false,
                                            triggerAction : 'all',
                                            lazyRender : true,
                                            columnWidth : 0.7
                                        },
                                        {
                                            xtype : 'displayfield',
                                            columnWidth : 0.3
                                        },
                                        {
                                            xtype : 'combo',
                                            id : 'PA1200_ADDRESS_LINE_2',
                                            itemId : 'PA1200_ADDRESS_LINE_2',
                                            fieldLabel : '<a href="javascript:showHelp(\'Address 2\');">Address 2</a>',
                                            name : 'addressLine2',
                                            store : new Ext.data.ArrayStore(
                                                    {
                                                        fields : [ 'value','text' ],
                                                        data : [
                                                                    [ '','Select One' ],
                                                                    [ 'E','Enrolled (E)' ],
                                                                    [ 'T','Terminated (T)' ],
                                                                    [ 'L','LOA (L)' ],
                                                                    [ 'S','Suspended (S)' ]
                                                                ]
                                                    }),
                                            displayField : 'text',
                                            valueField : 'value',
                                            mode : 'local',
                                            editable : false,
                                            typeAhead : false,
                                            triggerAction : 'all',
                                            lazyRender : true,
                                            columnWidth : 0.7
                                        },
                                        {
                                            xtype : 'displayfield',
                                            columnWidth : 0.3
                                        },
                                        {
                                            xtype : 'combo',
                                            id : 'PA1200_ADDRESS_LINE_3',
                                            itemId : 'PA1200_ADDRESS_LINE_3',
                                            fieldLabel : '<a href="javascript:showHelp(\'Address 3\');">Address 3</a>',
                                            name : 'addressLine3',
                                            store : new Ext.data.ArrayStore(
                                                    {
                                                        fields : [ 'value','text' ],
                                                        data : [
                                                                    [ '','Select One' ],
                                                                    [ 'E','Enrolled (E)' ],
                                                                    [ 'T','Terminated (T)' ],
                                                                    [ 'L','LOA (L)' ],
                                                                    [ 'S','Suspended (S)' ]
                                                                ]
                                                    }),
                                            displayField : 'text',
                                            valueField : 'value',
                                            mode : 'local',
                                            editable : false,
                                            typeAhead : false,
                                            triggerAction : 'all',
                                            lazyRender : true,
                                            columnWidth : 0.7
                                        } ]

                            });

            var clientForm = Ext.create('Ext.form.FormPanel', {
                id : 'client',
                renderTo : 'example-grid',
                bodyPadding : 5,
                items : [ profile ]
            });
        });


最后效果:

公司把我截的图给拦截了,自己运行看看吧。


你可能感兴趣的:(搭建环境)