How Do I Set An HTML Attribute For a Scala List Item Using Lift CSS Selectors?

Question

I have some Lift code that creates table rows from a List:

".row *" #> myList.map(x => {
  val rowId = x.id

  ".cell1" #> x.data &
  ".cell2" #> x.moreData 
})

Based on a template like this:

<table>
  <tr class="row">
    <td class="cell1"></td>
    <td class="cell2"></td>
  <tr>
<table>

I want output like this:

<table>
  <tr class="row" id="123">
    <td class="cell1">stuff</td>
    <td class="cell2">junk</td>
  <tr>
  <tr class="row" id="456">
    <td class="cell1">more stuff</td>
    <td class="cell2">more junk</td>
  <tr>
<table>

How do I set that id attribute to be rowId for each tr based on my List elements?

Answer 1

This should work for you:

".row" #> myList.map(x => {
  val rowId = x.id

  "tr [id]" #> rowId &
  ".cell1 *" #> x.data &
  ".cell2 *" #> x.moreData 
})

To set an attribute, you usually just need to specify the name of the attribute inside of []. So, in addition to ID, if you wanted to add a class, it would be [class]. There is also a special modifier, + which will append to the current value. So [class+] will add whatever you specify to the current values.

It is also worth noting that some drafts of the HTML spec require at least one letter in the ID, see this question for an explanation of why.