ExtJS 3.0.0 设置ComboBox级联默认值教程

"这篇文档介绍了如何在ExtJS中为级联菜单设置默认值，主要针对Ext JS Library 3.0.0版本。文章通过实例展示了遇到的问题和解决方案，特别是对于ComboBox这种复杂控件的处理方法。" 在ExtJS中，为普通的输入控件如文本框赋值确实非常简单，只需要一行代码就能完成。然而，对于更复杂的控件，比如ComboBox（级联下拉菜单），情况就有所不同。ComboBox通常用于表示两个或多个关联的数据集合，例如省份和城市，当选择一个省份时，城市列表会根据所选省份动态更新。 在问题描述部分，作者给出了一个截图和相关的前端代码，展示了ComboBox的配置。代码中定义了两个数据存储（Store）对象，分别用于省份（Provinces）和城市（Citys），这些Store通过HttpProxy与服务器进行交互，获取JSON数据。JsonReader用于解析返回的JSON数据，提取出`Id`和`Name`字段。 在ExtJS中，ComboBox的`select`事件被监听，当用户在一级菜单（province）中选择一个省份时，会触发这个事件。在事件处理器中，首先清空二级菜单（city）的选项，然后根据所选省份的`Id`，更新二级菜单的Proxy URL，以加载对应省份的城市数据。这里使用`setRawValue`清空已有的值，以便重新加载数据。然后，通过改变`store2`的Proxy的URL来动态获取新的城市列表。 设置ComboBox的默认值通常涉及到在页面加载时或在用户操作后手动设置值。对于远程模式（remote mode）的ComboBox，这意味着不仅要设置显示的文本（通过`setRawValue`或`setValue`），还需要确保相应的数据项已经被加载到Store中。如果在页面加载时已经知道默认值，可以在初始化ComboBox时预先加载数据，或者在ComboBox的配置中指定`value`属性。 总结来说，设置ExtJS中的级联菜单（ComboBox）的默认值需要考虑以下几个关键点： 1. 创建对应的Store和Proxy来获取数据。 2. 使用JsonReader解析返回的JSON数据。 3. 监听ComboBox的`select`事件以处理级联关系。 4. 清空子级ComboBox并更新其Proxy以加载新数据。 5. 使用`setRawValue`或`setValue`设置显示的默认值，并确保对应的数据项已加载到Store。 理解以上步骤，开发者就能有效地在ExtJS中为级联菜单设置默认值，实现动态的数据交互和呈现。