Executing async operations onchange in Blazor

calendar_today 10 January 2023 07:35

ASP.NET Core Blazor .NET 7

Blazor's two-way databinding model is extremely powerful, but sometimes it can get in the way of what you want to do. For example, you might want to execute an asynchronous operation such as remote validation when a value changes in a textbox. Perhaps you want to check instantaneously that the value - a username maybe - doesn't already exist in a database before you accept a new registration. You cannot add an onchange event handler if you already have a value bound to the element, so what can you do? In this article, I look at solutions for both HTML elements and EditForm input validation components up to an including .NET 7, and a new feature released in .NET 7.0.1.

A reusable generic autocomplete component for Blazor

calendar_today 17 November 2022 13:14

ASP.NET Core Blazor

In my last article, I looked at building a simple autocomplete component within a Blazor WebAssembly application that fetches data dynamically from a database via an API depending on what the user enters into an input. It works nicely but it has not been designed to be reusable. In this article, I look at the steps required to convert the component so that it can be plugged in anywhere within an application and work with any kind of data.

Simple Autocomplete for Blazor

calendar_today 07 November 2022 13:35

ASP.NET Core Blazor

One of the things I really like about Blazor is how often it is easy to implement features in your application that, if needed in a server-side application, would have you testing your JavaScript-fu or reaching for a third party component. One example is an autocomplete component that fetches live data from a database that matches that which a user enters into a form control and changes as the user types. In this article, I'll show how to build such a component for a Blazor WebAssembly app and style it like a dropdown.

Resize images before uploading in Blazor Web Assembly

calendar_today 31 October 2022 14:02

ASP.NET Core Blazor

So, you allow users to upload images to the server from your Blazor WASM app, but you want to constrain the actual dimensions of the image for some reason. Rather than ask the user to edit the image prior to uploading, you decide to to take care of applying this requirement within the application. And you further decide to do any resizing in the browser prior to uploading so that the resulting upload is smaller and you don't have to waste server resources on the procedure. In this article, I take a look at how to do that, and how to get the dimensions of an image file.

Managing Authentication Token Expiry In WebAssembly-based Blazor

calendar_today 05 November 2019 13:50

ASP.NET Core Blazor

The Blazor WebAssembly project template doesn't feature an option to include authentication. If you want to add authentication to a WebAssembly-based Blazor application, you need to do it yourself. This article shows how to add application-wide authentication management and then to use built-in Razor components to protect the FetchData page in the standard template from unauthorised users.

Uploading Files In Blazor

calendar_today 17 October 2019 07:47

ASP.NET Core Blazor

A few weeks ago, Steve Sanderson blogged about publishing a package for a prototype Blazor file input component, designed to make working with user-supplied files in Blazor applications a lot easier. Steve has provided some very clear examples demonstrating how to use the component in a number of scenarios. Missing, though, is an example showing how to make an HTTP request to upload a file to some back-end server from a Blazor WebAssembly application.

Working With Query Strings In Blazor

calendar_today 11 October 2019 12:44

ASP.NET Core Blazor

When passing data in a URL within a Blazor application, most of the time you will define route templates that incorporate parameter placeholders, passing values as URL segments. You might also find that you need to be able to work with query string values, so how do you do that in a Blazor application?

Using Razor Components In A Razor Page

calendar_today 05 August 2019 12:40

ASP.NET Core Razor Pages Blazor

In my last article, I looked at some of the new things that ASP.NET Core 3.0 will introduce to Razor Pages developers. One of the features that I touched on was Razor Components. In this article, I take a more detailed look at what they are and how they can be used.

What's New In .NET Core 3.0 For Razor Pages

calendar_today 24 July 2019 19:44

ASP.NET Core Razor Pages Blazor

Later this year, .NET Core 3.0 will be released. The main features include WPF and Windows Forms support (albeit only on the Windows operating system) and server-side Blazor. Razor Pages applications will also see some changes. I cover some of these as part of a guide to upgrading an application from 2.2 to 3.0. Then I have a quick look at some of the other new features. Note that the information in this article is based on Preview 6, and is subject to change.

Improved Cascading Dropdowns With Blazor

calendar_today 05 July 2018 13:27

C# Blazor

In my last article, I looked at the experimental Blazor framework, using Cascading Dropdown Lists as an entry point. Since then, some feedback from Steve Sanderson to a question I asked has shown me a better way to implement this pattern.

Cascading Dropdowns With Blazor

calendar_today 24 May 2018 20:51

ASP.NET Core Blazor

Blazor is an experimental framework introduced by Steve Sanderson of Knockout.js fame (among other things) on the ASP.NET team. The premise of the framework is simple, but potentially game-changing for ASP.NET developers: it enables you to write your client side code in C#. What this means is that rather than having to chase after the latest Javascript-based hotness - Aurelia, React, Angular etc, only to find that they are dependent on learning a whole new load of frameworks, or that they are no longer flavour of the week, you just use the .NET skills that you already have to move your processing to the browser.