本篇介绍如何在客户端绑定数据到Ext.form.ComboBox,并支持手写和联想功能,还提供了显示提示消息的功能.

效果图如下:

代码较为简单,不涉及到后台处理:

<form id="form1" runat="server">

    <div><div id="hello"></div>     <script type="text/javascript">         //静态绑定数据     function ready()     {         Ext.namespace('Ext.exampledata');         Ext.exampledata.states =          [                 ['1', '中国', 'The Sunshine State'],                 ['2', '美国', 'The Peach State'],                 ['3', '俄罗斯', 'The Aloha State'],                 ['4', '德国', 'Famous Potatoes'],                 ['5', '英国', 'The Prairie State'],                 ['6', '法国', 'The Hospitality State'],                 ['7', '加拿大', 'The Corn State'],                 ['8', '澳大利亚', 'The Sunflower State'],                 ['9', '老挝', 'The Bluegrass State'],                 ['10', '泰国', 'The Bayou State'],                 ['11', '印度', 'The Pine Tree State'],                 ['12', '日本', 'Chesapeake State']         ];         Ext.QuickTips.init();                  var store = new Ext.data.SimpleStore         ({             fields:["name","value","state"],             data:Ext.exampledata.states         });                  var comboBox = new Ext.form.ComboBox         ({                  tpl: '<tpl for="."><div ext:qtip="提示：{name}__{value}__{state}__" class="x-combo-list-item">****{value}*****</div></tpl>',             id:"ComboBox_ID",             editable:true,//默认为true，false为禁止手写和联想功能             store:store,             emptyText:'请选择',             mode: 'local',//指定数据加载方式，如果直接从客户端加载则为local，如果从服务器断加载 则为remote.默认值为：remote             typeAhead: true,             triggerAction: 'all',             valueField:'name',               displayField:'value',             selectOnFocus:true,             renderTo:'hello',             width:200,             frame:true,             resizable:true         });              }     Ext.onReady(ready);     </script>     </div>     </form>

本文转自温景良博客园博客，原文链接：http://www.cnblogs.com/wenjl520/archive/2008/11/03/1325694.html，如需转载请自行联系原作者