编辑模式下的 ASPXGridView 级联输入控件答案

【问题标题】：ASPXGridView cascading input controls on edit mode编辑模式下的 ASPXGridView 级联输入控件
【发布时间】：2015-05-03 17:19:41
【问题描述】：

我的ASPxGridView 用于输入电话号码的数据。我有一个ComboBox 用于获取号码的“类型”（电话、手机、传真等）。

我还有一个TextBox 来获取实际号码。我需要将TextBox 的NullText 设置为示例电话或手机号码，具体取决于ComboBox 的选定值。

如果我必须按照ComboBox 中的说明填写另一个ComboBox，这将很容易，如this demo 中所述。

但是TextBox 没有CallBack，我可以在那里做我需要的事情。

我的ASPX代码：

<dx:ASPxGridView ID="gridPhones" runat="server"     ClientInstanceName="gridPhones" EnableRowsCache="false" 
                            AutoGenerateColumns="false" KeyFieldName="TemporaryId" Width="100%"
                            EnableCallBacks="True"
                            OnRowDeleting="gridPhones_RowDeleting"
                            OnRowInserting="gridPhones_RowInserting" 
                            OnRowUpdating="gridPhones_RowUpdating"
                            OnCellEditorInitialize="gridPhones_CellEditorInitialize">
  <Columns>
      <dx:GridViewCommandColumn Visible="true">
          <EditButton Visible="true"></EditButton>
          <UpdateButton Visible="true"></UpdateButton>
          <CancelButton Visible="true"></CancelButton>
      </dx:GridViewCommandColumn>
      <dx:GridViewDataCheckColumn FieldName="IsMain">
          <EditFormSettings Visible="True" VisibleIndex="1"></EditFormSettings>
      </dx:GridViewDataCheckColumn>
      <dx:GridViewDataTextColumn FieldName="TypeTitle">
          <EditFormSettings Visible="False"></EditFormSettings>
      </dx:GridViewDataTextColumn>
      <dx:GridViewDataComboBoxColumn FieldName="Type" Visible="False">
          <EditFormSettings Visible="True" VisibleIndex="2"></EditFormSettings>
          <PropertiesComboBox ClientInstanceName="cbPhoneType">
              <ValidationSettings Display="Dynamic" ErrorDisplayMode="Text">
              </ValidationSettings>                                            
          </PropertiesComboBox>
      </dx:GridViewDataComboBoxColumn>
      <dx:GridViewDataTextColumn FieldName="CountryCode">
          <EditFormSettings Visible="True" VisibleIndex="3">          </EditFormSettings>
      </dx:GridViewDataTextColumn>
      <dx:GridViewDataTextColumn FieldName="CityCode">
          <EditFormSettings Visible="True" VisibleIndex="4"></EditFormSettings>
      </dx:GridViewDataTextColumn>
      <dx:GridViewDataTextColumn FieldName="Phone">
          <EditFormSettings Visible="True" VisibleIndex="5">                                        </EditFormSettings>
      </dx:GridViewDataTextColumn>
    </Columns>
    <SettingsEditing Mode="EditForm"  EditFormColumnCount="5" />
    <SettingsBehavior AllowFocusedRow="True" />
</dx:ASPxGridView>

我的C# 代码：

protected void gridPhones_RowDeleting(object sender, ASPxDataDeletingEventArgs e) {...}

protected void gridPhones_RowInserting(object sender, ASPxDataInsertingEventArgs e) {...}

protected void gridPhones_RowUpdating(object sender, ASPxDataUpdatingEventArgs e) {...}

protected void gridPhones_CellEditorInitialize(object sender, ASPxGridViewEditorEventArgs e)
{
    var grid = sender as ASPxGridView;

    if (!grid.IsEditing)    
        return;

    if (e.Column.FieldName == "Type")
    {
        var combo = e.Editor as ASPxComboBox;
        combo.Font.Name = "Tahoma";
        if (combo.Items.Count == 0)
        {
            var types = LookupManager.Instance.GetAllByEnum<PhoneType>();
            combo.DataSource = types.OrderByDescending(p => p.Value);
            combo.TextField = "Title";
            combo.ValueField = "Value";
            combo.DataBind();
        }
    }
    else if (e.Column.FieldName == "CountryCode")
    {
        var txt = e.Editor as ASPxTextBox;
        txt.NullText = @"0098";
    }
    else if (e.Column.FieldName == "CityCode")
    {
        var txt = e.Editor as ASPxTextBox;
        txt.NullText = @"021";
    }
    else if (e.Column.FieldName == "Phone")
    {
        var txt = e.Editor as ASPxTextBox;
        txt.NullText = @"81022000";        //This is my conditional nulltext
        if (e.KeyValue == null)
            return;

        var val = grid.GetRowValuesByKeyValue(e.KeyValue, "Type").ToString();
        if (!string.IsNullOrEmpty(val) && val.ToInt32(0) == (int)(PhoneType.Mobile))
            txt.NullText = @"09126994040"; //This is my conditional nulltext
    }
}

【问题讨论】：

标签： c# asp.net callback devexpress aspxgridview

【解决方案1】：

使用建议here 我能够在客户端设置NullText 如下：

在我的 PhoneType ComboBox 的 PropertiesTextEdit 中添加客户端事件：

<ClientSideEvents SelectedIndexChanged="function(s, e) { OnPhoneTypeChanged(s); }" />

并在下面添加Javascript：

function OnPhoneTypeChanged(cbPhoneType) {
    if (cbPhoneType.GetValue().toString() == '2') {
        txtPhone.nullText = "09121111111";
        if (txtPhone.GetValue() == null)
            txtPhone.SetValue(null);
    } 
    else {
        txtPhone.nullText = "81022000";
        if(txtPhone.GetValue() == null)
            txtPhone.SetValue(null);
    }
}

【讨论】：