如何在ASPxGridView中实现两列GridViewDataComboBoxColumn下拉联动过滤

实现逻辑说明 #

你需要的级联联动效果可以通过「客户端选中事件触发局部回调 + 服务端动态过滤数据源」的方式实现，无需全页刷新，具体实现步骤如下：

步骤1：修改前端ASPX代码 #

给两个组合框列补充必要的属性和事件绑定：

<dx:ASPxGridView runat="server" ClientInstanceName="grid" AutoGenerateColumns="False" ID="ASPxGridView1" DataSourceID="DSEXTagList" OnCellEditorInitialize="GridViewEXTags_CellEditorInitialize" KeyFieldName="ID;" OnRowInserting="GridViewEXTags_RowInserting" Width="100%">
    <Columns>
        <dx:GridViewDataComboBoxColumn Caption="System" FieldName="System" VisibleIndex="1">
            <PropertiesComboBox EnableCallbackMode="true" DataSourceID="DsSystem" TextField="SystemWithDescription" ValueField="System" NullDisplayText="Select System">
                <!-- 补充System下拉的客户端选中事件 -->
                <ClientSideEvents SelectedIndexChanged="onSystemSelected" />
            </PropertiesComboBox>
        </dx:GridViewDataComboBoxColumn>
        <dx:GridViewDataComboBoxColumn Caption="Sub System" FieldName="SubSystem" VisibleIndex="2">
            <PropertiesComboBox EnableCallbackMode="true" DataSourceID="DsSubSystem" TextField="SubSystemWithDescription" ValueField="SubSystem" NullDisplayText="Select Sub System" OnCallback="SubSystem_OnCallback">
            </PropertiesComboBox>
        </dx:GridViewDataComboBoxColumn>
    </Columns>
</dx:ASPxGridView>

• 补充说明：给SubSystem列的组合框新增了OnCallback服务端回调事件，给System列的组合框新增了客户端选中事件绑定。

步骤2：添加客户端JS逻辑 #

function onSystemSelected(s, e) {
    // 获取当前编辑行的行号
    let editRowIndex = grid.GetEditRowIndex();
    // 获取当前行的SubSystem下拉编辑器实例
    let subSystemEditor = grid.GetEditor("SubSystem", editRowIndex);
    // 触发SubSystem的局部回调，把选中的System值作为参数传递
    subSystemEditor.PerformCallback(s.GetValue());
}

步骤3：补充服务端C#逻辑 #

首先处理CellEditorInitialize事件，确保编辑行初始化时SubSystem的数据源已经根据当前选中的System过滤：

protected void GridViewEXTags_CellEditorInitialize(object sender, ASPxGridViewEditorEventArgs e)
{
    if (e.Column.FieldName == "SubSystem")
    {
        // 读取当前行已选中的System值
        string currentSystem = e.GetValue("System")?.ToString();
        if (!string.IsNullOrEmpty(currentSystem))
        {
            // 动态修改SubSystem数据源的查询条件
            DsSubSystem.SelectCommand = "SELECT SubSystem, SubSystemWithDescription FROM 你的子系统表名 WHERE System = @System";
            DsSubSystem.SelectParameters.Clear();
            DsSubSystem.SelectParameters.Add("System", currentSystem);
            
            // 重新绑定下拉数据
            var subCombo = e.Editor as ASPxComboBox;
            subCombo.DataBind();
        }
    }
}

然后处理SubSystem的回调事件，接收前端传过来的System值动态过滤数据源：

protected void SubSystem_OnCallback(object source, CallbackEventArgs e)
{
    string selectedSystem = e.Parameter?.ToString();
    if (!string.IsNullOrEmpty(selectedSystem))
    {
        // 按选中的System过滤子系统数据
        DsSubSystem.SelectCommand = "SELECT SubSystem, SubSystemWithDescription FROM 你的子系统表名 WHERE System = @System";
        DsSubSystem.SelectParameters.Clear();
        DsSubSystem.SelectParameters.Add("System", selectedSystem);
        
        var subCombo = source as ASPxComboBox;
        subCombo.DataBind();
    }
    e.Result = string.Empty;
}

注意事项 #

• 将代码中的你的子系统表名替换为实际存储SubSystem数据的数据库表名
• 如果已经在控件属性中配置了DsSubSystem的默认查询语句，只需要保留参数修改和绑定逻辑即可
• 新增行未选择System时，SubSystem会保持空选项状态，符合常规交互逻辑

内容的提问来源于stack exchange，提问作者Rakesh