Thursday, February 09, 2006
« Adding a hidden SharePoint Field in code... | Main | Add SharePoint Portal Exclude/ Include R... »

Here's something I thought I'd throw out there to demonstrate the much underrated Content Editor Web Part (CEWP). It's a client-side JavaScript Color Picker based on code from http://www.mickweb.com/javascript/colours/websafe.html 

The CEWP allows you to either embed formatted Rich Text into the web page or pure HTML/JavaScript so I could very quickly create a Web Part using the copied javascript. It just took a few mods such as getting rid of the image dependency by using a SPAN to form the cells instead.

The code's not much to talk about its just plain JavaScript creating a HTML <table> with <td>'s for the color cells. One interesting point is that the color table is dynamically generated. This is done by placing an empty block element, <p> in this case, giving it an ID and then set its innerHTML property to the generated table string.

function AttachColorTable(){
document.getElementById("'colourtable'").innerHTML= table_maker(36,6,'Select Colour');
}

This code is called on the load event of the page. I use attachEvent so I don't override any other code that may be using the onLoad event.

window.attachEvent('onload',AttachColorTable);

You can either import the DWP file on a single page or upload to the Site or Virtual Server galleries using instructions given by Todd Bleaker in a cool tip here http://mindsharpblogs.com/todd/archive/2005/08/04/646.aspx

Also check out the Google search Web Part also using the CEWP by Todd http://mindsharpblogs.com/todd/archive/2005/08/04/647.aspx

 

Download : Color Picker1.zip (1.36 KB)