DropdownList: Disable item with callback (#5317)

* DropdownList | Add DisabledItem func * Demo | DropdownListPage | Add example * Docs | DropdownListPage | Add DisabledItem * Release Notes | DisabledItem * Format --------- Co-authored-by: Mladen Macanovic <[email protected]>
Megabit · Feb 17, 2024 · 1b118bf · 1b118bf
1 parent 338293d
commit 1b118bf
Show file tree

Hide file tree

Showing 5 changed files with 48 additions and 5 deletions.
diff --git a/Demos/Blazorise.Demo/Pages/Tests/DropdownListPage.razor b/Demos/Blazorise.Demo/Pages/Tests/DropdownListPage.razor
@@ -15,6 +15,7 @@
                                       Data="@Countries"
                                       TextField="@(( item ) => item.Name)"
                                       ValueField="@((item) => item.Iso)"
+                                      DisabledItem="@(item => item.Name == "Armenia")"
                                       @bind-SelectedValue="@selectedDropValue"
                                       Color="Color.Primary"
                                       MaxMenuHeight="200px"
@@ -46,6 +47,7 @@
                                       Data="@Countries"
                                       TextField="@(( item ) => item.Name)"
                                       ValueField="@((item) => item.Iso)"
+                                      DisabledItem="@(item => item.Name == "Armenia")"
                                       @bind-SelectedValues="@selectedDropValues"
                                       SelectionMode="DropdownListSelectionMode.Checkbox"
                                       Color="Color.Primary"

diff --git a/Documentation/Blazorise.Docs/Pages/Docs/Extensions/DropdownList/DropdownListPage.razor b/Documentation/Blazorise.Docs/Pages/Docs/Extensions/DropdownList/DropdownListPage.razor
@@ -95,4 +95,7 @@
     <DocsAttributesItem Name="DropdownToggleSize " Type="Size" Default="Default">
         Defines the size of toggle button.
     </DocsAttributesItem>
+    <DocsAttributesItem Name="DisabledItem" Type="Func<TItem, bool>">
+        Method used to get the disabled items from the supplied data source.
+    </DocsAttributesItem>
 </DocsAttributes>
diff --git a/Documentation/Blazorise.Docs/Pages/News/2024-02-15-release-notes-150.razor b/Documentation/Blazorise.Docs/Pages/News/2024-02-15-release-notes-150.razor
@@ -141,4 +141,12 @@
     Now it is possible to show an extra information on the <Code>Rating</Code> component. By defining the <Code>GetTooltip</Code> callback you can show the tooltip to indicate what is the rating value that it represents.
 </Paragraph>
 
+<Heading Size="HeadingSize.Is3">
+    DropdownList
+</Heading>
+
+<Paragraph>
+    Added a new Parameter <Code>DisabledItem</Code>. By defining this, you can set the disabled items from the supplied data source.
+</Paragraph>
+
 <NewsPagePostInfo UserName="Mladen Macanović" ImageName="mladen" PostedOn="February 29th, 2024" Read="9 min" />
diff --git a/Source/Extensions/Blazorise.Components/DropdownList.razor b/Source/Extensions/Blazorise.Components/DropdownList.razor
@@ -9,14 +9,14 @@
             @if ( Virtualize && Data is ICollection<TItem> collectionableData )
             {
                 <Virtualize TItem="TItem" Context="item" Items="@collectionableData">
-                    @itemFragment(item)
+                    @itemFragment( item )
                 </Virtualize>
             }
             else
             {
                 @foreach ( var item in Data ?? Enumerable.Empty<TItem>() )
                 {
-                    @itemFragment(item)
+                    @itemFragment( item )
                 }
             }
         }
@@ -25,10 +25,11 @@
 @code {
     protected RenderFragment<TItem> itemFragment => item => __builder =>
     {
-        var text = TextField?.Invoke( item );
-        var value = ValueField != null ? ValueField.Invoke( item ) : default;
+        var text = GetItemText( item );
+        var value = GetItemValue( item );
+        var disabled = GetItemDisabled( item );
 
-        <DropdownItem @key="@item" Clicked="@HandleDropdownItemClicked" Value="@value"
+        <DropdownItem @key="@item" Clicked="@HandleDropdownItemClicked" Value="@value" Disabled="@disabled"
                       ShowCheckbox="@(SelectionMode == DropdownListSelectionMode.Checkbox)"
                       Checked="IsSelected(value)"
                       CheckedChanged="@((isChecked) => HandleDropdownItemChecked(isChecked, value))">@text</DropdownItem>

diff --git a/Source/Extensions/Blazorise.Components/DropdownList.razor.cs b/Source/Extensions/Blazorise.Components/DropdownList.razor.cs
@@ -79,6 +79,30 @@ public Task Focus( bool scrollToElement = true )
         return dropdownToggleRef.Focus( scrollToElement );
     }
 
+    private string GetItemText( TItem item )
+    {
+        if ( TextField is null )
+            return string.Empty;
+
+        return TextField.Invoke( item );
+    }
+
+    private TValue GetItemValue( TItem item )
+    {
+        if ( ValueField is null )
+            return default;
+
+        return ValueField.Invoke( item );
+    }
+
+    private bool GetItemDisabled( TItem item )
+    {
+        if ( DisabledItem is null )
+            return false;
+
+        return DisabledItem.Invoke( item );
+    }
+
     #endregion
 
     #region Properties
@@ -195,5 +219,10 @@ protected bool IsSelected( TValue value )
     /// </summary>
     [Parameter] public EventCallback<IReadOnlyList<TValue>> SelectedValuesChanged { get; set; }
 
+    /// <summary>
+    /// Method used to get the disabled items from the supplied data source.
+    /// </summary>
+    [Parameter] public Func<TItem, bool> DisabledItem { get; set; }
+
     #endregion
 }