ASP.NET Color Picker - Without TargetId





Change my parent's background color
Color Picker





This example demonstrates Color Picker use without TargetId property.
Also here you can see how to redefine some default style classes.

Example code

<%@ Register TagPrefix="obout" Namespace="OboutInc.ColorPicker" Assembly="obout_ColorPicker" %>
...
<script type="text/JavaScript">
function OnColorOpen(sender){
  var parent =sender.getPickerElement().parentNode;
  sender.setColor(OboutInc.ColorPicker.getStyle(parent,"background-color"));
}
function OnColorPicked(sender){
  var parent =sender.getPickerElement().parentNode;
  parent.style.backgroundColor= sender.getColor();
}
</script>
<style type="text/css">
  /* Redefine some default CSS rules */
  span.ColorPicker_Caller {border-width:1px; border-style:solid; border-color:#D0D0F8background-color:#FFFFFF;}
  span.ColorPicker_Caller:hover {border-color:#0000FF; background-color:#F0F0F8;}
  span.ColorPicker_Title {color: #0000FF;}
  table.ColorPicker_ColorsTable {background-color: #b8beca; border-color: #b8beca;}
  img.ColorPicker_Pallete {border-color: #b8beca;}
  div.ColorPicker_ColorPalleteContainer {border-width: 0px;}
  div.ColorPicker_GrayPalleteContainer {border-width: 0px;}
</
style>
...
<obout:ColorPicker runat="server" OnClientOpen="OnColorOpen" OnClientPicked="OnColorPicked" >
      Change my parent's background color
</obout:ColorPicker>

See the full source code in /ColorPicker/aspnet_withoutTargetId.aspx file of downloaded Suite.

"I just discovered your control suite by accident and, after looking at your online demos, I was so impressed that I couldn't resist the temptation to download and put it through its paces. After several hours of experimentation, I congratulate you on a really great product. Your controls are well designed, robust and performance."

Tim Coulter

Random testimonial   All testimonials