Problem/Motivation

When using a NID as class token for a table view display both row and table cell, the first digit of the NID gets replaced with an underscore.

Setup used for testing:
Drupal Version: 9.3.0-dev (The issue was also noted on 9.2.x)
Drupal current Setup

Steps to reproduce

1. Create a view for any content type, with the following setup:
- List content
- Format: Table.
- Under Fields, add the node ID and node Title (or any other field, just for visualization.
- In the Format, Table setting. Add {{ nid }} as the Row class:
Table setup

- In the fields settings, check the "Customize field HTML" and " Create a CSS class" options and add {{nid}} and the CSS Class. Apply the changes
Field setup

- Inspect the table and check that the first digit on the ID is replaced with an underscore:
Error

Proposed resolution

The actual NID gets rendered correctly, without the underscore.

Remaining tasks

User interface changes

API changes

Data model changes

Release notes snippet

CommentFileSizeAuthor
Screenshot from 2021-12-13 07-56-52.png70.11 KBbarone
Screenshot from 2021-12-13 07-50-19.png126.95 KBbarone
Screenshot from 2021-12-13 07-48-03.png59.96 KBbarone
Screenshot from 2021-12-13 07-45-48.png51.32 KBbarone

Comments

barone created an issue. See original summary.

larowlan’s picture

larowlan
Location 🇦🇺🏝.au GMT+10
commented
Category: Bug report » Support request
Issue tags: -views, -nodeid, -View table +Bug Smash Initiative

Pretty sure you can't use numbers as classes in html

Try using node-{{nid}}

lendude’s picture

lendude
Primary language Dutch
Location Amsterdam
commented
Status: Active » Closed (works as designed)

Yes as @larowlan points out, classes cannot start on a number.

In Views this is assured in \Drupal\views\Plugin\views\field\FieldPluginBase::elementClasses by a call to \Drupal\Component\Utility\Html::cleanCssIdentifier which states :

    // Identifiers cannot start with a digit, two hyphens, or a hyphen followed by a digit.
    $identifier = preg_replace([
      '/^[0-9]/',
      '/^(-[0-9])|^(--)/',
    ], ['_', '__'], $identifier);

So this works as designed.