ASPxClientQueryBuilder Class

The client-side equivalent of the ASPxQueryBuilder control.

#Declaration

TypeScript

declare class ASPxClientQueryBuilder extends ASPxClientControl

#Inherited Members

SendMessageToAssistiveTechnology(message)

SetClientVisible(visible)

#Inheritance

ASPxClientControlBase

ASPxClientControl

ASPxClientQueryBuilder

#Methods

#Cast(obj) Method

Converts the specified object to the current object’s type. This method is effective when you utilize the Client API IntelliSense feature provided by DevExpress.

#Declaration

TypeScript

static Cast(
    obj: any
): ASPxClientQueryBuilder

#Parameters

Name	Type	Description
obj	any	The client object to be type cast. Represents an instance of a DevExpress web control’s client object.

#Returns

Type	Description
`ASPxClientQueryBuilder`	An `ASPxClientQueryBuilder` object.

#Remarks

The Cast method is implemented as a part of the JavaScript IntelliSense support for DevExpress ASP.NET controls and MVC extensions. So, using the Cast method is sensible when you intend to use IntelliSense during writing JavaScript code at design time with the help of the DevExpress client API.

A call to the Cast method (which is a static method) casts the specified client object to the ASPxClientQueryBuilder type. As a result, the object’s type is now known and ASPxClientQueryBuilder type specific IntelliSense information can be displayed for this client object, facilitating your coding.

The examples of this method application are as follows.

Converting the event source object passed to a client event’s handler:

...
<ClientSideEvents Init="function(s, e) { 
    var clientObject = ASPxClientQueryBuilder.Cast(s);
}" />

Converting a client object accessed by using the value of the ClientInstanceName (or ID) property. For instance, if a web control’s ClientInstanceName property is set to ‘ASPxClientQueryBuilder1’, the object can be type cast in the following manner:
```
...
var clientObject = ASPxClientQueryBuilder.Cast('ASPxClientQueryBuilder1');
```

#GetJsonQueryModel Method

Gets a client-side model of the currently opened query serialized to Json.

#Declaration

TypeScript

GetJsonQueryModel(): string

#Returns

Type	Description
string	A string containing a query model.

#GetQueryBuilderModel Method

Gets a client-side model of the Web Query Builder.

#Declaration

TypeScript

GetQueryBuilderModel(): any

#Returns

Type	Description
any	The query builder model.

#IsQueryValid Method

Specifies whether or not the current query is a valid SQL string.

#Declaration

TypeScript

IsQueryValid(): boolean

#Returns

Type	Description
boolean	true if the query is valid; otherwise false.

#PerformCallback(arg) Method

Sends a callback to the server and generates the server-side event, passing it the specified argument.

#Declaration

TypeScript

PerformCallback(
    arg: string,
    onSuccess?: (arg: string) => void
): void

#Parameters

Name	Type	Description
arg	string	A string value that represents any information that needs to be sent to the server-side event.
onSuccess	(arg: string) => void	A client action to perform if the server round-trip completed successfully.

#Remarks

Use the PerformCallback method if you need to asynchronously go to the server and perform server-side processing using AJAX-based callback technology. You can pass the required information which can be collected on the client side as a string of arguments using the PerformCallback method args parameter. The onSuccess parameter allows you to specify a client function that should be executed after the server round-trip completed successfully.

#Save Method

Saves the current query.

#Declaration

TypeScript

Save(): void

#Remarks

When the Save method is called on the client side, the server-side ASPxQueryBuilder.SaveQuery event occurs allowing you to obtain the resulting query as a SQL query string or a SelectQuery object.

Calling the Save method has the same effect as clicking the Save command on the Query Builder toolbar.

See Also

Obtaining and Saving the Resulting Query

#ShowPreview Method

Invokes a Previewing Results for the current query.

#Declaration

TypeScript

ShowPreview(): void

See Also

Previewing Results

#UpdateLocalization(localization) Method

Updates the ASPxClientQueryBuilder properties’ localization settings.

#Declaration

TypeScript

UpdateLocalization(localization: { [key: string]: string; }): void

#Parameters

Name	Type	Description
localization	{[key: string]: string}	A dictionary containing the property names, along with their localized equivalents.

#Events

#BeforeRender Event

Occurs before the Query Builder UI is initialized.

#Declaration

TypeScript

BeforeRender: ASPxClientEvent<ASPxClientQueryBuilderBeforeRenderEventHandler<ASPxClientQueryBuilder>>

#Event Data

The BeforeRender event's data class is ASPxClientQueryBuilderRenderModelEventArgs.

#Remarks

Handle the BeforeRender event to perform required actions before the Query Builder’s UI initialization.

#BeginCallback Event

Occurs when a callback for server-side processing is initiated.

#Declaration

TypeScript

BeginCallback: ASPxClientEvent<ASPxClientBeginCallbackEventHandler<ASPxClientQueryBuilder>>

#Event Data

The BeginCallback event's data class is ASPxClientBeginCallbackEventArgs. The following properties provide information specific to this event:

Property	Description
command	Gets a command name that identifies which client action initiated a callback.

#Remarks

The BeginCallback and ASPxClientQueryBuilder.EndCallback events can be used to perform specific client-side actions when a callback is being processed on a server.

See Also

EndCallback

#CallbackError Event

Fires on the client if any server error occurs during server-side processing of a callback sent by ASPxClientQueryBuilder.

#Declaration

TypeScript

CallbackError: ASPxClientEvent<ASPxClientCallbackErrorEventHandler<ASPxClientQueryBuilder>>

#Event Data

The CallbackError event's data class is ASPxClientCallbackErrorEventArgs. The following properties provide information specific to this event:

Property	Description
handled	Gets or sets whether the event is handled and the default error handling actions are not required.
message	Gets the error message that describes the server error that occurred.

#Remarks

The CallbackError event enables you to properly respond to a server error occurring as a result of a callback being processed on the server side. Handle this event to perform specific client-side actions, such as displaying explanatory text or an image related to the error.

Typically, a server error which occurs during server-side processing of a callback, leads to web application hanging, because, in this case, no proper response is generated for a control that initiated the callback. However, AJAX-enabled web controls from the DevExpress product line are able to automatically catch server errors occurring within handlers of their server-side events, and to pass the related error information to the client for further processing through the CallbackError event’s argument.

To learn more, see the Handling Callback Exceptions on Client topic.

See Also

Handle a Callback Exception on the Client Side

#CustomizeLocalization Event

Enables you to customize the Query Builder’s localization strings.

#Declaration

TypeScript

CustomizeLocalization: ASPxClientEvent<ASPxClientQueryBuilderCustomizeLocalizationEventHandler<ASPxClientQueryBuilder>>

#Event Data

The CustomizeLocalization event's data class is ASPxClientEventArgs.

#Remarks

Use the client-side ASPxClientQueryBuilder.UpdateLocalization method in the CustomizeLocalization event to manually substitute particular localization strings with custom ones.

See Also

UpdateLocalization(localization)

#CustomizeToolbarActions Event

Enables you to customize the menu actions of a Query Builder.

#Declaration

TypeScript

CustomizeToolbarActions: ASPxClientEvent<ASPxClientQueryBuilderCustomizeToolbarActionsEventHandler<ASPxClientQueryBuilder>>

#Event Data

The CustomizeToolbarActions event's data class is ASPxClientCustomizeMenuActionsEventArgs. The following properties provide information specific to this event:

Property	Description
Actions	Provides access to the collection of actions available in the toolbar and menu.

The event data class exposes the following methods:

Method	Description
GetById(actionId)	Returns a menu action with the specified ID.

#EndCallback Event

Occurs on the client after a callback’s server-side processing has been completed.

#Declaration

TypeScript

EndCallback: ASPxClientEvent<ASPxClientEndCallbackEventHandler<ASPxClientQueryBuilder>>

#Event Data

The EndCallback event's data class is ASPxClientEndCallbackEventArgs. The following properties provide information specific to this event:

Property	Description
command	Gets a command name that identifies which client action forced a callback to occur.

#Remarks

The ASPxClientQueryBuilder.BeginCallback and EndCallback events can be used to perform specific client-side actions when a callback is being processed on a server.

See Also

BeginCallback

#OnServerError Event

Occurs on the client each time a server-side error raises.

#Declaration

TypeScript

OnServerError: ASPxClientEvent<ASPxClientQueryBuilderErrorEventHandler<ASPxClientQueryBuilder>>

#Event Data

The OnServerError event's data class is ASPxClientErrorEventArgs. The following properties provide information specific to this event:

Property	Description
Error	Provides access to information about a server-side error.

#Remarks

Handle the OnServerError event to perform actions when a Fetch request completes with an error.

The following code snippet demonstrates how to show an alert box when any internal server error occurs.

ASPX

<script type="text/javascript" id="script">
    function onError(s, e) {
        alert("Internal Server Error occurs");
    }
</script>

<dx:ASPxQueryBuilder ID="ASPxQueryBuilder1" runat="server">     
    <ClientSideEvents OnServerError="onError"/> 
</dx:ASPxQueryBuilder>

See Also

Reporting Application Diagnostics

#SaveCommandExecute Event

Occurs when executing the Save command on the client.

#Declaration

TypeScript

SaveCommandExecute: ASPxClientEvent<ASPxClientQueryBuilderSaveCommandExecuteEventHandler<ASPxClientQueryBuilder>>

#Event Data

The SaveCommandExecute event's data class is ASPxClientQueryBuilderSaveCommandExecuteEventArgs. The following properties provide information specific to this event:

Property	Description
handled	Specifies whether or not the event was handled.