DevExpress在ClientSide中获取ASPxComboBox的选定值

Question

我有一个ASPxGridview，其中包含一个带有ASPxComboBox的字段，我想获取ASPxComboBox的选定值并将其显示在标签中。 在下面的代码中，我只是将值存储在alert（）消息中。 但是，我得到的只是一个“空”值。有人知道如何解决我的问题吗？ 非常感谢。

这是我到目前为止的

<dx:ASPxGridView ID="ASPxGridView2" OnRowDataBound="ASPxGridView2_RowDataBound" ClientInstanceName="grid" runat="server" AutoGenerateColumns="False" DataSourceID="fordtl" KeyFieldName = "chndtl_no">

<dx:GridViewDataTextColumn FieldName="product" Name="dd_product" ShowInCustomizationForm="true" VisibleIndex="7">
<SettingsHeaderFilter>
<DateRangePickerSettings EditFormatString="" />
</SettingsHeaderFilter>
<EditItemTemplate>
<dx:ASPxComboBox ID="ASPxComboBoxProduct" runat="server" ClientInstanceName="avery" AutoPostBack="true" DataSourceID="Product" EnableCallbackMode="true" TextField="pd_product">
<ClientSideEvents SelectedIndexChanged="function(s, e) { OnProductChanged(s);}"></ClientSideEvents>
</dx:ASPxComboBox>
</EditItemTemplate>
</dx:GridViewDataTextColumn>

</dx:ASPxGridView>

JavaScript的

function OnProductChanged(s, e) {
   var getProduct = document.getElementById("ASPxComboBoxProduct");
   alert(getProduct);
}

Answer 1

替换为您的aspx代码-

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

从此处替换您的javascript函数并进行检查。

function OnProductChanged(e, s)
{
      var selectedValue = e.lastSuccessValue;
      alert(selectedValue);
}

Answer 2

将您的SelectedIndexChanged JS处理程序更改为此：

function OnProductChanged(s, e) {
   var getProduct = s.GetValue();
   alert(getProduct);
}

但是，如果要使用新选择的数据来更改存储在其他位置的标签，您怎么知道组合框值针对哪个特定的网格行进行了更改？

如果这是您的要求，请发表评论，因为DX可以处理这种情况。

更新：为了能够区分来自EditItemTemplate的组合框已更改索引的哪一行，您需要为每个此类组合框分配一个唯一的ClientInstanceName。 此ClientInstanceName应该包含行索引部分，例如： avery_01 。

为此，您需要处理所显示的每个EACH组合框的OnInit事件，并在其中分配ClientInstanceName，例如，如下所示：

...
<EditItemTemplate>
    <dx:ASPxComboBox ID="ASPxComboBoxProduct" runat="server" 
       OnInit="ASPxComboBoxProduct_Init" AutoPostBack="true" DataSourceID="Product" 
       EnableCallbackMode="true" TextField="pd_product">
    </dx:ASPxComboBox>
</EditItemTemplate>
...

注意我删除了ClientInstanceName属性和ClientSideEvents元素。

对于放置在ASPxGridView DataItemTemplate中的ASPxLabel，应该执行相同的操作：

...
<dx:GridViewDataColumn Caption="Label Column Caption">
<DataItemTemplate>
   <ASPxLabel ID="ASPxLabel" runat="server" OnInit="ASPxLabel_Init" />
</DataItemTemplate>
</dx:GridViewDataColumn>
...

然后在代码后面添加：

// Handle OnInit for each combobox being displayed
protected void ASPxComboBoxProduct_Init(object sender, EventArgs e) 
{     
    ASPxComboBox dvxCombo = (ASPxComboBox)sender;
    GridViewDetailRowTemplateContainer templateContainer =
                   (GridViewDetailRowTemplateContainer)ASPxGridView2.NamingContainer;
    dvxCombo.ClientInstanceName = string.Format("avery_{0}",
                                             templateContainer.VisibleIndex);

    // below client instance name should set for the relevant label in the labels 
    //own OnInit handler below
    string targetLabelClientInstanceName = string.Format("label_{0}",
                                             templateContainer.VisibleIndex);
    // Note, we're passing the ASPxLabel's ClientInstanceName as a third
    // param to the SelectedIndexChanged event handler.
    dvxCombo.ClientSideEvents.SelectedIndexChanged = 
        string.Format("function(s, e) {{ OnProductChanged(s, e, {0}); }}",
        targetLabelClientInstanceName);        
}


// Handle OnInit for each ASPxLabel which you will be updating with the
// selected combobox value
protected void ASPxLabel_Init(object sender, EventArgs e) 
{
    ASPxLabel dvxLabel = (ASPxLabel)sender;
    GridViewDetailRowTemplateContainer templateContainer =
                   (GridViewDetailRowTemplateContainer)ASPxGridView2.NamingContainer;
    dvxLabel.ClientInstanceName = string.Format("label_{0}",
                                             templateContainer.VisibleIndex);    
}

然后像这样更新您的JavaScript处理程序：

function OnProductChanged(s, e, label) {
   var getProduct = s.GetValue();
   alert(getProduct);

   label.SetText(getProduct);
}

请注意， label上方不仅是字符串或jQuery对象，它还是ASPxLabel的真正DevExpress客户端对象，该对象在与当前组合框相同的行的另一网格列中定义，此事件将针对该对象进行处理。 因此，它应该使用所有DX客户端方法，例如SetText（）和GetText。

因此，以上方法已被验证可以工作。 请注意，我直接输入的所有代码段都未经编译。 但是我相信您应该能够将它们粘合在一起。

类似情况：

1. 检查aspxgridview主详细信息是否在客户端中检查了任何行

2. https://www.devexpress.com/Support/Center/Question/Details/Q372498

HTH

Answer 3

标签会在组合框更改事件时更新，但在回发时将丢失其值。 避免回传组合框索引更改，否则标签将根据需要进行更新。

AutoPostBack="false"