Class SfChip

The SfChip component displays a list of chip each of which contains a block of essential information that triggers an event on click action.

Inheritance

object

ComponentBase

OwningComponentBase

SfOwningComponentBase

SfBaseComponent

SfChip

Implements

IComponent

IHandleEvent

IHandleAfterRender

IDisposable

Inherited Members

ComponentBase.Assets

ComponentBase.AssignedRenderMode

ComponentBase.DispatchExceptionAsync(Exception)

ComponentBase.InvokeAsync(Action)

ComponentBase.InvokeAsync(Func<Task>)

ComponentBase.OnAfterRender(bool)

ComponentBase.OnInitialized()

ComponentBase.OnParametersSet()

ComponentBase.OnParametersSetAsync()

ComponentBase.RendererInfo

ComponentBase.SetParametersAsync(ParameterView)

ComponentBase.ShouldRender()

ComponentBase.StateHasChanged()

object.Equals(object)

object.Equals(object, object)

object.GetHashCode()

object.GetType()

object.MemberwiseClone()

object.ReferenceEquals(object, object)

object.ToString()

OwningComponentBase.IsDisposed

OwningComponentBase.ScopedServices

SfBaseComponent.Dispose()

SfBaseComponent.Dispose(bool)

SfBaseComponent.GetEffectivePlatform()

SfBaseComponent.GetMainComponentPlatform()

SfBaseComponent.IsMainLicenseComponent()

SfBaseComponent.LicenseContext

SfBaseComponent.OnObservableChange(string, object, bool, NotifyCollectionChangedEventArgs)

SfBaseComponent.ValidateLicense()

Namespace: Syncfusion.Blazor.Buttons

Assembly: Syncfusion.Blazor.dll

Syntax

public class SfChip : SfBaseComponent, IComponent, IHandleEvent, IHandleAfterRender, IDisposable

Constructors

SfChip()

Declaration

public SfChip()

Properties

ChildContent

Specifies the ChildContent.

Declaration

[Parameter]
public RenderFragment ChildContent { get; set; }

Property Value

Type
RenderFragment

Chips

This chips property helps to render chipitem component.

Declaration

[Parameter]
public List<ChipItem> Chips { get; set; }

Property Value

Type	Description
List<ChipItem>	Accepts the list of chip items. Each chip item should contain a text value.

CssClass

Gets or sets the custom CSS classes for the chip element, allowing customization of the chip component's appearance.

Declaration

[Parameter]
public string CssClass { get; set; }

Property Value

Type	Description
string	A string containing CSS class names separated by spaces. The default value is an empty string.

Remarks

Use this property to apply one or more CSS classes, separated by spaces, to modify the look and feel of the chip component.

EnableDelete

Gets or sets a boolean value to enable delete functionality.

Declaration

[Parameter]
public bool EnableDelete { get; set; }

Property Value

Type	Description
bool	true, if the chip component can be deleted. The default value is false.

EnableRtl

Gets or sets a value to enable or disable the component rendering in right to left direction.

Declaration

[Parameter]
public bool EnableRtl { get; set; }

Property Value

Type	Description
bool	true, if the right to left direction can be enabled for the component. The default value is false.

Enabled

Gets or sets a boolean value to enable or disable the chipitem component.

Declaration

[Parameter]
public bool Enabled { get; set; }

Property Value

Type	Description
bool	true, If the item can be enabled. Otherwise, false. The default value is true.

HtmlAttributes

Gets or sets the additional html attributes such as title, native events etc., to the wrapper element.

Declaration

[Parameter(CaptureUnmatchedValues = true)]
public Dictionary<string, object> HtmlAttributes { get; set; }

Property Value

Type
Dictionary<string, object>

Remarks

Additional attributes can be added by specifying as inline attributes or by specifying @attributes directive.

SelectedChips

Gets or sets the selected chip items text.

Declaration

[Parameter]
public string[] SelectedChips { get; set; }

Property Value

Type	Description
string[]	Accepts the array of string (chip's text) to select items in chips. The default value is an empty array.

Remarks

Use this property to specify or retrieve the text of the chip items currently selected.

SelectedChipsChanged

Gets or sets the event callback to trigger when the selected chips changes.

Declaration

[Parameter]
public EventCallback<string[]> SelectedChipsChanged { get; set; }

Property Value

Type	Description
EventCallback<string[]>	An event callback function.

Remarks

You can get the updated SelectedChips value.

Examples

In the below code example, the SelectedChips value can be obtained from the SelectedChipsChanged event.

<SfChip Selection="SelectionType.Multiple" SelectedChipsChanged="SelectedChipsChanged">
    <ChipItems>
        <ChipItem Text = "Small"></ChipItem>
        <ChipItem Text = "Medium"></ChipItem>
        <ChipItem Text = "Large"></ChipItem>
        <ChipItem Text = "Extra Large"></ChipItem>
    </ChipItems>
</SfChip>
@code {
    private void SelectedChipsChanged(string[] args) {
        string[] selectedChipItem = args;
    }
}

Selection

Gets or sets the chip selection type.

Declaration

[Parameter]
public SelectionType Selection { get; set; }

Property Value

Type	Description
SelectionType	One of the SelectionType enumeration that specifies the selection of chip items in selection mode. The default value is None.

Methods

AddChip(ChipItem)

A function that adds the chip items based on given input.

Declaration

public void AddChip(ChipItem item)

Parameters

Type	Name	Description
ChipItem	item	Chip Item to be added should be passed.

BuildRenderTree(RenderTreeBuilder)

Declaration

protected override void BuildRenderTree(RenderTreeBuilder __builder)

Parameters

Type	Name	Description
RenderTreeBuilder	__builder

Overrides

ComponentBase.BuildRenderTree(RenderTreeBuilder)

FindChip(string)

A function that finds chip based on given chip value.

Declaration

public ChipItem FindChip(string chipValue)

Parameters

Type	Name	Description
string	chipValue	Value of the chip need to be passed to get the corresponding chip model.

Returns

Type	Description
ChipItem	GetItem.

GetSelectedChips()

A function that returns the selected chips data.

Declaration

public List<ChipItem> GetSelectedChips()

Returns

Type	Description
List<ChipItem>	selectedChipModels.

OnAfterRenderAsync(bool)

Method invoked after each time the component has been rendered.

Declaration

protected override Task OnAfterRenderAsync(bool firstRender)

Parameters

Type	Name	Description
bool	firstRender	Set to true for the first time component rendering; otherwise gets false.

Returns

Type	Description
Task	="Task".

Overrides

SfBaseComponent.OnAfterRenderAsync(bool)

OnInitializedAsync()

Method gets invoked when the component is ready to start.

Declaration

protected override Task OnInitializedAsync()

Returns

Type	Description
Task	="Task".

Overrides

SfBaseComponent.OnInitializedAsync()

RemoveChips(string[])

A function that removes the chip items based on given chip values.

Declaration

public void RemoveChips(string[] removableChipValues)

Parameters

Type	Name	Description
string[]	removableChipValues	Values of the chips which are to be removed should be passed.

SelectChips(string[])

A function that selects chip items based on given index.

Declaration

public void SelectChips(string[] selectableChips)

Parameters

Type	Name	Description
string[]	selectableChips	Values of the chips which are to be selected should be passed.

UpdateAttributes()

Updates the class and multiselection attributes of the chip root element.

Declaration

protected void UpdateAttributes()

UpdateAttributes(Dictionary<string, object>)

Updates the attributes value.

Declaration

protected void UpdateAttributes(Dictionary<string, object> htmlAttributes = null)

Parameters

Type	Name	Description
Dictionary<string, object>	htmlAttributes	The htmlAttributes.

Implements

IComponent

IHandleEvent

IHandleAfterRender

IDisposable