ASPxClientEdit.ValueChanged Event
Fires after the editor’s value has been changed by end-user interactions.
Declaration
ValueChanged: ASPxClientEvent<ASPxClientProcessingModeEventHandler<ASPxClientEdit>>
Event Data
| Property |
Description |
| processOnServer |
Specifies whether or not to process the event on the server.
|
Handle the ValueChanged event to respond to an editor’s value being changed on the client side.
Important
By design, the ValueChanged event is raised only in response to end-user actions.
Note
- For the ASPxClientGridLookup class, the processOnServer property is not in effect. When the ValueChanged event occurs, a callback is sent to the server regardless of the processOnServer property values.
- If a combo box is located inside a grid view (GridViewDataComboBoxColumn), the ValueChanged event is not in effect.
Example
In some cases, when the default filter row editor’s functionality is not enough, you can provide custom filter cell content using the GridViewColumn.FilterTemplate.
In this example, a default cell editor is replaced with the ASPxGridLookup control. The control’s ASPxClientEdit.ValueChanged client-side event is used to send a callback to the server side, invoking the grid’s ASPxGridView.CustomCallback event. In the event handler, a filter criteria is created and applied to the grid using the ASPxGridView.ApplyFilterToColumn method.
using DevExpress.Data.Filtering;
using DevExpress.Web.ASPxGridLookup;
using DevExpress.Web.ASPxGridView;
public partial class _Default : System.Web.UI.Page {
protected void Grid_CustomCallback(object sender, ASPxGridViewCustomCallbackEventArgs e) {
if(e.Parameters == "FilterByCategories") {
var column = Grid.DataColumns["CategoryName"];
var lookup = Grid.FindFilterCellTemplateControl(column, "Lookup") as ASPxGridLookup;
if(lookup != null)
Grid.ApplyFilterToColumn(column, CreateCriteria(lookup, column.FieldName));
}
}
protected CriteriaOperator CreateCriteria(ASPxGridLookup gridLookup, string fieldName) {
var values = gridLookup.GridView.GetSelectedFieldValues(fieldName);
return values.Count > 0 ? new InOperator(fieldName, values) : null;
}
}
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ Register Assembly="DevExpress.Web.v13.1" Namespace="DevExpress.Web.ASPxGridView" TagPrefix="dx" %>
<%@ Register Assembly="DevExpress.Web.v13.1" Namespace="DevExpress.Web.ASPxEditors" TagPrefix="dx" %>
<%@ Register Assembly="DevExpress.Web.v13.1" Namespace="DevExpress.Web.ASPxGridLookup" TagPrefix="dx" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript">
function Lookup_ValueChanged(s, e) {
grid.PerformCallback("FilterByCategories");
}
</script>
</head>
<body>
<form id="form1" runat="server">
<dx:ASPxGridView runat="server" ID="Grid" AutoGenerateColumns="False" DataSourceID="ProductsDataSource" ClientInstanceName="grid"
OnCustomCallback="Grid_CustomCallback" EnableViewState="false">
<Columns>
<dx:GridViewDataTextColumn FieldName="CategoryName">
<FilterTemplate>
<dx:ASPxGridLookup runat="server" ID="Lookup" AutoGenerateColumns="False" DataSourceID="CategoriesDataSource" KeyFieldName="CategoryID"
SelectionMode="Multiple" TextFormatString="{0}" >
<Columns>
<dx:GridViewCommandColumn ShowSelectCheckbox="true" />
<dx:GridViewDataTextColumn FieldName="CategoryName" />
<dx:GridViewDataBinaryImageColumn FieldName="Picture">
<PropertiesBinaryImage ImageWidth="48" />
</dx:GridViewDataBinaryImageColumn>
</Columns>
<ClientSideEvents ValueChanged="Lookup_ValueChanged" />
</dx:ASPxGridLookup>
</FilterTemplate>
</dx:GridViewDataTextColumn>
<dx:GridViewDataTextColumn FieldName="ProductName" />
<dx:GridViewDataTextColumn FieldName="ProductSales" />
<dx:GridViewDataDateColumn FieldName="ShippedDate" />
</Columns>
<Settings ShowFilterRow="true" />
</dx:ASPxGridView>
<asp:AccessDataSource ID="ProductsDataSource" runat="server" DataFile="~/App_Data/nwind.mdb"
SelectCommand="SELECT * FROM [ProductReports]" />
<asp:AccessDataSource ID="CategoriesDataSource" runat="server" DataFile="~/App_Data/nwind.mdb"
SelectCommand="SELECT * FROM [Categories]" />
</form>
</body>
</html>
<%@ Page Language="vb" AutoEventWireup="true" CodeFile="Default.aspx.vb" Inherits="_Default" %>
<%@ Register Assembly="DevExpress.Web.v13.1" Namespace="DevExpress.Web.ASPxGridView" TagPrefix="dx" %>
<%@ Register Assembly="DevExpress.Web.v13.1" Namespace="DevExpress.Web.ASPxEditors" TagPrefix="dx" %>
<%@ Register Assembly="DevExpress.Web.v13.1" Namespace="DevExpress.Web.ASPxGridLookup" TagPrefix="dx" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript">
function Lookup_ValueChanged(s, e) {
grid.PerformCallback("FilterByCategories");
}
</script>
</head>
<body>
<form id="form1" runat="server">
<dx:ASPxGridView runat="server" ID="Grid" AutoGenerateColumns="False" DataSourceID="ProductsDataSource" ClientInstanceName="grid"
OnCustomCallback="Grid_CustomCallback" EnableViewState="false">
<Columns>
<dx:GridViewDataTextColumn FieldName="CategoryName">
<FilterTemplate>
<dx:ASPxGridLookup runat="server" ID="Lookup" AutoGenerateColumns="False" DataSourceID="CategoriesDataSource" KeyFieldName="CategoryID"
SelectionMode="Multiple" TextFormatString="{0}" >
<Columns>
<dx:GridViewCommandColumn ShowSelectCheckbox="true" />
<dx:GridViewDataTextColumn FieldName="CategoryName" />
<dx:GridViewDataBinaryImageColumn FieldName="Picture">
<PropertiesBinaryImage ImageWidth="48" />
</dx:GridViewDataBinaryImageColumn>
</Columns>
<ClientSideEvents ValueChanged="Lookup_ValueChanged" />
</dx:ASPxGridLookup>
</FilterTemplate>
</dx:GridViewDataTextColumn>
<dx:GridViewDataTextColumn FieldName="ProductName" />
<dx:GridViewDataTextColumn FieldName="ProductSales" />
<dx:GridViewDataDateColumn FieldName="ShippedDate" />
</Columns>
<Settings ShowFilterRow="true" />
</dx:ASPxGridView>
<asp:AccessDataSource ID="ProductsDataSource" runat="server" DataFile="~/App_Data/nwind.mdb"
SelectCommand="SELECT * FROM [ProductReports]" />
<asp:AccessDataSource ID="CategoriesDataSource" runat="server" DataFile="~/App_Data/nwind.mdb"
SelectCommand="SELECT * FROM [Categories]" />
</form>
</body>
</html>
Imports DevExpress.Data.Filtering
Imports DevExpress.Web.ASPxGridLookup
Imports DevExpress.Web.ASPxGridView
Partial Public Class _Default
Inherits System.Web.UI.Page
Protected Sub Grid_CustomCallback(ByVal sender As Object, ByVal e As ASPxGridViewCustomCallbackEventArgs)
If e.Parameters = "FilterByCategories" Then
Dim column = Grid.DataColumns("CategoryName")
Dim lookup = TryCast(Grid.FindFilterCellTemplateControl(column, "Lookup"), ASPxGridLookup)
If lookup IsNot Nothing Then
Grid.ApplyFilterToColumn(column, CreateCriteria(lookup, column.FieldName))
End If
End If
End Sub
Protected Function CreateCriteria(ByVal gridLookup As ASPxGridLookup, ByVal fieldName As String) As CriteriaOperator
Dim values = gridLookup.GridView.GetSelectedFieldValues(fieldName)
Return If(values.Count > 0, New InOperator(fieldName, values), Nothing)
End Function
End Class
See Also