[html-formfu] Modify the class tag for the options in select elements

Ascii King tech at swattermatter.com
Fri Aug 21 15:36:35 GMT 2009


Can I automatically populate the class tag in an option for a select 
element that is built using a resultset?

I have checked the archives, but the closest I came was this code from 
Carl Franks: 
http://www.mail-archive.com/html-formfu@lists.scsys.co.uk/msg01569.html

I have a select element that is used to pick a category to display on 
the form. It uses CSS and simply checks the class tag of an option and 
displays the appropriate form elements based on what it finds.

        - type: Select
          name: expense_category
          label: Expense Category
          options:
            - value:
              label: Please select one ...

            - value: 3
              label: Accommodations
              attributes:
                class: switch-d

            - value: 4
              label: Air Ambulance
              attributes:
                class: switch-g


This works fine. My CSS code checks to see if the class is switch-d or 
switch-g and displays the appropriate element. However, I want to pull 
this data from a table in the database rather than hard code it. So, I 
use this.

        - type: Select
          name: expense_category
          label: Expense Category
          empty_first: 1
          model_config:
            resultset: ExpenseCategory
            id_column: expense_category_id
            label_column: category


The value I want to put in the class I have stored in the database with 
the expense_category record in a field named switch. (I can't see 
anywhere else it can go!)  But, I can't get that 'switch' field into an 
option class. I tried variations on the following code without success:


        - type: Select
          name: expense_category
          label: Expense Category
          empty_first: 1
          model_config:
            resultset: ExpenseCategory
            id_column: expense_category_id
            label_column: category
            attributes:
                class: switch

My final output should have the class="switch-d" and class="switch-g" in 
the options.

<div class="select label">
  <label for="expense_category[1]">Expense Category</label>
  <select name="expenditures_1.expense_category" id="expense_category[1]">
    <option value=""></option>
    <option value="3" class="switch-d">Accommodations</option>
    <option value="4" class="switch-g">Air Ambulance</option>
  </select>
</div>

Thanks.



More information about the HTML-FormFu mailing list