aslamdoctor aslamdoctor - 2 months ago 7
HTML Question

How to fill html table made grid with colors using mouse click?

I want to create a simple tool so that user can fill colors inside html table fields or whatever the alternative you can suggest.
Take a look at this page:
http://www.olmares.com/Price%20and%20Availability.htm

I am looking for some tool, interface, Javascript or any other way so that my client fill in the table boxes with colors easily. How can I achieve this?

Answer

I have added an extra, so when you click on highlighted td, it will remove it.

Working link : http://jsfiddle.net/dEy2H/

CSS

.HighLight {background-color:#ff0000 !important;}

jQuery

$(function() {
    $('td').click(function() {
        if ($(this).hasClass('HighLight'))
            $(this).removeClass('HighLight');
        else
            $(this).addClass('HighLight');
    });
});