From df9fca94aa8a61f1a4ee7e66b663649fa70f11b7 Mon Sep 17 00:00:00 2001 From: kathiravan4982 Date: Wed, 29 Jul 2026 23:54:28 +0530 Subject: [PATCH] 856838: Fixed documentation and sample issues in the Blazor ListBox UG. --- blazor-toc.html | 4 ++-- blazor/listbox/how-to/add-items.md | 8 ++++---- blazor/listbox/how-to/bind-change-event.md | 6 +++--- blazor/listbox/how-to/enable-or-disable-items.md | 16 +++++++++++----- blazor/listbox/how-to/enable-scroll.md | 6 +++--- blazor/listbox/how-to/filter-listbox.md | 6 +++--- blazor/listbox/how-to/get-items.md | 2 +- blazor/listbox/how-to/select-items.md | 8 ++++---- 8 files changed, 31 insertions(+), 25 deletions(-) diff --git a/blazor-toc.html b/blazor-toc.html index 8acae0975d..8d61cfcbf8 100644 --- a/blazor-toc.html +++ b/blazor-toc.html @@ -3215,11 +3215,11 @@
  • Add/Remove Items
  • Bind Change Events
  • Enable Scroller
    • -
  • Enable/Disable ListBox +
  • Enable or Disable ListBox Items
  • Select Items
  • Get Items
    • -
  • Filter ListBox Data Using TextBox Component
    • +
  • Filter ListBox Data Using HTML Input Element
  • diff --git a/blazor/listbox/how-to/add-items.md b/blazor/listbox/how-to/add-items.md index e709d68445..3e24e08888 100644 --- a/blazor/listbox/how-to/add-items.md +++ b/blazor/listbox/how-to/add-items.md @@ -29,7 +29,7 @@ Use the [AddItemsAsync](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor. new VehicleData { Text = "SSC Ultimate Aero", Id = "Vehicle-04" }, new VehicleData { Text = "Koenigsegg CCR", Id = "Vehicle-05" }, new VehicleData { Text = "McLaren F1", Id = "Vehicle-06" }, - new VehicleData { Text = "Aston Martin One- 77", Id = "Vehicle-07" }, + new VehicleData { Text = "Aston Martin One-77", Id = "Vehicle-07" }, new VehicleData { Text = "Jaguar XJ220", Id = "Vehicle-08" } }; @@ -73,15 +73,15 @@ Use the [RemoveItemAsync](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazo new VehicleData { Text = "SSC Ultimate Aero", Id = "Vehicle-04" }, new VehicleData { Text = "Koenigsegg CCR", Id = "Vehicle-05" }, new VehicleData { Text = "McLaren F1", Id = "Vehicle-06" }, - new VehicleData { Text = "Aston Martin One- 77", Id = "Vehicle-07" }, + new VehicleData { Text = "Aston Martin One-77", Id = "Vehicle-07" }, new VehicleData { Text = "Jaguar XJ220", Id = "Vehicle-08" }, new VehicleData{ Text = "Ferrari LaFerrari", Id = "Vehicle-09"}, new VehicleData{ Text = "McLaren P1", Id = "Vehicle-10"} }; public class VehicleData { - public string Text { get; set; } - public string Id { get; set; } + public string Text { get; set; } + public string Id { get; set; } } public List Item = new List{ diff --git a/blazor/listbox/how-to/bind-change-event.md b/blazor/listbox/how-to/bind-change-event.md index 819f04ee6a..2c3f166201 100644 --- a/blazor/listbox/how-to/bind-change-event.md +++ b/blazor/listbox/how-to/bind-change-event.md @@ -29,13 +29,13 @@ Bind the change event in the listbox [ValueChange](https://help.syncfusion.com/c new VehicleData { Text = "SSC Ultimate Aero", Id = "Vehicle-04" }, new VehicleData { Text = "Koenigsegg CCR", Id = "Vehicle-05" }, new VehicleData { Text = "McLaren F1", Id = "Vehicle-06" }, - new VehicleData { Text = "Aston Martin One- 77", Id = "Vehicle-07" }, + new VehicleData { Text = "Aston Martin One-77", Id = "Vehicle-07" }, new VehicleData { Text = "Jaguar XJ220", Id = "Vehicle-08" } }; public class VehicleData { - public string Text { get; set; } - public string Id { get; set; } + public string Text { get; set; } + public string Id { get; set; } } private void change(ListBoxChangeEventArgs args) diff --git a/blazor/listbox/how-to/enable-or-disable-items.md b/blazor/listbox/how-to/enable-or-disable-items.md index 524102db6e..bf4466531c 100644 --- a/blazor/listbox/how-to/enable-or-disable-items.md +++ b/blazor/listbox/how-to/enable-or-disable-items.md @@ -7,9 +7,9 @@ control: List Box documentation: ug --- -# Enable/Disable ListBox in Blazor ListBox Component +# Enable or Disable Items in Blazor ListBox Component -Enable or disable items in the listbox, [EnableItems](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.DropDowns.SfListBox-2.html#Syncfusion_Blazor_DropDowns_SfListBox_2_EnableItems_System_Object_System_Boolean_) method can be used. In the following example, the `Bugatti Veyron Super Sport` and `SSC Ultimate Aero` items are disabled by default and by clicking `Enable Items` buttons, the disabled items will be enabled. +Enable or disable items in the listbox, [EnableItems](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.DropDowns.SfListBox-2.html#Syncfusion_Blazor_DropDowns_SfListBox_2_EnableItems__1___0_System_Boolean_) method can be used. In the following example, the `Bugatti Veyron Super Sport` and `SSC Ultimate Aero` items are disabled by default and by clicking `Enable Items` button, the disabled items will be enabled. ```cshtml @using Syncfusion.Blazor.DropDowns @@ -20,6 +20,7 @@ Enable or disable items in the listbox, [EnableItems](https://help.syncfusion.co + @code { SfListBox ListBoxObj; @@ -30,13 +31,13 @@ Enable or disable items in the listbox, [EnableItems](https://help.syncfusion.co new VehicleData { Text = "SSC Ultimate Aero", Id = "Vehicle-04" }, new VehicleData { Text = "Koenigsegg CCR", Id = "Vehicle-05" }, new VehicleData { Text = "McLaren F1", Id = "Vehicle-06" }, - new VehicleData { Text = "Aston Martin One- 77", Id = "Vehicle-07" }, + new VehicleData { Text = "Aston Martin One-77", Id = "Vehicle-07" }, new VehicleData { Text = "Jaguar XJ220", Id = "Vehicle-08" } }; public class VehicleData { - public string Text { get; set; } - public string Id { get; set; } + public string Text { get; set; } + public string Id { get; set; } } public string[] Value = new string[] { "Bugatti Veyron Super Sport", "SSC Ultimate Aero" }; private void created(object args) @@ -48,6 +49,11 @@ Enable or disable items in the listbox, [EnableItems](https://help.syncfusion.co { ListBoxObj.EnableItems(this.Value, true); } + + private void disableData() + { + ListBoxObj.EnableItems(this.Value, false); + } } ``` diff --git a/blazor/listbox/how-to/enable-scroll.md b/blazor/listbox/how-to/enable-scroll.md index a4d9c60449..caf1057823 100644 --- a/blazor/listbox/how-to/enable-scroll.md +++ b/blazor/listbox/how-to/enable-scroll.md @@ -28,13 +28,13 @@ In the following sample, the Height of the ListBox is set to 250px to enable scr new VehicleData { Text = "SSC Ultimate Aero", Id = "Vehicle-04" }, new VehicleData { Text = "Koenigsegg CCR", Id = "Vehicle-05" }, new VehicleData { Text = "McLaren F1", Id = "Vehicle-06" }, - new VehicleData { Text = "Aston Martin One- 77", Id = "Vehicle-07" }, + new VehicleData { Text = "Aston Martin One-77", Id = "Vehicle-07" }, new VehicleData { Text = "Jaguar XJ220", Id = "Vehicle-08" } }; public class VehicleData { - public string Text { get; set; } - public string Id { get; set; } + public string Text { get; set; } + public string Id { get; set; } } } diff --git a/blazor/listbox/how-to/filter-listbox.md b/blazor/listbox/how-to/filter-listbox.md index fccca7da11..6e0d61b0ef 100644 --- a/blazor/listbox/how-to/filter-listbox.md +++ b/blazor/listbox/how-to/filter-listbox.md @@ -7,9 +7,9 @@ control: List Box documentation: ug --- -# How to Filter Blazor ListBox Data Using TextBox Component +# How to Filter Blazor ListBox Data Using HTML Input Element -This example shows how to filter ListBox data based on input from a TextBox. Bind an input event listener to the TextBox to capture user input and filter the items in the ListBox. Within the event handler, use the [`FilterAsync`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.DropDowns.SfListBox-2.html#Syncfusion_Blazor_DropDowns_SfListBox_2_FilterAsync_System_Collections_Generic_IEnumerable__1__Syncfusion_Blazor_Data_Query_Syncfusion_Blazor_DropDowns_FieldSettingsModel_) method to update the ListBox items, ensuring that only those matching the input text are included. +This example shows how to filter ListBox data based on input from an HTML input element. Bind an input event listener to the input element to capture user input and filter the items in the ListBox. Within the event handler, use the [`FilterAsync`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.DropDowns.SfListBox-2.html#Syncfusion_Blazor_DropDowns_SfListBox_2_FilterAsync_System_Collections_Generic_IEnumerable__1__Syncfusion_Blazor_Data_Query_Syncfusion_Blazor_DropDowns_FieldSettingsModel_) method to update the ListBox items, ensuring that only those matching the input text are included. The [`Query`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Data.Query.html) class is used to define the filtering criteria for the ListBox data. ```cshtml @using Syncfusion.Blazor @@ -17,7 +17,7 @@ This example shows how to filter ListBox data based on input from a TextBox. Bin @using Syncfusion.Blazor.Data - + diff --git a/blazor/listbox/how-to/get-items.md b/blazor/listbox/how-to/get-items.md index 30f5f98bcf..8a6725a489 100644 --- a/blazor/listbox/how-to/get-items.md +++ b/blazor/listbox/how-to/get-items.md @@ -32,7 +32,7 @@ The following example demonstrates the `GetDataByValue` method. In this sample, new VehicleData { Text = "SSC Ultimate Aero", Id = "Vehicle-04" }, new VehicleData { Text = "Koenigsegg CCR", Id = "Vehicle-05" }, new VehicleData { Text = "McLaren F1", Id = "Vehicle-06" }, - new VehicleData { Text = "Aston Martin One- 77", Id = "Vehicle-07" }, + new VehicleData { Text = "Aston Martin One-77", Id = "Vehicle-07" }, new VehicleData { Text = "Jaguar XJ220", Id = "Vehicle-08" } }; diff --git a/blazor/listbox/how-to/select-items.md b/blazor/listbox/how-to/select-items.md index 53ed47d515..fe52c88d67 100644 --- a/blazor/listbox/how-to/select-items.md +++ b/blazor/listbox/how-to/select-items.md @@ -9,7 +9,7 @@ documentation: ug # Select Items in Blazor ListBox Component -This example shows how to programmatically select items using the [SelectItemsAsync method](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.DropDowns.SfListBox-2.html#Syncfusion_Blazor_DropDowns_SfListBox_2_SelectItemsAsync__1___0_System_Boolean_). The first parameter accepts the value or values to select, and the second parameter specifies the selection mode: set it to true to select by the mapped Value field (Text in this example), or false to select by index. Selection is triggered in the Created event to ensure the component is initialized. The `TValue` is `string[]`, which enables multiple selection. Values that do not match any items are ignored. +This example shows how to programmatically select items using the [SelectItemsAsync method](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.DropDowns.SfListBox-2.html#Syncfusion_Blazor_DropDowns_SfListBox_2_SelectItemsAsync__1___0_System_Boolean_). The first parameter accepts the value or values to select, and the second parameter specifies the selection state: set it to true to select the specified items, or false to deselect them. Selection is triggered in the Created event to ensure the component is initialized. The `TValue` is `string[]`, which enables multiple selection. Values that do not match any items are ignored. ```cshtml @using Syncfusion.Blazor.DropDowns @@ -28,13 +28,13 @@ This example shows how to programmatically select items using the [SelectItemsAs new VehicleData { Text = "SSC Ultimate Aero", Id = "Vehicle-04" }, new VehicleData { Text = "Koenigsegg CCR", Id = "Vehicle-05" }, new VehicleData { Text = "McLaren F1", Id = "Vehicle-06" }, - new VehicleData { Text = "Aston Martin One- 77", Id = "Vehicle-07" }, + new VehicleData { Text = "Aston Martin One-77", Id = "Vehicle-07" }, new VehicleData { Text = "Jaguar XJ220", Id = "Vehicle-08" } }; public class VehicleData { - public string Text { get; set; } - public string Id { get; set; } + public string Text { get; set; } + public string Id { get; set; } } public string[] Value = new string[] { "Bugatti Chiron" }; private async Task created(object args)