Beautify lookups (dropdowns)

Available since in April 2020.

Attention
There is a display bug with lookups in tabs which will be fixed in version July 2020

See also:

Default dropdown style

This is how dropdowns/lookups look by default. As you can see there is a gap between the buttons and the style of the dropdown (having a gradient background) looks differently in comparison to other controls.

Modified dropdown style

With a single line of code you will be able to align the buttons, adjust the look, remove the gaps and even change icons.

new AppGiniField("partner_id").dropdown().fix("pencil", "plus");
Modified Lookup

(1) Remove gaps and align buttons

Code

// file: hooks/TABLENAME-dv.js

// single field: beautify
new AppGiniField("partner_id").dropdown().fix();

Result

(2) Change Icons

Code

// file: hooks/TABLENAME-dv.js

// single field: beautify + change icons
new AppGiniField("partner_id").dropdown().fix("pencil", "asterisk");

Result

(3) Remove (green) variation

Code

// file: hooks/TABLENAME-dv.js

// single field, beautify + change icons + remove variation
new AppGiniField("partner_id").dropdown().fix("search", "plus", true);

Result

Glyphicons

Read more about glyphicons here.

See also

Do you like it?