How to add jQuery functionality in the backend of a module?

Question

I'm making a module where the user can select some manufacturers names from the backend and the names will be posted in the index with some nice css.

I want to ask if I can add some jquery in the backend page, to make it easier for user. I want to make a text box where will count how many manufacturers the user selected ( max 30 ) and a list with every manufacturer currently selected. I will post an image to make it even more clear:

Answer 1

You will need to create a custom form field for this.

So firstly, change the type of the field in your XML like so:

<field name="brands" type="brands" label="Foreign Brands" />

Then in your XML, replace your <fieldset> with:

<fieldset addfieldpath="/modules/mod_mymodule/fields">

Then, create a new PHP file called brands.php in:

modules/mod_mymodule/fields

defined('JPATH_BASE') or die;

jimport('joomla.form.formfield');

class JFormFieldBrands extends JFormField
{
    protected $type = 'brands';

    public function getInput()
    {
       $doc = JDocument::getDocument();
       $js = '
              jQuery(document).ready(function($){
                  // Your JS code
              });
       '; 
       $doc->addScriptDeclaration($js);

       $options = array(
           'A.Dominguez' => 'A.Dominguez',
           'A.Feretti'   => 'A.Feretti',
           // Add more here
       );

       $select = JHtml::_('select.genericlist', $options, $this->name, null, 'value', 'text', $this->value, $this->id);

       return $select;
    }
}