extjs学习笔记

来源：互联网发布：网络dns存在问题编辑：程序博客网时间：2024/06/10 02:03

参考资料： http://www.cnblogs.com/iamlilinfeng/archive/2012/06/18/2553627.html

1、基础部署（helloworld）

<!DOCTYPE html><html><head><meta charset="UTF-8"><title>extjs example</title><script type="text/javascript" src="../js/ext/adapter/ext/ext-base.js"></script><script type="text/javascript" src="../js/ext/ext-all.js"></script><link rel="stylesheet" type="text/css" href = "../js/ext/resources/css/ext-all.css"/><script type="text/javascript">    Ext.onReady(function(){        Ext.MessageBox.alert('title','message');    });</script></head><body></body></html>

2、窗体组件(Window)

<script type="text/javascript">Ext.onReady(function () {  var win = new Ext.Window({  title: '窗口',  width: 476,  height: 374,  html: '<div>这里是窗体内容</div>',  resizable: true,  modal: true,  closable: true,  maximizable: true,  minimizable: true});win.show();});</script>

2、表单(FormPanel)

<script type="text/javascript">         Ext.onReady(function () {             var form = new Ext.form.FormPanel({                 frame: true,                 title: '表单标题',                 style: 'margin:10px',                 html: '<div style="padding:10px">这里表单内容</div>'             });             var win = new Ext.Window({                 title: '窗口',                 width: 476,                 height: 374,                 html: '<div>这里是窗体内容</div>',                 resizable: true,                 modal: true,                 closable: true,                 maximizable: true,                 minimizable: true,                 items: form             });             win.show();         });     </script>

0 0