From 0172635e893f59efb53a53fe17fa9f320152af8b Mon Sep 17 00:00:00 2001 From: guardrex <1622880+guardrex@users.noreply.github.com> Date: Fri, 18 Oct 2024 07:53:02 -0400 Subject: [PATCH] Cross-link 9.0 sample code --- aspnetcore/blazor/advanced-scenarios.md | 8 +- aspnetcore/blazor/blazor-ef-core.md | 40 ++++- .../cascading-values-and-parameters.md | 2 +- aspnetcore/blazor/file-downloads.md | 28 +++- aspnetcore/blazor/forms/binding.md | 70 +++++++++ aspnetcore/blazor/forms/index.md | 34 ++++- aspnetcore/blazor/forms/input-components.md | 32 +++- aspnetcore/blazor/forms/validation.md | 48 +++++- .../blazor/fundamentals/configuration.md | 16 +- .../blazor/fundamentals/handle-errors.md | 8 +- aspnetcore/blazor/fundamentals/index.md | 10 +- aspnetcore/blazor/fundamentals/logging.md | 16 +- aspnetcore/blazor/fundamentals/routing.md | 40 ++++- aspnetcore/blazor/host-and-deploy/server.md | 8 +- aspnetcore/blazor/images-and-documents.md | 24 ++- .../call-dotnet-from-javascript.md | 138 ++++++++++++++++-- .../call-javascript-from-dotnet.md | 132 +++++++++++++++-- .../security/blazor-web-app-with-entra.md | 4 +- aspnetcore/blazor/security/index.md | 4 - .../blazor/tutorials/build-a-blazor-app.md | 58 +++++++- .../build-a-blazor-app/9.0/Todo0.razor | 10 ++ .../build-a-blazor-app/9.0/Todo2.razor | 17 +++ .../build-a-blazor-app/9.0/Todo3.razor | 20 +++ .../build-a-blazor-app/9.0/Todo4.razor | 11 ++ .../build-a-blazor-app/9.0/Todo6.razor | 30 ++++ .../build-a-blazor-app/9.0/Todo7.razor | 9 ++ .../build-a-blazor-app/9.0/Todo8.razor | 33 +++++ 27 files changed, 772 insertions(+), 78 deletions(-) create mode 100644 aspnetcore/blazor/tutorials/build-a-blazor-app/9.0/Todo0.razor create mode 100644 aspnetcore/blazor/tutorials/build-a-blazor-app/9.0/Todo2.razor create mode 100644 aspnetcore/blazor/tutorials/build-a-blazor-app/9.0/Todo3.razor create mode 100644 aspnetcore/blazor/tutorials/build-a-blazor-app/9.0/Todo4.razor create mode 100644 aspnetcore/blazor/tutorials/build-a-blazor-app/9.0/Todo6.razor create mode 100644 aspnetcore/blazor/tutorials/build-a-blazor-app/9.0/Todo7.razor create mode 100644 aspnetcore/blazor/tutorials/build-a-blazor-app/9.0/Todo8.razor diff --git a/aspnetcore/blazor/advanced-scenarios.md b/aspnetcore/blazor/advanced-scenarios.md index 1880fa66af8e..a7d30c890927 100644 --- a/aspnetcore/blazor/advanced-scenarios.md +++ b/aspnetcore/blazor/advanced-scenarios.md @@ -33,7 +33,13 @@ In methods wi `BuiltContent.razor`: -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +:::code language="razor" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/Components/Pages/BuiltContent.razor"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" :::code language="razor" source="~/../blazor-samples/8.0/BlazorSample_BlazorWebApp/Components/Pages/BuiltContent.razor"::: diff --git a/aspnetcore/blazor/blazor-ef-core.md b/aspnetcore/blazor/blazor-ef-core.md index 59e5bd945677..931629e0f891 100644 --- a/aspnetcore/blazor/blazor-ef-core.md +++ b/aspnetcore/blazor/blazor-ef-core.md @@ -62,7 +62,13 @@ The sample demonstrates use of EF Core to handle optimistic concurrency. However The sample uses a local [SQLite](https://www.sqlite.org/index.html) database so that it can be used on any platform. The sample also configures database logging to show the SQL queries that are generated. This is configured in `appsettings.Development.json`: -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +:::code language="json" source="~/../blazor-samples/9.0/BlazorWebAppEFCore/appsettings.Development.json"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" :::code language="json" source="~/../blazor-samples/8.0/BlazorWebAppEFCore/appsettings.Development.json"::: @@ -167,7 +173,13 @@ In the preceding factory: The following example configures [SQLite](https://www.sqlite.org/index.html) and enables data logging. The code uses an extension method (`AddDbContextFactory`) to configure the database factory for DI and provide default options: -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +:::code language="csharp" source="~/../blazor-samples/9.0/BlazorWebAppEFCore/Program.cs" id="snippet1"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" :::code language="csharp" source="~/../blazor-samples/8.0/BlazorWebAppEFCore/Program.cs" id="snippet1"::: @@ -207,7 +219,13 @@ In the home page of the sample app, `IDbContextFactory` is injec A `DbContext` is created using the factory (`DbFactory`) to delete a contact in the `DeleteContactAsync` method: -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +:::code language="razor" source="~/../blazor-samples/9.0/BlazorWebAppEFCore/Components/Pages/Home.razor" id="snippet1"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" :::code language="razor" source="~/../blazor-samples/8.0/BlazorWebAppEFCore/Components/Pages/Home.razor" id="snippet1"::: @@ -274,7 +292,13 @@ You can use the factory to create a context and track it for the lifetime of the The sample app ensures the context is disposed when the component is disposed: -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +:::code language="csharp" source="~/../blazor-samples/9.0/BlazorWebAppEFCore/Components/Pages/EditContact.razor" id="snippet1"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" :::code language="csharp" source="~/../blazor-samples/8.0/BlazorWebAppEFCore/Components/Pages/EditContact.razor" id="snippet1"::: @@ -306,7 +330,13 @@ The sample app ensures the context is disposed when the component is disposed: Finally, [`OnInitializedAsync`](xref:blazor/components/lifecycle) is overridden to create a new context. In the sample app, [`OnInitializedAsync`](xref:blazor/components/lifecycle) loads the contact in the same method: -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +:::code language="csharp" source="~/../blazor-samples/9.0/BlazorWebAppEFCore/Components/Pages/EditContact.razor" id="snippet2"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" :::code language="csharp" source="~/../blazor-samples/8.0/BlazorWebAppEFCore/Components/Pages/EditContact.razor" id="snippet2"::: diff --git a/aspnetcore/blazor/components/cascading-values-and-parameters.md b/aspnetcore/blazor/components/cascading-values-and-parameters.md index c07560c5b8c5..dcd6efa16d71 100644 --- a/aspnetcore/blazor/components/cascading-values-and-parameters.md +++ b/aspnetcore/blazor/components/cascading-values-and-parameters.md @@ -111,7 +111,7 @@ The following `ThemeInfo` C# class specifies the theme information. :::moniker range=">= aspnetcore-9.0" -:::code language="csharp" source="~/../blazor-samples/8.0/BlazorSample_BlazorWebApp/ThemeInfo.cs"::: +:::code language="csharp" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/ThemeInfo.cs"::: :::moniker-end diff --git a/aspnetcore/blazor/file-downloads.md b/aspnetcore/blazor/file-downloads.md index 07baf576f636..e36a0e004eec 100644 --- a/aspnetcore/blazor/file-downloads.md +++ b/aspnetcore/blazor/file-downloads.md @@ -110,7 +110,13 @@ The following component: `FileDownload1.razor`: -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +:::code language="razor" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/Components/Pages/FileDownload1.razor"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" :::code language="razor" source="~/../blazor-samples/8.0/BlazorSample_BlazorWebApp/Components/Pages/FileDownload1.razor"::: @@ -159,7 +165,13 @@ The example in this section uses a download file named `quote.txt`, which is pla `wwwroot/files/quote.txt`: -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +:::code language="text" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/wwwroot/files/quote.txt"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" :::code language="text" source="~/../blazor-samples/8.0/BlazorSample_BlazorWebApp/wwwroot/files/quote.txt"::: @@ -203,7 +215,17 @@ The following example component downloads the file from the same origin that the `FileDownload2.razor`: -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +:::code language="razor" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/Components/Pages/FileDownload2.razor"::: + +For interactive components, the button in the preceding example calls the `DownloadFileFromURL` handler to invoke the JavaScript (JS) function `triggerFileDownload`. + +If the component adopts static server-side rendering (static SSR), add an event handler for the button ([`addEventListener` (MDN documentation)](https://developer.mozilla.org/docs/Web/API/EventTarget/addEventListener)) to call `triggerFileDownload` following the guidance in . + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" :::code language="razor" source="~/../blazor-samples/8.0/BlazorSample_BlazorWebApp/Components/Pages/FileDownload2.razor"::: diff --git a/aspnetcore/blazor/forms/binding.md b/aspnetcore/blazor/forms/binding.md index c6a7d4e44898..c902c3fe4324 100644 --- a/aspnetcore/blazor/forms/binding.md +++ b/aspnetcore/blazor/forms/binding.md @@ -238,8 +238,22 @@ The following example independently binds two forms to their models by form name `Starship6.razor`: +:::moniker-end + +:::moniker range=">= aspnetcore-9.0" + +:::code language="razor" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/Components/Pages/Starship6.razor"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" + :::code language="razor" source="~/../blazor-samples/8.0/BlazorSample_BlazorWebApp/Components/Pages/Starship6.razor"::: +:::moniker-end + +:::moniker range=">= aspnetcore-8.0" + ## Nest and bind forms The following guidance demonstrates how to nest and bind child forms. @@ -248,26 +262,82 @@ The following ship details class (`ShipDetails`) holds a description and length `ShipDetails.cs`: +:::moniker-end + +:::moniker range=">= aspnetcore-9.0" + +:::code language="csharp" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/ShipDetails.cs"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" + :::code language="csharp" source="~/../blazor-samples/8.0/BlazorSample_BlazorWebApp/ShipDetails.cs"::: +:::moniker-end + +:::moniker range=">= aspnetcore-8.0" + The following `Ship` class names an identifier (`Id`) and includes the ship details. `Ship.cs`: +:::moniker-end + +:::moniker range=">= aspnetcore-9.0" + +:::code language="csharp" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/Ship.cs"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" + :::code language="csharp" source="~/../blazor-samples/8.0/BlazorSample_BlazorWebApp/Ship.cs"::: +:::moniker-end + +:::moniker range=">= aspnetcore-8.0" + The following subform is used for editing values of the `ShipDetails` type. This is implemented by inheriting at the top of the component. ensures that the child component generates the correct form field names based on the model (`T`), where `T` in the following example is `ShipDetails`. `StarshipSubform.razor`: +:::moniker-end + +:::moniker range=">= aspnetcore-9.0" + +:::code language="razor" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/Components/StarshipSubform.razor"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" + :::code language="razor" source="~/../blazor-samples/8.0/BlazorSample_BlazorWebApp/Components/StarshipSubform.razor"::: +:::moniker-end + +:::moniker range=">= aspnetcore-8.0" + The main form is bound to the `Ship` class. The `StarshipSubform` component is used to edit ship details, bound as `Model!.Details`. `Starship7.razor`: +:::moniker-end + +:::moniker range=">= aspnetcore-9.0" + +:::code language="razor" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/Components/Pages/Starship7.razor"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" + :::code language="razor" source="~/../blazor-samples/8.0/BlazorSample_BlazorWebApp/Components/Pages/Starship7.razor"::: +:::moniker-end + +:::moniker range=">= aspnetcore-8.0" + ## Initialize form data with static SSR When a component adopts static SSR, the [`OnInitialized{Async}` lifecycle method](xref:blazor/components/lifecycle#component-initialization-oninitializedasync) and the [`OnParametersSet{Async}` lifecycle method](xref:blazor/components/lifecycle#after-parameters-are-set-onparameterssetasync) fire when the component is initially rendered and on every form POST to the server. To initialize form model values, confirm if the model already has data before assigning new model values in `OnParametersSet{Async}`, as the following example demonstrates. diff --git a/aspnetcore/blazor/forms/index.md b/aspnetcore/blazor/forms/index.md index c54b273808e1..ebaff94073a5 100644 --- a/aspnetcore/blazor/forms/index.md +++ b/aspnetcore/blazor/forms/index.md @@ -50,8 +50,22 @@ Standard HTML forms are supported. Create a form using the normal HTML `
` `StarshipPlainForm.razor`: +:::moniker-end + +:::moniker range=">= aspnetcore-9.0" + +:::code language="razor" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/Components/Pages/StarshipPlainForm.razor"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" + :::code language="razor" source="~/../blazor-samples/8.0/BlazorSample_BlazorWebApp/Components/Pages/StarshipPlainForm.razor"::: +:::moniker-end + +:::moniker range=">= aspnetcore-8.0" + In the preceding `StarshipPlainForm` component: * The form is rendered where the `` element appears. The form is named with the [`@formname`](xref:mvc/views/razor#formname) directive attribute, which uniquely identifies the form to the Blazor framework. @@ -84,10 +98,20 @@ A form is defined using the Blazor framework's component is rendered where the `` element appears. The form is named with the [`@formname`](xref:mvc/views/razor#formname) directive attribute, which uniquely identifies the form to the Blazor framework. @@ -158,7 +182,13 @@ In the next example, the preceding component is modified to create the form in t `Starship2.razor`: -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +:::code language="razor" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/Components/Pages/Starship2.razor"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" :::code language="razor" source="~/../blazor-samples/8.0/BlazorSample_BlazorWebApp/Components/Pages/Starship2.razor"::: diff --git a/aspnetcore/blazor/forms/input-components.md b/aspnetcore/blazor/forms/input-components.md index ca71258cc401..50d2fc020356 100644 --- a/aspnetcore/blazor/forms/input-components.md +++ b/aspnetcore/blazor/forms/input-components.md @@ -96,7 +96,13 @@ The following `Starship` type, which is used in several of this article's exampl `Starship.cs`: -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +:::code language="csharp" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/Starship.cs"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" :::code language="csharp" source="~/../blazor-samples/8.0/BlazorSample_BlazorWebApp/Starship.cs"::: @@ -135,7 +141,13 @@ When the model property for the ship's classification (`Classification`) is set, `Starship3.razor`: -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +:::code language="razor" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/Components/Pages/Starship3.razor"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" :::code language="razor" source="~/../blazor-samples/8.0/BlazorSample_BlazorWebApp/Components/Pages/Starship3.razor"::: @@ -236,7 +248,13 @@ In the following example: `Starship4.razor`: -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +:::code language="razor" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/Components/Pages/Starship4.razor"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" :::code language="razor" source="~/../blazor-samples/8.0/BlazorSample_BlazorWebApp/Components/Pages/Starship4.razor"::: @@ -317,7 +335,13 @@ In the following example, the user must select at least two starship classificat :::moniker-end -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +:::code language="razor" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/Components/Pages/Starship5.razor"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" :::code language="razor" source="~/../blazor-samples/8.0/BlazorSample_BlazorWebApp/Components/Pages/Starship5.razor"::: diff --git a/aspnetcore/blazor/forms/validation.md b/aspnetcore/blazor/forms/validation.md index 4e51e910989d..b74887a9c694 100644 --- a/aspnetcore/blazor/forms/validation.md +++ b/aspnetcore/blazor/forms/validation.md @@ -30,7 +30,13 @@ In the following component, the `HandleValidationRequested` handler method clear `Starship8.razor`: -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +:::code language="razor" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/Components/Pages/Starship8.razor"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" :::code language="razor" source="~/../blazor-samples/8.0/BlazorSample_BlazorWebApp/Components/Pages/Starship8.razor"::: @@ -191,7 +197,13 @@ When validation messages are set in the component, they're added to the validato `Starship9.razor`: -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +:::code language="razor" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/Components/Pages/Starship9.razor"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" :::code language="razor" source="~/../blazor-samples/8.0/BlazorSample_BlazorWebApp/Components/Pages/Starship9.razor"::: @@ -828,7 +840,13 @@ The `CustomInputText` component can be used anywhere instance into `ConfigExample.razor`: -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +:::code language="razor" source="~/../blazor-samples/9.0/BlazorSample_WebAssembly/Pages/ConfigExample.razor"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" :::code language="razor" source="~/../blazor-samples/8.0/BlazorSample_WebAssembly/Pages/ConfigExample.razor"::: @@ -180,7 +186,13 @@ Inject an instance into `MemoryConfig.razor`: -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +:::code language="razor" source="~/../blazor-samples/9.0/BlazorSample_WebAssembly/Pages/MemoryConfig.razor"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" :::code language="razor" source="~/../blazor-samples/8.0/BlazorSample_WebAssembly/Pages/MemoryConfig.razor"::: diff --git a/aspnetcore/blazor/fundamentals/handle-errors.md b/aspnetcore/blazor/fundamentals/handle-errors.md index 7233eb37a3de..4a8701b262c4 100644 --- a/aspnetcore/blazor/fundamentals/handle-errors.md +++ b/aspnetcore/blazor/fundamentals/handle-errors.md @@ -801,7 +801,13 @@ In the following example where is disposed in the `Dispose` method. -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +`CallDotnet2.razor`: + +:::code language="razor" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/Components/Pages/CallDotnet2.razor"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" `CallDotnet2.razor`: @@ -420,7 +444,15 @@ In the preceding example, the variable name `dotNetHelper` is arbitrary and can Provide the parameter list to the .NET method. -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +`CallDotnet3.razor`: + +:::code language="razor" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/Components/Pages/CallDotnet3.razor"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" `CallDotnet3.razor`: @@ -934,7 +966,13 @@ The following `HelloHelper` class has a JS-invokable .NET method named `GetHello `HelloHelper.cs`: -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +:::code language="csharp" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/HelloHelper.cs"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" :::code language="csharp" source="~/../blazor-samples/8.0/BlazorSample_BlazorWebApp/HelloHelper.cs"::: @@ -968,7 +1006,13 @@ The `CallHelloHelperGetHelloMessage` method in the following `JsInteropClasses3` `JsInteropClasses3.cs`: -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +:::code language="csharp" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/JsInteropClasses3.cs"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" :::code language="csharp" source="~/../blazor-samples/8.0/BlazorSample_BlazorWebApp/JsInteropClasses3.cs"::: @@ -1002,7 +1046,15 @@ To avoid a memory leak and allow garbage collection, the .NET object reference c When the **`Trigger .NET instance method`** button is selected in the following component, `JsInteropClasses3.CallHelloHelperGetHelloMessage` is called with the value of `name`. -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +`CallDotnet4.razor`: + +:::code language="razor" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/Components/Pages/CallDotnet4.razor"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" `CallDotnet4.razor`: @@ -1048,7 +1100,15 @@ The following image shows the rendered component with the name `Amy Pond` in the The preceding pattern shown in the `JsInteropClasses3` class can also be implemented entirely in a component. -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +`CallDotnet5.razor`: + +:::code language="razor" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/Components/Pages/CallDotnet5.razor"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" `CallDotnet5.razor`: @@ -1124,7 +1184,13 @@ The following `MessageUpdateInvokeHelper` class maintains a JS-invokable .NET me `MessageUpdateInvokeHelper.cs`: -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +:::code language="csharp" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/MessageUpdateInvokeHelper.cs"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" :::code language="csharp" source="~/../blazor-samples/8.0/BlazorSample_BlazorWebApp/MessageUpdateInvokeHelper.cs"::: @@ -1176,7 +1242,13 @@ When a `ListItem1` component's **`InteropCall`** button is selected, `updateMess `ListItem1.razor`: -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +:::code language="razor" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/Components/ListItem1.razor"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" :::code language="razor" source="~/../blazor-samples/8.0/BlazorSample_BlazorWebApp/Components/ListItem1.razor"::: @@ -1210,7 +1282,15 @@ When a `ListItem1` component's **`InteropCall`** button is selected, `updateMess The following parent component includes four list items, each an instance of the `ListItem1` component. -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +`CallDotnet6.razor`: + +:::code language="razor" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/Components/Pages/CallDotnet6.razor"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" `CallDotnet6.razor`: @@ -1279,7 +1359,15 @@ In the following example: The following `assignDotNetHelper` JS function assigns the to an element in a property named `dotNetHelper`. The following `interopCall` JS function uses the for the passed element to invoke a .NET method named `UpdateMessage`. -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +`ListItem2.razor.js`: + +:::code language="javascript" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/Components/ListItem2.razor.js"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" `ListItem2.razor.js`: @@ -1318,7 +1406,13 @@ The is disposed when the compon `ListItem2.razor`: -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +:::code language="razor" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/Components/ListItem2.razor"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" :::code language="razor" source="~/../blazor-samples/8.0/BlazorSample_BlazorWebApp/Components/ListItem2.razor"::: @@ -1350,7 +1444,15 @@ The is disposed when the compon The following parent component includes four list items, each an instance of the `ListItem2` component. -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +`CallDotnet7.razor`: + +:::code language="razor" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/Components/Pages/CallDotnet7.razor"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" `CallDotnet7.razor`: @@ -1517,7 +1619,15 @@ Provide a `sendByteArray` JS function. The function is called statically, which :::moniker-end -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +`CallDotnet8.razor`: + +:::code language="razor" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/Components/Pages/CallDotnet8.razor"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" `CallDotnet8.razor`: diff --git a/aspnetcore/blazor/javascript-interoperability/call-javascript-from-dotnet.md b/aspnetcore/blazor/javascript-interoperability/call-javascript-from-dotnet.md index 878eadd2dae2..afd5e98b167a 100644 --- a/aspnetcore/blazor/javascript-interoperability/call-javascript-from-dotnet.md +++ b/aspnetcore/blazor/javascript-interoperability/call-javascript-from-dotnet.md @@ -56,7 +56,15 @@ The following component: * Invokes the `convertArray` JS function with when selecting a button (**`Convert Array`**). * After the JS function is called, the passed array is converted into a string. The string is returned to the component for display (`text`). -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +`CallJs1.razor`: + +:::code language="razor" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/Components/Pages/CallJs1.razor"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" `CallJs1.razor`: @@ -126,7 +134,15 @@ Provide a `displayTickerAlert1` JS function. The function is called with [!NOTE] > For general guidance on JS location and our recommendations for production apps, see . -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +`CallJs7.razor` (parent component): + +:::code language="razor" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/Components/Pages/CallJs7.razor"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" `CallJs7.razor` (parent component): @@ -818,7 +886,15 @@ For a parent component to make an element reference available to other component :::moniker-end -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +`CallJs7.razor.cs`: + +:::code language="csharp" source="~/../blazor-samples/9.0/BlazorSample_WebAssembly/Pages/CallJs7.razor.cs"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" `CallJs7.razor.cs`: @@ -862,7 +938,13 @@ In the preceding example, the namespace of the app is `BlazorSample`. If testing `SurveyPrompt.razor` (child component): -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +:::code language="razor" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/Components/SurveyPrompt.razor"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" :::code language="razor" source="~/../blazor-samples/8.0/BlazorSample_BlazorWebApp/Components/SurveyPrompt.razor"::: @@ -894,7 +976,13 @@ In the preceding example, the namespace of the app is `BlazorSample`. If testing `SurveyPrompt.razor.cs`: -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +:::code language="csharp" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/Components/SurveyPrompt.razor.cs"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" :::code language="csharp" source="~/../blazor-samples/8.0/BlazorSample_BlazorWebApp/Components/SurveyPrompt.razor.cs"::: @@ -1059,7 +1147,15 @@ Add the following `` element to the `` element markup ([location of :::moniker-end -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +`CallJs8.razor`: + +:::code language="razor" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/Components/Pages/CallJs8.razor"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" `CallJs8.razor`: @@ -1271,7 +1367,15 @@ In the following example, the `nonFunction` JS function doesn't exist. When the > `Could not find 'nonFunction' ('nonFunction' was undefined).` -:::moniker range=">= aspnetcore-8.0" +:::moniker range=">= aspnetcore-9.0" + +`CallJs11.razor`: + +:::code language="razor" source="~/../blazor-samples/9.0/BlazorSample_BlazorWebApp/Components/Pages/CallJs11.razor"::: + +:::moniker-end + +:::moniker range=">= aspnetcore-8.0 < aspnetcore-9.0" `CallJs11.razor`: diff --git a/aspnetcore/blazor/security/blazor-web-app-with-entra.md b/aspnetcore/blazor/security/blazor-web-app-with-entra.md index c54632b75788..cbf90468b679 100644 --- a/aspnetcore/blazor/security/blazor-web-app-with-entra.md +++ b/aspnetcore/blazor/security/blazor-web-app-with-entra.md @@ -1,5 +1,5 @@ --- -title: Secure an ASP.NET Core Blazor Web App with Microsoft Entra +title: Secure an ASP.NET Core Blazor Web App with Microsoft Entra ID author: guardrex description: Learn how to secure a Blazor WebAssembly App with Microsoft Entra ID. monikerRange: '>= aspnetcore-9.0' @@ -8,7 +8,7 @@ ms.custom: mvc ms.date: 10/07/2024 uid: blazor/security/blazor-web-app-entra --- -# Secure an ASP.NET Core Blazor Web App with Microsoft Entra +# Secure an ASP.NET Core Blazor Web App with Microsoft Entra ID