menu

Blazor

  • Code Examples
  • Upgrade Guide
  • User Guide
  • Demos
  • Support
  • Forums
  • Download
Class MultiColumnComboboxColumn - Blazor API Reference | Syncfusion

    Show / Hide Table of Contents

    Class MultiColumnComboboxColumn

    Represents a single column within a MultiColumnCombobox component. Defines the properties and behavior of a column, such as its header text, data field, and display format.

    Inheritance
    System.Object
    MultiColumnComboboxColumn
    Namespace: Syncfusion.Blazor.MultiColumnComboBox
    Assembly: Syncfusion.Blazor.dll
    Syntax
    public class MultiColumnComboboxColumn : OwningComponentBase
    Examples

    A simple MultiColumnCombobox with customized columns.

    <SfMultiColumnComboBox TValue="string" TItem="Employee" 
                           DataSource="@employees" 
                           TextField="Name" 
                           ValueField="ID">
        <MultiColumnComboboxColumns>
            <MultiColumnComboboxColumn Field="ID" Header="Employee ID" Width="100px" TextAlign="TextAlign.Center">
            </MultiColumnComboboxColumn>
            <MultiColumnComboboxColumn Field="Name" Header="Employee Name" Width="150px">
            </MultiColumnComboboxColumn>
            <MultiColumnComboboxColumn Field="Department" Header="Department" Width="120px">
            </MultiColumnComboboxColumn>
        </MultiColumnComboboxColumns>
    </SfMultiColumnComboBox>

    Constructors

    MultiColumnComboboxColumn()

    Declaration
    public MultiColumnComboboxColumn()

    Properties

    CustomAttributes

    Allows customization of the CSS styles and attributes of the content cells for this column.

    Declaration
    public IDictionary<string, object> CustomAttributes { get; set; }
    Property Value
    Type Description
    System.Collections.Generic.IDictionary<System.String, System.Object>

    An System.Collections.Generic.IDictionary<, > of string keys and object values representing custom attributes. The default value is null.

    Remarks

    This property accepts a dictionary of attribute names and their corresponding values, allowing you to apply custom CSS classes, styles, or other HTML attributes to the column cells.

    Examples

    Applying custom attributes to column cells.

    <MultiColumnComboboxColumn Field="Name" Header="Name" CustomAttributes="@(new Dictionary<string, object> { {"class", "custom-cell"}, {"style", "font-weight: bold;"} })">
    </MultiColumnComboboxColumn>

    DisplayAsCheckBox

    Gets or sets a value indicating whether the column value should be displayed as a checkbox.

    Declaration
    public bool DisplayAsCheckBox { get; set; }
    Property Value
    Type Description
    System.Boolean

    A bool value indicating whether to display the column as a checkbox. The default value is false.

    Remarks

    When set to true, the column value is rendered as a checkbox instead of a boolean value. This is typically used for boolean data fields.

    Examples

    Displaying a boolean column as a checkbox.

    <MultiColumnComboboxColumn Field="IsActive" Header="Active" DisplayAsCheckBox="true">
    </MultiColumnComboboxColumn>

    Field

    Defines the field name of the column, which is mapped to the corresponding field in the DataSource.

    Declaration
    public string Field { get; set; }
    Property Value
    Type Description
    System.String

    A string representing the field name from the data source. The default value is null.

    Remarks

    The bound columns can be used for various operations such as sorting, filtering, and grouping. If the field name contains a dot (.), it is considered complex binding, which is typically used for accessing nested properties.

    Examples

    Setting the Field property for a column.

    <MultiColumnComboboxColumn Field="Employee.Name" Header="Employee Name">
    </MultiColumnComboboxColumn>

    Format

    Defines the format of the column's displayed value without affecting the original data.

    Declaration
    public string Format { get; set; }
    Property Value
    Type Description
    System.String

    A string representing the format pattern. The default value is null.

    Remarks

    The format can be a standard or custom format string. This is particularly useful for formatting dates, numbers, or currency values.

    Examples

    Formatting date and currency columns.

    <MultiColumnComboboxColumn Field="HireDate" Header="Hire Date" Format="MM/dd/yyyy">
    </MultiColumnComboboxColumn>
    <MultiColumnComboboxColumn Field="Salary" Header="Salary" Format="C2">
    </MultiColumnComboboxColumn>

    Header

    Defines the header text of the column, which is displayed in the column header.

    Declaration
    public string Header { get; set; }
    Property Value
    Type Description
    System.String

    A string representing the header text. The default value is null.

    Remarks

    If the header text is not defined, the value of the Field property will be used as the header text.

    Examples

    Setting a custom header text for a column.

    <MultiColumnComboboxColumn Field="EmpName" Header="Employee Name">
    </MultiColumnComboboxColumn>

    HeaderTemplate

    Defines the header template that renders a customized element in the header cell of the column.

    Declaration
    public RenderFragment<object> HeaderTemplate { get; set; }
    Property Value
    Type Description
    Microsoft.AspNetCore.Components.RenderFragment<System.Object>

    A Microsoft.AspNetCore.Components.RenderFragment<> of type object that represents the custom template for the column header. The default value is null.

    Remarks

    This template allows you to customize the content of the column header, such as adding icons, sorting indicators, or other visual elements.

    Examples

    Using a custom header template with an icon.

    <MultiColumnComboboxColumn Field="Name" Header="Employee Name">
        <HeaderTemplate>
            <div>
                <i class="fas fa-user"></i>
                Employee Name
            </div>
        </HeaderTemplate>
    </MultiColumnComboboxColumn>

    Parent

    Specifies the base parent of the component.

    Declaration
    protected MultiColumnComboboxColumns Parent { get; set; }
    Property Value
    Type
    MultiColumnComboboxColumns

    Template

    Defines the column template that renders a customized element in each cell of the column.

    Declaration
    public RenderFragment<object> Template { get; set; }
    Property Value
    Type Description
    Microsoft.AspNetCore.Components.RenderFragment<System.Object>

    A Microsoft.AspNetCore.Components.RenderFragment<> of type object that represents the custom template for the column cells. The default value is null.

    Remarks

    The parameters passed to the templates can be accessed using the implicit parameter named context. The context is of type object and contains the data item for the current row.

    Examples

    Using a custom template to display data.

    <MultiColumnComboboxColumn Field="Status" Header="Status">
        <Template>
            @{
                var employee = context as Employee;
            }
            <span style="color: @(employee.Status == "Active" ? "green" : "red")">
                @employee.Status
            </span>
        </Template>
    </MultiColumnComboboxColumn>

    TextAlign

    Defines the alignment of the text in both the header and content cells of the column.

    Declaration
    public TextAlign TextAlign { get; set; }
    Property Value
    Type Description
    TextAlign

    A TextAlign enumeration value that specifies the text alignment. The default value is TextAlign.Left.

    Remarks

    The possible values are:

    • LeftText is aligned to the left.
    • RightText is aligned to the right.
    • CenterText is centered.
    • JustifyText is justified.
    Examples

    Setting text alignment for different columns.

    <MultiColumnComboboxColumn Field="ID" Header="ID" TextAlign="TextAlign.Center">
    </MultiColumnComboboxColumn>
    <MultiColumnComboboxColumn Field="Amount" Header="Amount" TextAlign="TextAlign.Right">
    </MultiColumnComboboxColumn>

    TextOverflowMode

    Gets or sets a value that defines how the text content is clipped when it overflows in the MultiColumnComboBox column.

    Declaration
    public TextOverflowMode TextOverflowMode { get; set; }
    Property Value
    Type Description
    TextOverflowMode

    A TextOverflowMode value that specifies the clipping behavior. The default value is TextOverflowMode.Ellipsis.

    Remarks

    The TextOverflowMode property controls how text is truncated when it overflows the available space. The following options are available:

    Examples

    Setting text overflow behavior for a column.

    <MultiColumnComboboxColumn Field="Description" Header="Description" TextOverflowMode="TextOverflowMode.EllipsisWithTooltip">
    </MultiColumnComboboxColumn>

    Width

    Defines the width of the column in pixels or as a percentage.

    Declaration
    public string Width { get; set; }
    Property Value
    Type Description
    System.String

    A string representing the column width. The default value is null, meaning that the column will have an automatic width based on its content.

    Remarks

    You can specify the width in pixels (e.g., "100px") or as a percentage (e.g., "25%"). If not specified, the column will automatically adjust its width based on the content.

    Examples

    Setting column width in pixels and percentage.

    <MultiColumnComboboxColumn Field="ID" Header="ID" Width="80px">
    </MultiColumnComboboxColumn>
    <MultiColumnComboboxColumn Field="Name" Header="Name" Width="30%">
    </MultiColumnComboboxColumn>
    Back to top Generated by DocFX
    Copyright © 2001 - 2025 Syncfusion Inc. All Rights Reserved