<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html><head><title>ext form render</title><link rel='stylesheet' href='ext-all.css'>
<style type='text/css'> .x-form-field-wrap {display:inline;} /* display DateFields inline */ .x-form-field-wrap .x-form-date-trigger-nonie {top:-1px;} /* remove 1px top padding for non-IE browsers */ </style>
<link rel="stylesheet" type="text/css" href="framework/ext-2.0.2/resources/css/ext-all.css" /><script type="text/javascript" src="framework/ext-2.0.2/adapter/ext/ext-base.js"></script><script type="text/javascript" src="framework/ext-2.0.2/ext-all.js"></script><script type="text/javascript" src='framework/ext-2.0.2/adapter/yui-utilities.js'></script></head><body><div class="x-box-tl"><div class="x-box-tr"><div class="x-box-tc"></div></div></div><div class="x-box-ml"><div class="x-box-mr"><div class="x-box-mc"><form id="form2" method="post"><h3>表单范例</h3><table> <tr> <td class="title">文字输入：</td> <td style="font-family: verdana;"><input type="text" id="tf" name="text2" /></td> </tr> <tr> <td class="title">下拉选单：</td> <td style="font-family: verdana;"><select id="cb" name="st2"> <option></option> <option>Aeiou</option> <option>Andy</option> <option>Amy</option> <option>Aloha</option> <option>Apple</option> <option>Application</option> <option>Aprik</option> <option>Backup</option> <option>Book</option> </select></td> </tr> <tr> <td class="title">日期选择：</td> <td style="font-family: verdana;"><input type="text" id="df" name="df" /></td> </tr> <tr> <td class="title">多行输入：</td> <td><textarea id="ta2" name="ta" cols="50" rows="6"></textarea></td> </tr> <tr> <td class="title"></td> <td> <div id="btn"></div> </td> </tr></table></form></div></div></div><div class="x-box-bl"><div class="x-box-br"><div class="x-box-bc"></div></div></div></body></html><script type='text/javascript'> 
Ext.onReady(function(){
Ext.onReady( // 定义表单 userForm = new Ext.form.BasicForm('form2'); // 渲染输入框 var tf = new Ext.form.TextField({ applyTo: 'tf', id: 'tf', allowBlank: false, 340
}); // 渲染下拉框 var cb = new Ext.form.ComboBox({ transform: 'cb' }); // 渲染日历框 var df = new Ext.form.DateField({ applyTo: 'df', timePicker: true }); // 渲染文本域 var ta = new Ext.form.TextArea({ applyTo: 'ta' }); var btn = new Ext.Button({ applyTo: 'btn', text: '提交' }); userForm.add(tf); userForm.add(df); userForm.add(cb); // 覆写日历 Date.dayNames = ["日", "一", "二", "三", "四", "五", "六"]; if (Ext.DatePicker) { Ext.apply(Ext.DatePicker.prototype, { todayText: "今天", minText: "日期在最小日期之前", maxText: "日期在最大日期之后", disabledDaysText: "", disabledDatesText: "", monthNames: Date.monthNames, dayNames: Date.dayNames, nextText: '下月 (Control+Right)', prevText: '上月 (Control+Left)', monthYearText: '选择一个月 (Control+Up/Down 来改变年)', todayTip: "{0} (Spacebar)", okText: "确定", cancelText: "取消", format: "y年m月d日" }); }
});</script>