DevExpress Cascading Combobox GridView DataBind

时间:2018-04-10 13:53:58

标签: c# gridview combobox devexpress cascading

我的GridView包含TextField BenefitNamestring)和ValueField BenefitInfoKeySKint })。

最初我直接将datasource绑定到combobox,并且具有不同的TextFieldValueField值。 (代码示例2)

我更新了我的代码以创建'级联'组合框和TextField值不再显示在我的GridView中,但会在我的编辑表单中显示在comboBox内。

  

为什么TextField在我的combobox编辑表单GridView中呈现但

PartialView CodeSample 1 (级联组合框)

    settings.Columns.Add(column =>
    {
        column.FieldName = "BenefitKey";
        column.Name = "BenefitKey";
        column.Caption = "Claim Type";
        column.Width = 200;
        column.Settings.AllowHeaderFilter = DefaultBoolean.False;
        column.EditFormSettings.Visible = DefaultBoolean.True;
        column.Settings.AllowSort = DefaultBoolean.False;
        column.EditorProperties().ComboBox(p =>
        {
            p.CallbackRouteValues = new { Controller = "BenefitClaimDetails", Action = "GetBenefitTypes", TextField = "BenefitName", ValueField = "BenefitInfoKeySK", headerEmployeeID = Model.BenefitHeaderEmployee };
            p.TextField = "BenefitName";
            p.ValueField = "BenefitInfoKeySK";
            p.ClientSideEvents.BeginCallback = "ClaimTypeComboBox_BeginCallback";
            p.EnableCallbackMode = true;
            p.Width = 200;
            p.ValidationSettings.RequiredField.IsRequired = true;
            p.ValidationSettings.RequiredField.ErrorText = "Claim Type cannot be blank";
            p.ValidationSettings.ErrorDisplayMode = ErrorDisplayMode.ImageWithText;
        });
    });

PartialView代码示例2 (基本组合框)

    settings.Columns.Add(column =>
    {
        column.FieldName = "BenefitKey";
        column.Name = "BenefitKey";
        column.Caption = "Claim Type";
        column.Width = 200;
        column.Settings.AllowHeaderFilter = DefaultBoolean.False;
        column.EditFormSettings.Visible = DefaultBoolean.True;
        column.Settings.AllowSort = DefaultBoolean.False;

        column.ColumnType = MVCxGridViewColumnType.ComboBox;
        var comboBoxProperties = column.PropertiesEdit as ComboBoxProperties;
        comboBoxProperties.Width = 200;
        comboBoxProperties.DataSource = repository.GetBenefitListByEmployee(Model.BenefitHeaderEmployee);
        comboBoxProperties.TextField = "BenefitName";
        comboBoxProperties.ValueField = "BenefitInfoKeySK";
        comboBoxProperties.DropDownRows = 15;
        comboBoxProperties.ValueType = typeof(int);
        comboBoxProperties.ValidationSettings.RequiredField.IsRequired = true;
        comboBoxProperties.ValidationSettings.RequiredField.ErrorText = "Claim Type cannot be blank";
        comboBoxProperties.ValidationSettings.ErrorDisplayMode = ErrorDisplayMode.ImageWithText;
    });

我发现代码示例1中的p.TextFieldp.ValueField什么都不做。可以删除它们而不影响代码。但是,我必须在CallBackRoute中传递这些字段,并在控制器代码中分配它们:

控制器代码

    public ActionResult GetBenefitTypes(int claimantID, string textField, string valueField, string headerEmployeeID)
    {
        return GridViewExtension.GetComboBoxCallbackResult(p => {
            p.TextField = textField;
            p.ValueField = valueField;
            p.BindList(repository.GetBenefitListByEmployee(claimantID, headerEmployeeID));
        });
    }

正如您所看到的,最后两种技术都使用相同的Repository方法。如果我能详细说明,请告诉我。

修改

我还尝试通过添加columnType值并分配数据源来修改代码示例1,如下所示。这已在TextField上成功显示GridView,但我为null传递的claimantID阻止了编辑器组合框显示任何值。出于这个原因,我还包括JS代码,我指定claimantID

修改后的PartialView代码示例1 (工作网格视图,组合框中没有值)

    settings.Columns.Add(column =>
    {
        column.FieldName = "BenefitKey";
        column.Name = "BenefitKey";
        column.Caption = "Claim Type";
        column.Width = 200;
        column.Settings.AllowHeaderFilter = DefaultBoolean.False;
        column.EditFormSettings.Visible = DefaultBoolean.True;
        column.Settings.AllowSort = DefaultBoolean.False;
        column.EditorProperties().ComboBox(p =>
        {
            p.CallbackRouteValues = new { Controller = "BenefitClaimDetails", Action = "GetBenefitTypes", TextField = "BenefitName", ValueField = "BenefitInfoKeySK", headerEmployeeID = Model.BenefitHeaderEmployee };
            p.TextField = "BenefitName";
            p.ValueField = "BenefitInfoKeySK";
            p.ClientSideEvents.BeginCallback = "ClaimTypeComboBox_BeginCallback";
            p.EnableCallbackMode = true;
            p.Width = 200;
            p.ValidationSettings.RequiredField.IsRequired = true;
            p.ValidationSettings.RequiredField.ErrorText = "Claim Type cannot be blank";
            p.ValidationSettings.ErrorDisplayMode = ErrorDisplayMode.ImageWithText;
        });

        column.ColumnType = MVCxGridViewColumnType.ComboBox;
        var comboBoxProperties = column.PropertiesEdit as ComboBoxProperties;
        comboBoxProperties.DataSource = repository.GetBenefitListByEmployee(Model.BenefitHeaderEmployee, null);
        comboBoxProperties.TextField = "BenefitName";
        comboBoxProperties.ValueField = "BenefitInfoKeySK";
    });

JS代码

@*The follwing functions handle the Cascading Benefit Type combobox*@
function OnSelectedClaimantChanged() {
    BenefitClaimDetailsGridView.GetEditor("BenefitKey").PerformCallback();
}
function ClaimTypeComboBox_BeginCallback(s, e) {
    e.customArgs["claimantID"] = BenefitClaimDetailsGridView.GetEditor("DependentKey").GetValue();
}

我很抱歉包含这么多代码而不是工作项目,但解决方案非常庞大。我希望这样做。

1 个答案:

答案 0 :(得分:0)

我找到了解决方案。

我开始逐行评论comboBoxProperties部分,以了解回调将在什么时候开始失败,并且由于我的声明我发现它失败了:column.ColumnType = MVCxGridViewColumnType.ComboBox;

在查看EditorProperties.Combobox()的工作原理之后,我意识到在该部分代码中,ComboBox正在使用标准MVCxColumnComboBoxProperties而不是DevExpress GridView ComboBox

  

我认为问题在于,在回调中,我是以一种方式声明列类型,然后使用我的comboBoxProperties代码覆盖它。   我所做的改变正在改变   var comboBoxProperties = column.PropertiesEdit as ComboBoxProperties;   到

     

var comboBoxProperties = column.PropertiesEdit as MVCxColumnComboBoxProperties;

最终的工作代码在这里。对于试图将它们组合在一起的人:为了实现显示文本但存储有不同值的级联组合框,您将需要以下内容。

  1. 在您的局部视图中,给出了“发起人”#39;列a SelectedIndexChanged事件,例如:

    settings.Columns.Add(column =>
    {
        column.FieldName = "DependentKey";
        column.Name = "DependentKey";
        column.Caption = "Claimant";
        column.Width = 300;
        column.Settings.AllowHeaderFilter = DefaultBoolean.False;
        column.EditFormSettings.Visible = DefaultBoolean.True;
        column.Settings.AllowSort = DefaultBoolean.False;
    
        column.ColumnType = MVCxGridViewColumnType.ComboBox;
        var comboBoxProperties = column.PropertiesEdit as ComboBoxProperties;
        /*Get an employee model for the current employee and pass that to the Depoendents method to get their list of dependents*/
        comboBoxProperties.DataSource = repository.GetDependentDropdownList(repository.GetCurrentEmployee(employeeID: Model.BenefitHeaderEmployee).DimEmployee);
        comboBoxProperties.TextField = "DependentName";
        comboBoxProperties.ValueField = "DependentKeySK";
        comboBoxProperties.DropDownRows = 15;
        comboBoxProperties.ValueType = typeof(int);
        comboBoxProperties.ValidationSettings.RequiredField.IsRequired = true;
        comboBoxProperties.ValidationSettings.RequiredField.ErrorText = "Claimant cannot be blank";
        comboBoxProperties.ValidationSettings.ErrorDisplayMode = ErrorDisplayMode.ImageWithText;
        comboBoxProperties.ClientSideEvents.SelectedIndexChanged = "OnSelectedClaimantChanged";
    });
    
  2. 在要受影响的列中,您需要声明它(这是我的代码示例1 /代码示例2的最终版本):

    settings.Columns.Add(column =>
    {
        column.FieldName = "BenefitKey";
        column.Name = "BenefitKey";
        column.Caption = "Claim Type";
        column.Width = 200;
        column.Settings.AllowHeaderFilter = DefaultBoolean.False;
        column.EditFormSettings.Visible = DefaultBoolean.True;
        column.Settings.AllowSort = DefaultBoolean.False;
        column.EditorProperties().ComboBox(p =>
        {   /*Populate the combobox with valid values based on the selected dependentKey*/
            p.CallbackRouteValues = new { Controller = "BenefitClaimDetails", Action = "GetBenefitTypes", TextField = "BenefitName", ValueField = "BenefitInfoKeySK", headerEmployeeID = Model.BenefitHeaderEmployee };
            p.ClientSideEvents.BeginCallback = "ClaimTypeComboBox_BeginCallback";
            p.Width = 200;
            p.ValidationSettings.RequiredField.IsRequired = true;
            p.ValidationSettings.RequiredField.ErrorText = "Claim Type cannot be blank";
            p.ValidationSettings.ErrorDisplayMode = ErrorDisplayMode.ImageWithText;
        });
    
        /*Display the BenefitName in the gridView. The Callback method TextField and ValueField only influence the comboBox in the Editor window*/
        var comboBoxProperties = column.PropertiesEdit as MVCxColumnComboBoxProperties;
        comboBoxProperties.Width = 200;
        comboBoxProperties.DataSource = repository.GetBenefitListByEmployee(Model.BenefitHeaderEmployee);
        comboBoxProperties.TextField = "BenefitName";
        comboBoxProperties.ValueField = "BenefitInfoKeySK";
    });
    
  3. JS页面上创建Index代码 - 我的代码在上面

  4. 在控制器中创建ActionResult - 我的代码在

  5. 之上

    使用这4个部分,您可以级联组合框并在网格中正确显示它们