Still using Radzen Studio?
Achieve more with Radzen Blazor Studio

Radzen Blazor Studio is our new flagship product and vision of how rapid Blazor application development should be done.

Go to Radzen Blazor Studio

MS SQL Server (Angular)

Radzen apps can connect to Microsoft SQL Server databases. All you need to do is specify the connection string. Radzen will discover the schema and will create an OData service which will expose the tables as OData entities.

This tutorial will show you how to connect to a MS SQL Server database, read, add, update and delete data.

Prerequisites

Make sure you have installed .NET SDK.

Quick video

How to build the application

  • Step 1: Create and configure the application
  • Step 2: Add the MS SQL Server data source
  • Step 3: Automatically generate CRUD pages

Step 1: Create and configure the application

Create a new Radzen application by following the first step from the quickstart guide.

Step 2: Add the MS SQL Server data source

In this step we create a data source that connects to a MS SQL Server database.

  1. Open the application that you created in the previous step for editing.
  2. Click data to go to the My DataSources screen.
  3. Click new to add a new data source.
  4. Select MS SQL Server as data source type.
  5. Pick a Name for your data source.
  6. Enter the MS SQL Server connection info - server, database name, user and password. Optionally you can specify port in the server field separated with , or :.
  7. Click Next.
  8. Radzen will connect to the database and infer all tables, views and stored procedures. By default all tables are checked and you can choose/uncheck tables and/or table properties, views and stored procedures needed for your application.

Step 3: Automatically generate CRUD pages

  1. Check the Generate pages for CRUD operations check-box.Radzen can create pages only for tables with primary keys. For views only read page can be created and no auto-pages will be created for stored procedures.
  2. Radzen will open Edit and Add pages by default in dialogs. Uncheck the check-box if you want to have navigation instead.
  3. Check the Enable optimistic concurrency check-box if you want to enable automatically optimistic concurrency.
  4. Click Finish.

You can now run the application to verify that you have full CRUD support.

Optionally you can data-bind a data grid component manually

  1. Drag-and-drop a data grid component from the toolbox.
  2. Use Data property wizard to select data source for the DataGrid.
  3. Build and run the application.

Using stored procedures

  1. Check stored procedures during infer.
  2. Set CustomerID property on TextBox Change event.
  3. Call stored procedure on Button Click event and set result as orders property.
  4. Bind DataGrid to orders property and auto-generate columns.
  5. Build and run the application.