1. Feedback
  2. Blazor
  3. 51500

Welcome to the Blazor feedback portal. We’re happy you’re here! If you have feedback on how to improve the Blazor, we’d love to hear it!

  • Check out the features or bugs others have reported and vote on your favorites. Feedback will be prioritized based on popularity.
  • If you have feedback that’s not listed yet, submit your own.

Thanks for joining our community and helping improve Syncfusion products!

1
Vote

If a grid column is set to 'visible: false' and you click 'add' in the edit dialog, it throws a console error

Hello,

Is anyone encounter the same problem? Can't figure out how to fix with the data grid

Nuget version: 24.2.5

** error

Incorrect use of <label for=FORM_ELEMENT>

The label's for attribute doesn't match any element id. This might prevent the browser from correctly autofilling the form and accessibility tools from working correctly.

To fix this issue, make sure the label's for attribute references the correct id of a form field.


<SfGrid TValue="Item"  
        EnablePersistence="true"
        AllowPaging="true"
        AllowFiltering="true"
        AllowSorting="true"
        Toolbar="@(new List<string>() { "Add", "Edit", "Delete", "Cancel", "Update" })">
    <SfDataManager  Url="https://localhost:7169/odata/items" Adaptor="Adaptors.ODataV4Adaptor"></SfDataManager>
    <GridEditSettings AllowAdding="true" 
                      AllowDeleting="true" 
                      AllowEditing="true" 
                      Mode="EditMode.Dialog"/>

    <GridEvents OnActionBegin="OnActionBegin"
                OnActionFailure="ActionFailureHandler"
                TValue="Item"/>
    <GridColumns>
        <GridColumn Field=@nameof(Item.Id) 
                    HeaderText="Item ID" 
                    IsPrimaryKey="true" 
                    Visible="false" 
                    Width="120" 
                    AllowAdding="false" 
                    AllowEditing="false"
                    Type="ColumnType.Integer"/>
        <GridColumn Field=@nameof(Item.Code) 
                    HeaderText="Item Code" 
                    Width="150"
                    Type="ColumnType.String"
                    ValidationRules="@(new ValidationRules{ Required= true, MaxLength = 100 })" />
        <GridColumn Field=@nameof(Item.Name) 
                    HeaderText="Item Name" 
                    Type="ColumnType.String"
                    Width="150"
                    ValidationRules="@(new ValidationRules{ Required= true, MaxLength = 200 })" />
        <GridColumn Field=@nameof(Item.Description) 
                    HeaderText="Item Description" 
                    Type="ColumnType.String"
                    ValidationRules="@(new ValidationRules{ MaxLength = 500 })" />
        <GridColumn Field=@nameof(Item.IsItemConsigment) 
                    HeaderText="Is Consigment?" 
                    Type="ColumnType.Boolean"
                    Width="120"/>
        <GridColumn Field=@nameof(Item.Active) 
                    Type="ColumnType.Boolean"
                    HeaderText="Is Active?"
                    Width="120"/>
        <GridColumn Field=@nameof(Item.CreatedDate) 
                    HeaderText="Datetime Created" 
                    Format="d" 
                    Type="ColumnType.DateTime" 
                    Width="130" 
                    AllowAdding="false" 
                    AllowEditing="false"/>
    </GridColumns>
</SfGrid>
Replication steps:

-->Run the provided sample.

--->Then, open the addition operation in the grid. You will notice the issue 'Incorrect use of label for FORM_ELEMENT' in the console."