[Expand]General Information
[Expand]WinForms Controls
[Collapse]ASP.NET Controls and MVC Extensions
 [Expand]What's Installed
 [Expand]Common Concepts
 [Collapse]ASP.NET WebForms Controls
   Getting Started
  [Expand]Grid View
  [Expand]Tree List
  [Expand]Card View
  [Expand]Chart Control
  [Expand]Pivot Grid
  [Expand]Rich Text Editor
  [Expand]Site Navigation and Layout
  [Expand]HTML Editor
  [Expand]Vertical Grid
  [Expand]Data Editors
  [Expand]Docking and Popups
  [Expand]File Management
  [Expand]Data and Image Navigation
  [Expand]Multi-Use Site Controls
  [Expand]Spell Checker
  [Collapse]Query Builder
   [Collapse]Getting Started
     Lesson 1 - Add a Query Builder to a Web Application
     Lesson 2 - Use the Resulting Query
    Binding to Data
    Selecting Tables
    Joining Tables
   [Expand]Shaping Data
    Previewing Results
    Obtaining the Resulting Query
    Localizing the Query Builder
 [Expand]ASP.NET MVC Extensions
 [Expand]Redistribution and Deployment
  Get More Help
 [Expand]API Reference
[Expand]ASP.NET Bootstrap Controls
[Expand]ASP.NET Core Bootstrap Controls
[Expand]WPF Controls
[Expand]Xamarin Controls
[Expand]Windows 10 App Controls
[Expand]Office File API
[Expand]Report and Dashboard Server
[Expand]eXpressApp Framework
[Expand]eXpress Persistent Objects
[Expand]CodeRush Classic
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation
View this topic on docs.devexpress.com (Learn more)

Lesson 2 - Use the Resulting Query

This lesson will teach you how to use a SQL query string generated by the ASP.NET Query Builder control to supply DevExpress data-aware web controls with data.

  1. Open the web application created in the Lesson 1 of this tutorial and add a new Web Form to the project.
  2. Select the newly added Web Form in the Solution Explorer and click the Design button to open the visual designer for this web form.
  3. Expand the DX.19.1: Data and Analytics Toolbox tab and drop the ASPxGridView control onto the page.

    The added Grid View will be used to display data obtained from a database by executing a query generated by the Query Builder control.

  4. Switch to the Web Form containing the Query Builder added in Lesson 1 and handle the ASPxQueryBuilder.SaveQuery event. This event occurs on the server side every time the Query Builder's Save () toolbar command is clicked and provides access to the resulting query string. Add the following code to the handler to save the query string and redirect a browser to the page containing a Grid View.

  5. Add a provider-specific connection string that will be used by the Grid View to the application's Web.config file.

  6. Switch to the Web Form containing the Grid View. On the Page_Load event, call the ASPxWebControl.DataBind method of the Grid View. Next, handle the System.Web.UI.Control.DataBinding event of the Grid View to bind it to data using the SQL query generated by the Query Builder as show below.

  7. Run your web application, use the Query Builder to construct a query and click the Query Builder's Save toolbar command to view the result.

Expanded See Also

Is this topic helpful?​​​​​​​