The Self-Taught Programmer

Recipes from real-world experience with asp.net.

Posts Tagged ‘ASPxGridLookup

How To Perform a Callback on an ASPxGridLookup Control

with one comment

The Situation:

You have a DevExpress ASPxGridLookup control on your page and need to update its contents when some event occurs (such as a parent drop-down value changes). The problem is that the ASPxGridLookup control does not implement an OnCallback event.

A Solution:

First of all, this is not my solution. I found it on the DevExpress support site. It took me a while to find it, and to decode it, so I am putting it here so that I will be able to find it easier next time. I am also going to outline what is happening and why it works. The original solution was posted here.

There are two main ways to go about this. The first is to embed the ASPxGridLookup in an ASPxCallbackPanel. This is the first one that comes to mind, but there is an even simpler solution that involves adding a custom callback event to the instance of the ASPxGridLookup control.

Here is an ASPxGridLookup control on an aspx page:

<dx:ASPxGridLookup ID="ASPxGridLookup1" runat="server" ClientInstanceName="ASPxGridLookup1"
	TextFormatString="{0}" KeyFieldName="ProdId"
	AutoGenerateColumns="False" oninit="ASPxGridLookup1_Init">
	<GridViewProperties>
		<SettingsBehavior AllowFocusedRow="True" AllowSelectSingleRowOnly="True" />
		<SettingsPager Mode="ShowAllRecords">
		</SettingsPager>
	</GridViewProperties>
	<Columns>
		<dx:GridViewDataTextColumn VisibleIndex="0" FieldName="ProdId" Width="85px" Caption="ID">
		</dx:GridViewDataTextColumn>
		<dx:GridViewDataTextColumn VisibleIndex="1" FieldName="Description" Width="250px" Caption="Description">
		</dx:GridViewDataTextColumn>
	</Columns>
	<ClientSideEvents Validation="function(s,e) {if(s.GetValue()=='0') { e.isValid=false; e.errorText='Please select a Network ID.';}}" />
	<ValidationSettings SetFocusOnError="True" ErrorDisplayMode="ImageWithTooltip" ValidationGroup="Profile">
		<RequiredField IsRequired="True" ErrorText="Network ID is required" />
	</ValidationSettings>
</dx:ASPxGridLookup>

 

Then attach javascript like this to a calling control, for example when the selected item of an ASPxComboBox is changed:

<script language="javascript" type="text/javascript">
	function OnComboBoxChangedEventHandler() {
		ASPxGridLookup1.GetGridView().PerformCallback();
	}
</script>

 

Now to make this work, you have to do two things in the the code behind.

(1) The ASPxGridLookup control contains an ASPxGridView inside it (that’s what makes it such a valuable control). So you need to attach a ASPxGridViewCustomCallbackEventHandler to the ASPxGridView in the ASPxGridLookup control on init. Do that like this:

using DevExpress.Web.ASPxGridLookup;
using DevExpress.Web.ASPxGridView;

protected void ASPxGridLookup1_Init(object sender, EventArgs e)
{
	ASPxGridLookup lookup = (ASPxGridLookup)sender;
	ASPxGridView gridView = lookup.GridView;
	gridView.CustomCallback += new ASPxGridViewCustomCallbackEventHandler(ASPxGridLookup1_gridView_CustomCallback);
}

 

(2) The final step is to add the code to handle your new custom callback event handler. Do that like this:

void ddlCompProdId_gridView_CustomCallback(object sender, ASPxGridViewCustomCallbackEventArgs e)
{
	ASPxGridView gridView = (ASPxGridView)sender;
	//Put code here to requery/rebind the datasource for the ASPxGridLookup control
	...
	gridView.DataBind();
}

 

That’s all. When your user triggers the callback, it should act just the same as if DevExpress had built callback functionality into the control.

Advertisements

Written by Jim McMullen

May 31, 2013 at 12:50 am