View Full Version : User-defined check mark and checkbox control

3 Apr 2013, 2:55 PM

I would like to replace the default check mark that appears in the checkbox input form element for checkboxes on a particular form in my application so they look like this:

In other words, replace the default check mark with a red one that extends beyond the checkbox itself, as shown above.

I found some CSS overrides in the ExtJS 4.x checkbox API docs, and see an image map in the Chrome debugger, but not sure what approach to take to create a user-draw checkbox control like this.


4 Apr 2013, 1:49 AM
Try not to be blinded by all the smoke and mirrors. The bottom line is it's just a background-image and you can change it by simple CSS. If you only want to target some checkboxes, rather than changing all of them, then just use the cls config so you can target your selectors accordingly.

If you're using the SASS theming stuff then you might like to use the variables provided, e.g.:

$form-checkbox-image: 'form/checkbox.png';
$form-checkbox-size: 25px;