or
Month Count Jan 213 Feb 345 May 344 Jul 102 Aug 123 RadChart1.Series[0].DataYColumn = "Count"; RadChart1.PlotArea.XAxis.DataLabelsColumn = "Month"; RadChart1.DataBind();<telerik:RadGrid ID="RadGrid1" OnNeedDataSource="RadGrid1_NeedDataSource" runat="server" AllowPaging="True" EditItemStyle-Wrap="true" AllowSorting="True" AutoGenerateColumns="False" AllowAutomaticUpdates="True" OnUpdateCommand="RadGrid1_UpdateCommand" AllowFilteringByColumn="True" Width="99%" PageSize="14" OnItemDataBound="RadGrid1_ItemDataBound" EnableLinqExpressions="false" OnItemCreated="RadGrid1_ItemCreated"> <MasterTableView AllowAutomaticDeletes="False" AllowAutomaticInserts="True" AllowAutomaticUpdates="True" Width="100%" EditMode="EditForms" CommandItemDisplay="Top" CanRetrieveAllData="false" DataKeyNames="proid,subid,appid,q12a,q13a,q15a,q23a,q24a,q25a,q29a" >
<EditFormSettings ColumnNumber="3" CaptionDataField="profileid" CaptionFormatString="Edit properties of profileid: {0}" FormMainTableStyle-Font-Bold="true">
<FormTableItemStyle Wrap="true" />
<FormCaptionStyle CssClass="EditFormHeader" />
<FormMainTableStyle GridLines="None" CellSpacing="0" CellPadding="0" BackColor="#f0f2f4" Width="100%" />
<FormTableStyle GridLines="Horizontal" CellSpacing="0" CellPadding="2" BackColor="#f0f2f4" CssClass="module" Height="20px" Font-Size="Small" HorizontalAlign="Left" Font-Bold="true" Font-Names="Arial" />
<FormTableAlternatingItemStyle Wrap="true" />
<FormStyle Width="100%" />
<EditColumn ButtonType="PushButton" UpdateText="Update" ItemStyle-Width="50px" UniqueName="EditCommandColumn1" CancelText="Cancel" />
<FormTableButtonRowStyle HorizontalAlign="Left" />
</EditFormSettings>
protected void RadGrid1_ItemCreated(object sender, GridItemEventArgs e){ if ((e.Item is GridEditableItem) && (e.Item.IsInEditMode)) { GridEditableItem item = (GridEditableItem)e.Item; string[] arr_condition = { "q12a", "q13a", "q15a", "q23a", "q24a", "q25a", "q29a" }; GridDropDownListColumnEditor editor; TableCell cell; foreach (string w in arr_condition) { editor = (GridDropDownListColumnEditor)item.EditManager.GetColumnEditor(w); cell = (TableCell)editor.DropDownListControl.Parent; RequiredFieldValidator validator = new RequiredFieldValidator(); editor.DropDownListControl.ID = w + "_Required"; validator.ControlToValidate = editor.DropDownListControl.ID; validator.InitialValue = "-1"; validator.ErrorMessage = " *"; cell.Controls.Add(validator); } }}protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e){ string[] arr_condition = { "q12a", "q13a", "q15a", "q23a", "q24a", "q25a", "q29a" }; if (e.Item is GridDataItem) { GridEditableItem item = (GridEditableItem)e.Item; item["q1"].Width = 100; foreach (string r in arr_condition) { if (item[r].Text == "Select") { item[r.Substring(0, 4)].Style["color"] = "red"; } } } if ((e.Item is GridEditableItem) && (e.Item.IsInEditMode)) { GridEditableItem item = (GridEditableItem)e.Item; string[] arr_readonly = { "appid","proid","subid","q2","q3","q4","q5a","q5b","q5c","q5d","q5e","q6","q7",
"q9a","q9b","q9c","q9d","q9e","q12a","q33","q34","q13a","q14","q16a_1","q16b_1","q16cd_1",
"q16e_1","q17a_1","q17b_1","q17c_1","q17e_1","q18_1","q19a_1","q19b_1","q20a_1","q20b_1","q20c_1", "q21a_1","q22a_1","q22b_1","q15a","q16a_2","q16b_2","q16cd_2","q16e_2","q17a_2","q17b_2","q17c_2", "q17e_2","q18_2","q19a_2","q19b_2","q20a_2","q20b_2","q20c_2","q23a","q24a","q25a", "q26","q28","q29a","q30","q32"}; TextBox temptxtbox; foreach (string w in arr_readonly) { temptxtbox = (TextBox)item[w].Controls[0]; temptxtbox.Enabled = false; temptxtbox.Width = 250; temptxtbox.Height = 18; temptxtbox.Font.Size = 10; } RadDatePicker dt = (RadDatePicker)item["q1"].Controls[0]; dt.Enabled = false; dt.Width = 250; DropDownList combobox; foreach (string r in arr_condition) { combobox = (DropDownList)item[r].Controls[0]; if (combobox.SelectedItem.Text == "Select") { combobox.ForeColor = Color.Red; } combobox.Font.Bold = true; combobox.Font.Size = 12; combobox.Width = 240; } string[] arr_group2 = { "q15a","q16a_2","q16b_2","q16cd_2","q16e_2","q17a_2","q17b_2","q17c_2", "q17e_2","q18_2","q19a_2","q19b_2","q20a_2","q20b_2","q20c_2"}; foreach (string w in arr_group2) { temptxtbox = (TextBox)item[w].Controls[0]; temptxtbox.BackColor = Color.LightCyan; } combobox = (DropDownList)item["q15a_coded"].Controls[0]; combobox.BackColor = Color.LightCyan; } }if(_menuHttpPanel.isProcessing == false){ _menuHttpPanel.set_value(_menuSearchBox.get_value());}Hi,
I want to create a webpage which contains an imagemap with hotspots. On mouse move over the hotspots I want to display a tool tip, not just the alt.Text, but rather more information with another image and some text. I was following the RadToolTip demo (First Look) and adapted the same method to create this. But it is not working. I am attaching the code (only two web pages). Please some one take a look and tell me what I am doing wrong. The tool tip information is not pulled from any database but generated in the codebehind file based on the ID of the hotspot.
Since I spend almost a week playing with it with out any luck, any help is greately appreciated,
Thanks
Joe
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="DefaultCS.aspx.cs" Inherits="tooltiptest.DefaultCS" %> <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %> <%@ Register Src="LocSummary.ascx" TagName="LocSummary" TagPrefix="uc1" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <style type="text/css"> .test { float: right; } </style> </head> <body class="BODY"> <form id="form1" runat="server"> <telerik:RadStyleSheetManager ID="RadStyleSheetManager1" runat="server"> </telerik:RadStyleSheetManager> <telerik:RadScriptManager ID="RadScriptManager1" runat="server"> </telerik:RadScriptManager> <h1> Our Locations </h1> <telerik:RadFormDecorator ID="RadFormDecorator1" runat="server" Skin="Forest" DecoratedControls="All" /> <div id="mainimgdiv" style=" width:800px; height:500px"> <asp:imageMap ID="cdslocations" runat="server" ImageUrl="cdslocs.jpg" HotSpotMode="PostBack" Enabled="true" ViewStateMode="Enabled"> </asp:imageMap> <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" ></telerik:RadAjaxLoadingPanel> <telerik:RadToolTipManager runat="server" AnimationDuration="300" ShowDelay="200" EnableShadow="True" HideDelay="1" ID="RadToolTipManager1" Width="453px" Height="210px" RelativeTo= "BrowserWindow" Animation= "Slide" OnAjaxUpdate="OnAjaxUpdate" Skin="Telerik" Title = "Location Summary:" /> <telerik:RadAjaxManager ID ="RadAjaxManager1" runat="server"> <AjaxSettings> <telerik:AjaxSetting AjaxControlID="RadToolTipManager1"> <UpdatedControls> <telerik:AjaxUpdatedControl ControlID="RadToolTipManager1" LoadingPanelID="RadAjaxLoadingPanel1" /> </UpdatedControls> </telerik:AjaxSetting> </AjaxSettings> </telerik:RadAjaxManager> </div> </form> </body> </html> Code behind using System; using System.Data; using System.Configuration; using System.Collections; using System.Web; using System.Web.Security; using System.Web.UI; using System.Web.UI.WebControls; using System.Web.UI.WebControls.WebParts; using System.Web.UI.HtmlControls; using Telerik.Web.UI; using System.Threading; using System.IO; using Telerik; namespace tooltiptest { public partial class DefaultCS : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { // define the circle hotspot CircleHotSpot Circle1 = new CircleHotSpot(); Circle1.HotSpotMode = HotSpotMode.PostBack; Circle1.NavigateUrl = "~/northnj.aspx"; Circle1.X = 458; Circle1.Y = 120; Circle1.Radius = 15; Circle1.AlternateText = "WH"; // Add Circle1 to the ImageMap's HotSpotCollection. cdslocations.HotSpots.Add(Circle1); CircleHotSpot Circle2 = new CircleHotSpot(); Circle2.HotSpotMode = HotSpotMode.PostBack; // Circle2.NavigateUrl = "~/lehighvalley.aspx"; Circle2.X = 433; Circle2.Y = 128; Circle2.Radius = 15; Circle2.AlternateText = "AT"; cdslocations.HotSpots.Add(Circle2); CircleHotSpot Circle3 = new CircleHotSpot(); Circle3.HotSpotMode = HotSpotMode.PostBack; // Circle3.NavigateUrl = "~/fortwayne.aspx"; Circle3.X = 352; Circle3.Y = 143; Circle3.Radius = 15; Circle3.AlternateText = "BF"; cdslocations.HotSpots.Add(Circle3); CircleHotSpot Circle4 = new CircleHotSpot(); Circle4.HotSpotMode = HotSpotMode.PostBack; // Circle4.NavigateUrl = "~/stlouis.aspx"; Circle4.X = 317; Circle4.Y = 172; Circle4.Radius = 15; Circle4.AlternateText = "EV"; cdslocations.HotSpots.Add(Circle4); CircleHotSpot Circle5 = new CircleHotSpot(); Circle5.HotSpotMode = HotSpotMode.PostBack; //Circle5.NavigateUrl = "~/tulsa.aspx"; Circle5.X = 263; Circle5.Y = 208; Circle5.Radius = 15; Circle5.AlternateText = "FG"; cdslocations.HotSpots.Add(Circle5); CircleHotSpot Circle6 = new CircleHotSpot(); Circle6.HotSpotMode = HotSpotMode.PostBack; //Circle6.NavigateUrl = "~/losangelos.aspx"; Circle6.X = 49; Circle6.Y = 203; Circle6.Radius = 15; Circle6.AlternateText = "ON"; cdslocations.HotSpots.Add(Circle6); foreach (CircleHotSpot spot in cdslocations.HotSpots) { //The first argument of add method requires the client Id //the example implementation will set the id to be the name of the country itself this.RadToolTipManager1.TargetControls.Add(spot.AlternateText, spot.AlternateText, true); } } protected void OnAjaxUpdate(object sender, ToolTipUpdateEventArgs args) { this.UpdateToolTip(args.Value, args.UpdatePanel); } private void UpdateToolTip(string elementID, UpdatePanel panel) { Control ctrl = Page.LoadControl("LocSummary.ascx"); panel.ContentTemplateContainer.Controls.Add(ctrl); LocSummary details = (LocSummary)ctrl; details.LocId = elementID; } } } LocSummary ASpx - this is a user control file which should show as tooltip <%@ Control Language="C#" AutoEventWireup="true" CodeBehind="LocSummary.ascx.cs" Inherits="tooltiptest.LocSummary" %> <asp:FormView ID="LocView" DataKeyNames="LocId" runat="server" OnDataBound="LocView_DataBound" Width="453px" onpageindexchanging="LocView_PageIndexChanging" CellPadding="4" ForeColor="#333333"> <FooterStyle BackColor="#990000" Font-Bold="True" ForeColor="White" /> <HeaderStyle BackColor="#990000" Font-Bold="True" ForeColor="White" /> <ItemTemplate> <div style="float: left; border: 1px solid #999999; margin-right: 20px; width: 200px; height: 200px; background-position: center; background-repeat: no-repeat;" > <asp:Image ID="LocImage" runat="server" /> </div> <div style="width: 200px; float: left;"> <div style="float: left; padding-top: 20px;"> <asp:Label CssClass="info" ID="LocationName" runat="server" Style="font-size: 24px; padding-left: 4px;"></asp:Label> <br /> <br /> <span class='title' style="color: #c98400">Highways:</span> <asp:Label CssClass="info" ID="LbHigways" runat="server"></asp:Label> <br /> <span class='title' style="color: #c98400">Squre Foot:</span> <asp:Label CssClass="info" ID="LbSqFoot" runat="server"></asp:Label> <br /> <span class='title' style="color: #c98400">Construction:</span> <asp:Label CssClass="info" ID="LbConstruction" runat="server"></asp:Label> <br /> </div> </div> </ItemTemplate> <PagerStyle BackColor="#FFCC66" ForeColor="#333333" HorizontalAlign="Center" /> <RowStyle BackColor="#FFFBD6" ForeColor="#333333" /> </asp:FormView> Code behind using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; using System.Threading; using System.IO; namespace tooltiptest { public partial class LocSummary : System.Web.UI.UserControl { public string LocId { get { if (ViewState["LocId"] == null) { return ""; } return (string)ViewState["LocId"]; } set { ViewState["LocId"] = value; } } protected void LocView_PageIndexChanging(object sender, FormViewPageEventArgs e) { } protected void Page_Load(object sender, EventArgs e) { this.DataBind(); } protected void LocView_DataBound(object sender, EventArgs e) { string lcID = e.ToString(); string locName = "" ; string locHigWays = ""; string locSqFoot = ""; string locConstruction = ""; string lcImageUrl = ""; switch (LocId) { case "WH": locName = "Wharton, NJ"; locHigWays = "80/46"; locSqFoot = "650000"; locConstruction = "Concrete"; lcImageUrl = "smallloc.png"; break; case "PA": locName = "Pensilvania, PA"; locHigWays = "80/78"; locSqFoot = "650000"; locConstruction = "Concrete"; lcImageUrl = "smallloc.png"; break; case "CA": locName = "Ontario, CA"; locHigWays = "100/80/35"; locSqFoot = "350000"; locConstruction = "Concrete"; lcImageUrl = "smallloc.png"; break; case "BF": locName = "Bluffton, IN"; locHigWays = "200/145"; locSqFoot = "150000"; locConstruction = "Concrete"; lcImageUrl = "smallloc.png"; break; case "IL": locName = "Edwardsville, IL"; locHigWays = "66/77"; locSqFoot = "650000"; locConstruction = "Steel"; lcImageUrl = "smallloc.png"; break; case "FG": locName = "Fort Gibson, OK"; locHigWays = "35/76"; locSqFoot = "450000"; locConstruction = "Steel"; lcImageUrl = "smallloc.png"; break; default: locName = "Wharton, NJ"; locHigWays = "80/78"; locSqFoot = "650000"; locConstruction = "Concrete"; lcImageUrl = "smallloc.png"; break; } //populate the summary information of the location System.Web.UI.WebControls.Image image = (System.Web.UI.WebControls.Image)this.FindControl("LocImage"); if (image == null) return; if (!File.Exists(MapPath(image.ImageUrl))) { image.ImageUrl = lcImageUrl; } System.Web.UI.WebControls.Literal lit1 = (System.Web.UI.WebControls.Literal)this.FindControl("LocationName"); lit1.Text = locName; System.Web.UI.WebControls.Literal lit2 = (System.Web.UI.WebControls.Literal)this.FindControl("LbHigways"); lit2.Text = locHigWays; System.Web.UI.WebControls.Literal lit4 = (System.Web.UI.WebControls.Literal)this.FindControl("LbSqFoot"); lit1.Text = locSqFoot; System.Web.UI.WebControls.Literal lit5 = (System.Web.UI.WebControls.Literal)this.FindControl("LbConstruction"); lit1.Text = locConstruction; } } }