在 ruby​​ on rails 动态 id 不能用于两个词，但可以完美地用于一个词——使用引导程序崩溃

Posted 2023-03-21

【中文标题】在 ruby​​ on rails 动态 id 不能用于两个词，但可以完美地用于一个词——使用引导程序崩溃

【英文标题】：In ruby on rails Dynamic id isn't working for two words but worked perfectly for one word --used bootstrap collapse

【发布时间】：2021-10-11 19:17:03

【问题描述】：

我正在处理我项目的设备部分。我已将brandname 分组并将品牌名称作为id 传递。我的问题是动态 id 不适用于两个词，例如。 Hero Honda 但完美地为一个词工作，例如。 Yamaha

我的控制器的代码是：

  def index
    @devices = Device.all.group_by(&:brandname)
    @device = current_user.devices.build
  end

这是我的观点代码

 button.btn.btn-sm.btn-outline-info aria-controls="12" aria-expanded="false" data-target="#hello#device_name" data-toggle="collapse" type="button" 
          | Details
    .collapse.container.mx-5 id="hello#device_name"
          .container.bg-light 
            .row.bg-secondary.p-2.my-2
                .col-3.col-md-3.text-center MAC address
                .col-2.col-md-2.text-center Serial Number
                .col-2.col-md-2.text-center Software
                .col-2.col-md-2.text-center  Number
                .col-1.col-md-1.text-center  Status
              
                           
            - device_data.each do |device|
              .row.py-2
                    .col-3.text-center = device.macaddress
                    .col-2.text-center = device.serialnumber
                    .col-2.text-center = device.softwareversion
                    .col-2.text-center = device.IMEInumber
                    .col-1.text-center = device.status
                    .col-2.text-center = device.id 

Here I present the console of browser how program takes dynamic id.

【参考方案1】：

html id 标签不能有空格。因此，我建议您首先转换您的 brandname 以使其不包含空格。例如：您可以将您的空间转换为- 或_。

id="hello-#device_name.parameterize"
# => hello-hero-honda

或

id="hello_#device_name.parameterize.underscore"
# => hello_hero_honda

---

注意：使用除 ASCII 字母、数字、'_'、'-' 和 '.' 以外的字符可能会导致兼容性问题，因为它们在 HTML 4 中是不允许的。尽管在 HTML5 中取消了此限制，但为了兼容性，ID 应该以字母开头。 (Ref)

所以 camelCase 似乎是一个更好的选择。

id="hello#device_name.parameterize.underscore.camelize"
# => helloHeroHonda