Ajax ColorPickerExtender in ASP.NET Example
Ajax ColorPickerExtender in ASP.NET Example :
In this Post I am going to explain how to use Ajax
ColorPicker Extender in ASP.NET. Ajax ColorPicker Extender provides client-side
color-selecting functionality with graphically (UI) in a popup control. It can
be attached to any ASP.NET TextBox control.
But First Learn “what is colorpicker and why we use inasp.net”.
Ajax ColorPicker example in asp.net:
Register Ajax toolkit on top of asp.net web page .
<%@ Register
Assembly="AjaxControlToolkit"
Namespace="AjaxControlToolkit"
TagPrefix="ajaxToolkit"
%>
Color Picker ASP.NET AJAX Extender Control :
For using this control we use select change event of
colorpicker as like this
<script type="text/javascript">
function colorChanged(sender) {
sender.get_element().style.color = "#"
+ sender.get_selectedColor();
}
</script>
Copy this script and past in to head section of page.
AJAX Control Toolkit Color Picker Control in ASP.Net
Write this code with the textbox
<ajaxToolkit:ColorPickerExtender ID="defaultCPE" runat="server" OnClientColorSelectionChanged="colorChanged" TargetControlID="Color1"
/>
Here TargetcontrolID is the textboxID.
Full Code of ColorPickerExtender Control in AJAX:
<%@ Page
Language="C#"
AutoEventWireup="true"
CodeFile="colorpickar.aspx.cs"
Inherits="colorpickar"
%>
<%@ Register
Assembly="AjaxControlToolkit"
Namespace="AjaxControlToolkit"
TagPrefix="ajaxToolkit"
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD
XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript">
function colorChanged(sender) {
sender.get_element().style.color = "#"
+ sender.get_selectedColor();
}
</script>
<style type="text/css">
.style1
{
color: #990000;
text-decoration: underline;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div class="" align="center">
<asp:ScriptManager ID="ScriptManager1"
runat="server">
</asp:ScriptManager>
<h1
class="style1">
Use of Ajax Color Picker with textbox control
</h2>
<h1 class="style1">
in
Asp.net
</h2>
<div
class="_psot_container">
<table
style="width: 100%;">
<tr>
<td align="right"
valign="top">
<strong> Choose
Color :</strong>
</td>
<td align="left">
<asp:TextBox runat="server"
ID="Color1" MaxLength="6"
AutoCompleteType="None"
/>
<br />
<ajaxToolkit:ColorPickerExtender
ID="defaultCPE"
runat="server"
OnClientColorSelectionChanged="colorChanged"
TargetControlID="Color1"
/>
<br />
</td>
<td>
</td>
</tr>
<tr>
<td align="center"
colspan="2">
<h3> Now you can use this colore code in text tag or
control.</h3>
<p> </p></td>
<td>
</td>
</tr>
</table>
</div>
</div>
</form>
</body>
C# Code of ColorPickerExtender Control :
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class colorpickar
: System.Web.UI.Page
{
protected void
Page_Load(object sender, EventArgs e)
{
Color1.Attributes.Add("readonly",
"readonly");
}
}
Adding a Color Picker Control to Your ASP.NET Application:
 |
| Ajax ColorPickerExtender |
Other Asp.net Related Post:
- Example of Radio ButtonList control.
- Example jQuery Validate on CheckBoxList using C#.
- Check Uncheck all html CheckBox controls using jQuery:
- fill data into Dropdown list by using Jquery.
- Check Uncheck all asp.net CheckBox in asp.net using jQuery.
- Validate ASP.Net RadioButtonList using JavaScript Example
- Example of jQuery Validate on Radiobuttonlist in Asp.Net using C#
- Example jQuery Validate on CheckBoxList using C#
- Example of Crystal report(Crystal_report_in asp.net programming )
- How to Make a HTML Table by C# code in asp.net programming
- Example of C# for Bind Data to asp.net Textbox inside gridview control
- Ckeck box list example using javascript in grid.
- Access RadioButtonList Item Using VBScript.
- How To bind RadioButtonList Control From data base.
- Ckeck box list example using javascript in grid.
- Example of DropDownList inside GridView control.
- Sending mail from web application using google Mail ID
- Display selected Date from data base into asp.net calendar
- How to Make Data Table By C# code in Asp.net Programming:
- Example of Crystal report(Crystal_report_in asp.net programming )
- Create data Table Dynamically and bind to Drop down List in asp.net
- How to Make a HTML Table by C# code in asp.net programming
- Asp.net CheckBoxList using jQuery.
- Cropping image using jQuery in asp.net.
- Example of C# for Bind Data to asp.net Textbox inside gridview control
- Bind Data to asp.net textbox control in inside of gridview Using C# Example
- How to Calculate Number of Sunday in a particular month by asp.net programming.
Comments
Post a Comment