7、ExtJs2.0学习.docVIP

7、ExtJs2.0学习系列(6)--Ext.FormPanel之第三式(ComboBox篇) 已有 1082 次阅读? 2009-06-15 16:30  上篇中我们讨论了下fieldset和表单验证的知识，今天我们接着深入解析表单元素中ComboBox组件的使用。会涉及到.net简单服务器数据交互，但暂不做深入讨论，以后会详细分析服务器交互相关，不过可能要等较长一段时间，呵呵！5.服务器数据作为ComboBox的数据源实例首先从服务器获取json数据： //cs后台代码，简单起见，示例而已，要主要字符串格式(新手注意，下面的代码放在类里面，不是放在方法里)public?string??ServerData=[湖北,江西,安徽]; ? //aspx前台js介绍代码?Ext.onReady(function(){???????var?combo=new?Ext.form.ComboBox({????????????store:%=ServerData%,//获取ServerData的string值，不要用引起来，否则就不是object数据，而是字符串，这是一个很巧妙的关键点：把服务器的字符串转化为js的object数据，是不是超级方便。????????????emptyText:请选择一个省份....,????????????applyTo:?combo????????});????}); ? //aspx前台html代码input?type=text?id=combo?size=20/ 我们就通过%=ServerData%这样的方式获取到了服务器最简单的属性数据。问题来了，js和html怎么调用c#后台的变量和方法？（变量的调用上面刚刚介绍）6.js和html怎么调用c#后台的变量和方法关于这个话题，我不多说，网上很多讲解，在此仅简单说明1.js调用c#后台变量，参考上面，注意，如果想获取string类型，请在js里用引号 var str=%=ServerData%(返回[湖北,江西,安徽])2.js调用c#后台方法： !--后台有一个方法：public?string?ServerData()????{????????return?fdfdfdfdsf;????}前台代码：--input?id=Text2?type=text?value=%=ServerData()%/ 3.js调用c#后台带参数的方法 !--public?string?ServerData(string?pram)????{????????return?pram+，我是参数传进来的;????}主要是处理好js的引号问题，多尝试就会正确--scriptalert(%=ServerData(谦虚的天下)?%);/script 好了，现在我们有了js获取后台数据的方法手段，不怕不怕啦，不过，这只是一小步。7.ComboBox的数据源store格式详解在前面的例子里面，我们一直给ComboBox的数据源store赋值一维数组，其实store支持多维和Store.data.Store类型。 //下面就几种数据以代码举例说明1.一维数组：[江西,湖北]，值同时赋给ComboBox的value和text2.二维和多维数组：[[one,bbar,111],[two,tbar,222]],第一维和第二维分别赋值给value和text，其他维忽略3.store类型：包括GroupingStore,?JsonStore,?SimpleStore.????//我们分三步走：?????//第一步：提供数据：???????? var?data=[[湖北,hubei],[江西,jiangxi],[安徽,anhui]];????//第二步：导入到store中：?????????var?store?=?new?Ext.data.SimpleStore({?????????????fields:?[chinese,?english],?????????????data?:?data????????});?????//第三步?:把store托付给comboBox的store????var?combo?=?new?Ext.form.ComboBox({????????store:?store,????????displayField:english,//store字段中你要显示的字段，多字段必选参数，默认当mode为remote时displayField为undefine，当select列表时displayField为text????????mode:?local,//因为data已经取数据到本