I've disable chosen.js so that all my <select> tags are plain HTML, but am so far unable to change the default class of inputbox to one of my choosing, (specificially from the Search Tools filters of my component page).

I've looked at a number of answers and tutorials about overriding forms, but I'm either not understanding the examples, or looking at the wrong kind of overrides.

Ultimately, I want to change the class of any <select> that is generated in libraries\cms\html\select.php. I've tried adding the path/file to my template, but can't get that to do it. I see that it's generating the field with $options as below, but I can't figure where THAT is being determined and supplied.

$options Array (
    [format.depth] => 0
    [format.eol] => 

    [format.indent] =>  
    [id] => filter_event_group_id
    [list.attr] => class="inputbox" onchange="this.form.submit()"
    [list.translate] => 
    [option.key] => value
    [option.text] => text
    [list.select] => 

My attempts at specifying it in the XML at List form field type are failing as well - the page just comes up blank, though that was a shot in the dark because my field is actually a SQL Form Field Type which apparently does NOT support the Class parameter like the Select does.

<field name="created_by" class="MyChosenClassname" type="sql"...`

So, the question is either how do I add this override to my template properly, or how do I specify the Class name to be used in the generated <select> tags?

  • Just curious. The class name is nothing magical in itself, why not just use that class name in your css and do whatever you need through that? – Arlen Aug 14 at 13:45
  • @Arlen The class IS in my CSS, but the Joomla function(s) have no mechanism to include that class name for field type SQL when it generates the select list. Having that class name in the CSS isn't the problem, it's having the class name included in the select list for jquery to do what it needs to do. – GDP Aug 15 at 16:23

You should just be able to add the class attribute to the XML field, like so:

<field name="foo" class="MYCLASS" type="list" label="My List">
    <option value="0">Option 1</option>
    <option value="1">Option 2</option>
  • For a <select> field, tat will will work, but not for a SQL field type. – GDP Mar 16 '18 at 12:27

I find it easier to add a custom class using jQuery.

just put this javascript code snippet in the head section of your template, the majority of template/frameworks providers supports custom javascript code to be added easily.


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.