Questions on UI for ASP.NET AJAX Forum

1 answer

277 views

RadHtmlChart rendering axis labels and title under axis instead of chart

I am attempting to display several dynamically generated series in a line chart using the RadHtmlChart, however the axis labels and title are rendering under the axis instead of the chart (DefaultRendering.png). I found a similar question that had the answer of "use the 'AxisCrossingValue' of the YAxis"; when i apply the minimum chart value i get the result in "RenderingWithAxisCrossingValue.png". How can I get the chart to render with both title and labels below the chart area as depicted in "RequiredRendering.png"?

Thanks,

Sean

Chart (HTML5)

answered on 27 Jun 2013

1 answer

174 views

RadSearchBox focus on tab

Hello. I have a template form in a radgrid with many controls in it including one radsearchbox. The tab index order works well on all of them except for the radsearchbox, it does not receives focus when it is the next control. Can this be done? Or always have to use the mouse and click? Thanks.

SearchBox

answered on 27 Jun 2013

1 answer

54 views

Controls do not have input data after submit button clicked

I

Ajax

answered on 27 Jun 2013

3 answers

131 views

Setting Height Explicitly

Hello,

I set the RadToolbar height to 30px, but this appears to set it for the inner DIV,not the outer wrapper div, and so the actual toolbar height is 34 px according to IE. Is there a way to set the height on the outer element instead, whether there is a property, a CSS way? I also have a wrapping <div> around the toolbar with an explicit height, but still a no go.

Thanks.

ToolBar

answered on 27 Jun 2013

1 answer

121 views

HTML Tags Being Encoded

Hi,

We are having problems with the latest Telerik RadEditor control (2013.2). When the HTML contains an attribute name with a colon, that tag is being encoded when switching from HTML view to Design and back again.

For example:

<html xmlns:v="urn:schemas-microsoft-com:vml">

Will get encoded to:

<html xmlns:v="urn:schemas-microsoft-com:vml">

This happens with any HTML tag and it didn't used to happen in the last version we used (2012.2).

Is there any way to stop this happening?

Thanks,

Editor

answered on 27 Jun 2013

1 answer

65 views

[Solved] Image Manager Does Not Refesh File Tree

HI,
When using the Image Manager in the Rad Editor, after choosing a file to upload, the image manger file tree is wiped out, and not displayed. I have to refresh the interface to see the files in the tree again. We are using 2013 Q2, and the Azure Content Provider code from CodePlex.

Any help would be greatly appeciated.

Thank you!

Editor

answered on 27 Jun 2013

5 answers

261 views

ASP.NET AJAX - Add 'asp:Repeater' in 'RadPanelItem'

I would like to add a set of images in a folder inside the RadPanelItem. The idea consists to have a repeater that populates the RadPanelItem and after that drag & drop them to in the MainPane.

How can I drag & drop that images to the MainPane? Have I use javascript or can I use telerik? How?

public class ImageName

{

private string filename;

public string FileName {

get { return filename; }

set { filename = value; }

}

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.IO;

namespace TestSVG

{

public partial class Main : System.Web.UI.Page

{

protected void Page_Load(object sender, EventArgs e)

{

string path = Server.MapPath("~/Images/QualityPic/");

List<string> stringList = Directory.GetFiles(path, "*.jpg").Select(f => Path.GetFileNameWithoutExtension(f)).ToList();

List<ImageName> iList = new List<ImageName>();

ImageName i;

foreach (string s in stringList)

{

i = new ImageName();

i.FileName = s;

iList.Add(i);

}

imageRepeater.DataSource = iList;

imageRepeater.DataBind();

}

protected void imageRepeater_ItemDataBound(object sender, RepeaterItemEventArgs e)

{

//Event triggered when this item is selected

if (((Repeater)sender).DataSource != null)

{

ImageName singleImage = (ImageName)e.Item.DataItem;

Button smallImage = (Button)e.Item.FindControl("smallImage");

smallImage.ID = smallImage.ID + singleImage.FileName;

smallImage.Attributes.CssStyle.Add("background-image", "Images/QualityPic/" + singleImage.FileName + ".jpg");

smallImage.Attributes.Add("onclick", "return smallImageJS_Click(" + singleImage.FileName + ");");

}

<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true"

CodeBehind="Main.aspx.cs" Inherits="TestSVG.Main" %>

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>

<asp:Content ID="HeadContent" ContentPlaceHolderID="HeadContent" runat="server">

<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.9.0/dojo/dojo.js" type="text/javascript"></script>

<script type="text/javascript">

var height;

var width;

function determineWidthAndHeight() {

if (typeof (window.innerWidth) == 'number') {

//Non-IE

width = window.innerWidth;

height = window.innerHeight;

}

else if (document.documentElement &&

(document.documentElement.clientWidth || document.documentElement.clientHeight)) {

//IE 6+ in 'standards compliant mode'

width = document.documentElement.clientWidth;

height = document.documentElement.clientHeight;

}

else if (document.body && (document.body.clientWidth || document.body.clientHeight)) {

//IE 4 compatible

width = document.body.clientWidth;

height = document.body.clientHeight;

}

function MainPane_OnClientLoaded(splitter, arg) {

var leftPane = splitter.getPaneById('<%= LeftPane.ClientID %>');

var mainPane = splitter.getPaneById('<%= MainPane.ClientID %>');

splitter.set_height((height - 40));

leftPane.set_height((height - 30));

mainPane.set_height((height - 30));

}

function setWidthAndHeightFields() {

var leftWidth = $('#<%=LeftPane.ClientID %>').width();

$('#<%=RadSplitter1.ClientID %>').css('height', (height - 40) + 'px');

$('#<%=LeftPane.ClientID %>').css('height', (height - 30) + 'px');

$('#<%=MainPane.ClientID %>').css('width', (width - leftWidth - 40) + 'px');

$('#<%=MainPane.ClientID %>')[0].width = (width - leftWidth - 40) + 'px';

$('#<%=MainPane.ClientID %>').css('height', (height - 30) + 'px');

$('#<%=MainPane.ClientID %>')[0].height = (height - 30) + 'px';

$('[id*="RadSplitter1"]').each(function () {

$(this)[0].style.height = (height - 30) + "px";

$(this)[0].height = (height - 30) + "px";

});

$('[id*="LeftPane"]').each(function () {

$(this)[0].style.height = (height - 30) + "px";

$(this)[0].height = (height - 30) + "px";

});

$('[id*="MainPane"]').each(function () {

$(this).width = (width - leftWidth - 40) + "px";

$(this)[0].style.width = (width - leftWidth - 40) + "px";

$(this)[0].width = (width - leftWidth - 40) + "px";

$(this).css('width', (width - leftWidth - 40) + 'px');

$(this).height = (height - 30) + "px";

$(this)[0].style.height = (height - 30) + "px";

$(this)[0].height = (height - 30) + "px";

$(this).css('height', (height - 30) + 'px');

});

}

function smallImageJS_Click(filename) {

alert(filename);

return false;

}

window.onload = function () {

determineWidthAndHeight();

setWidthAndHeightFields();

}

window.onresize = function (event) {

determineWidthAndHeight();

setWidthAndHeightFields();

}

</script>

<style>

v\:*

{

behavior: url(#default#VML);

}

body

{

overflow: hidden;

}

.wrapper

{

}

.wrapper ul.ULwrapper

{

list-style-type: none !important;

margin: 0 !important;

padding: 0 !important;

}

.wrapper li.LIwrapper

{

display: inline-block !important;

float: left !important;

text-align: left !important;

margin: 10px;

border: 1px solid #fff !important;

}

.wrapper .ULwrapper .LIwrapper .LIwrapperSImage

{

width: 130px;

height: 130px;

background-position: center;

background-repeat: no-repeat;

}

</style>

<link href="Styles/jquery-ui.css" rel="stylesheet" type="text/css" />

</asp:Content>

<asp:Content ID="MainContent" ContentPlaceHolderID="MainContent" runat="server">

<telerik:RadScriptManager runat="server" ID="RadScriptManager1" />

<telerik:RadSkinManager ID="QsfSkinManager" runat="server" Skin="Office2010Blue" />

<telerik:RadFormDecorator ID="QsfFromDecorator" runat="server" DecoratedControls="All"

EnableRoundedCorners="false" />

<telerik:RadSplitter ID="RadSplitter1" runat="server" Height="100%" Width="100%"

OnClientLoaded="MainPane_OnClientLoaded">

<telerik:RadPane ID="LeftPane" runat="server" Width="22" Scrolling="None">

<telerik:RadSlidingZone enableclientdebug="false" ID="SlidingZone1" runat="server"

Width="22">

<telerik:RadSlidingPane ID="Radslidingpane1" Title="Qualities" runat="server" Width="150"

IconUrl="Images/Sliding/Toolbox.gif" TabView="TextOnly" Scrolling="Y">

<telerik:RadPanelBar runat="server" ID="RadPanelBar1" Height="100%" Width="100%"

ExpandMode="FullExpandedItem">

<Items>

<telerik:RadPanelItem Text="Carry Overs">

<ContentTemplate>

<asp:Panel ID="wrapperDiV" runat="server" CssClass="wrapper">

<ul class="ULwrapper">

<asp:Repeater runat="server" ID="imageRepeater" OnItemDataBound="imageRepeater_ItemDataBound">

<ItemTemplate>

<li class="LIwrapper">

<asp:Button ID="smallImage" CssClass="LIwrapperSImage" runat="server" />

<div style="height: 70px; width: 130px;">

<hr style="width: 30px; margin-left: 10px; text-align: left;" />

<asp:Label ID="lblImageName" runat="server" Style="margin-left: 10px; display: block;

font-size: 11pt;"> <%# DataBinder.Eval(Container.DataItem, "FileName").ToString()%> </asp:Label></div>

</li>

</ItemTemplate>

</asp:Repeater>

</ul>

</asp:Panel>

</ContentTemplate>

</telerik:RadPanelItem>

<telerik:RadPanelItem Text="Others">

<Items>

<telerik:RadPanelItem Text="Test1" />

<telerik:RadPanelItem Text="Test2" />

<telerik:RadPanelItem Text="Test3" />

</Items>

</telerik:RadPanelItem>

</Items>

</telerik:RadPanelBar>

</telerik:RadSlidingPane>

<telerik:RadSlidingPane ID="Radslidingpane2" Title="Pins" runat="server" Width="150"

IconUrl="Images/Sliding/Toolbox.gif" TabView="TextOnly" Scrolling="Y">

This pane has the default setting of <b>TabView</b> property.<br />

It displays both the icon and the title of the pane.

</telerik:RadSlidingPane>

</telerik:RadSlidingZone>

</telerik:RadPane>

<telerik:RadSplitBar ID="Radsplitbar1" runat="server">

</telerik:RadSplitBar>

<telerik:RadPane ID="MainPane" runat="server" Scrolling="Both" Width="100%">

<div id="squaredPaper" style="zoom: 100%" />

</telerik:RadPane>

</telerik:RadSplitter><br />

</asp:Content>

<%@ Master Language="C#" AutoEventWireup="false" CodeBehind="Site.master.cs" Inherits="TestSVG.Site" %>

<%--<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">--%>

<HTML XMLNS:V="urn:schemas-microsoft-com:vml">

<HEAD runat="server">

<TITLE>Vector Graphic</TITLE>

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>

<script type="text/javascript">

function noBack() { window.history.forward(); }

noBack();

window.onload = noBack;

window.onpageshow = function (evt) { if (evt.persisted) noBack(); }

window.onunload = function () { void (0); }

</script>

<asp:ContentPlaceHolder ID="HeadContent" runat="server"></asp:ContentPlaceHolder>

</head>

<body>

<form runat="server">

<div id="header">

</div>

<div id="main">

<asp:ContentPlaceHolder ID="MainContent" runat="server" />

</div

<div id="footer">

</div>

</form>

</body>

</HTML>

PanelBar

answered on 27 Jun 2013

2 answers

194 views

[Solved] OnRowMouseover and Out events

I am implimenting the clickability of rows on my radgrid, which I got working, but as soon as I tried to change the color or the highlighted row everything stopped working, so no clue at this point. What i am trying to do is impliment clicking on a row which will then pull open a panel and hide grid, had this working but I need the row highlighted a brighter color and on mouse out it should go back to my alternating grid colors.

<asp:Panel ID="pnlGrid" runat="server" CssClass="dvGridWrapper">

<telerik:RadGrid ID="myRadGrid" runat="server" Width="75%" Skin="Web20" CssClass="dvGridWrapper">

<ClientSettings EnablePostBackOnRowClick="true" Selecting-AllowRowSelect="true" EnableRowHoverStyle="true" >

<ClientEvents OnRowMouseOver="GridRowOver_Web20" />

</ClientSettings>

<MasterTableView AutoGenerateColumns="false" Font-Size="10" DataKeyNames="RecId">

<HeaderStyle ForeColor="White" Font-Bold="true" HorizontalAlign="Center" />

<ItemStyle HorizontalAlign="Center"/>

<AlternatingItemStyle BackColor="#B0C4DE" HorizontalAlign="Center" />

<Columns>

<telerik:GridBoundColumn DataField="LName" HeaderText="LAST NAME" />

<telerik:GridBoundColumn DataField="FName" HeaderText="FIRST NAME" />

<telerik:GridBoundColumn DataField="Mname" HeaderText="MIDDLE NAME" />

<telerik:GridBoundColumn DataField="Recruiter" HeaderText="RECRUITER" />

<telerik:GridBoundColumn DataField="dtProcessing" HeaderText="DT PROCESSING" />

<telerik:GridBoundColumn DataField="status" HeaderText="ENLISTMENT STATUS" />

</Columns>

</MasterTableView>

</telerik:RadGrid>

</asp:Panel>

<style type="text/css">

.GridRowOver_Web20

{

background-color: orange !important;

cursor:pointer;

}

</style>

Protected Sub myRadGrid_SelectedIndexChanged(sender As Object, e As EventArgs) Handles myRadGrid.SelectedIndexChanged

pnlGrid.Visible = False

End Sub

Grid

answered on 27 Jun 2013

4 answers

170 views

GetAppointments failed

Hello.

I am developing a web application whose pages make use of the RadScheduler component. The interaction with the database relies on a WCF web service, hosted by IIS.

Occasionally, during testing, the following error message is displayed: The server method 'GetAppointments' failed.
Although it rarely happens, I would like to customize the error message in order to display a more user-friendly one.
Is there a way to do it?

Thank you in advance.
Paulo

Scheduler

answered on 27 Jun 2013

1 answer

65 views

Using RadRadialGuage inside radgrid

I followed the instructions on this thread
http://www.telerik.com/community/forums/aspnet-ajax/gauge/how-to-use-gauge-inside-the-grid.aspx

But the find control line does not find the control and turns up with nothing.

'here is my aspx

<telerik:RadGrid ID="rgCARS" runat="server" ClientSettings-Scrolling-AllowScroll="true" AllowSorting="true" ShowFooter="true"

OnSortCommand="RadGrid1_SortCommand" AutoGenerateColumns=False height="400px" EnableViewState="true" > <
MasterTableView>

<telerik:GridTemplateColumn UniqueName="Progress" AllowFiltering="false" HeaderText="Progress" DataField="Progress">

<telerik:RadRadialGauge ID="RadRadialGauge1" Width="100" Height="100" runat="server" Min="0" Max="100">

</telerik:RadRadialGauge>

</ItemTemplate>

</telerik:GridTemplateColumn>

</Columns>

</MasterTableView>

</ClientSettings>

</telerik:RadGrid>

note that I am coding the rest of the columns in the code behind to save viewstate:

Me.rgCARS.MasterTableView.Columns.Clear()

Dim column1 As New GridBoundColumn

Dim column2 As New GridDateTimeColumn

Dim column3 As New GridBoundColumn

Dim column4 As New GridBoundColumn

Dim column5 As New GridBoundColumn

Dim column6 As New GridNumericColumn

Dim column7 As New GridBoundColumn

Dim column8 As New GridBoundColumn

Me.rgCARS.MasterTableView.Columns.Add(column1)

Me.rgCARS.MasterTableView.Columns.Add(column2)

Me.rgCARS.MasterTableView.Columns.Add(column3)

Me.rgCARS.MasterTableView.Columns.Add(column4)

Me.rgCARS.MasterTableView.Columns.Add(column5)

Me.rgCARS.MasterTableView.Columns.Add(column6)

Me.rgCARS.MasterTableView.Columns.Add(column7)

Me.rgCARS.MasterTableView.Columns.Add(column8)

'Me.rgCARS.MasterTableView.Columns.Add(column9)

'Then set properties

column1.DataField =

"Project #"

column1.HeaderText =

"Project #"

column2.DataField =

"Date Initiated"

column2.HeaderText =

"Date Initiated"

column2.UniqueName =

"DateInitiated"

column3.DataField =

"Title"

column3.HeaderText =

"Title"

column4.DataField =

"Main Type"

column4.HeaderText =

"Main Type"

column5.DataField =

"Type"

column5.HeaderText =

"Type"

column6.DataField =

"Total"

column6.HeaderText =

"Total"

column7.DataField =

"Waiting on"

column7.HeaderText =

"Waiting on"

column8.DataField =

"Waiting on 2"

column8.HeaderText =

""

'then in my itemdatabound I am trying to set the pointer value

Private Sub rgCARS_ItemDataBound(sender As Object, e As Telerik.Web.UI.GridItemEventArgs) Handles rgCARS.ItemDataBound

If e.Item.ItemType = GridItemType.Item Or e.Item.ItemType = GridItemType.AlternatingItem Then

Dim item As GridDataItem = CType(e.Item, GridDataItem)

Dim currentRow As DataRowView = CType(item.DataItem, DataRowView)

Dim currValue As Decimal = Decimal.Parse(currentRow.Row("Progress").ToString())

Dim radialGauge1 As RadRadialGauge = CType(item.FindControl("RadRadialGauge1"), RadRadialGauge)

Dim value As Integer

If currValue = 0 Then

value = 0

Else

value = currValue / 2

End If

'RaidalGuage is nothing and throws an error

radialGauge1.Pointer.Value =

Math.Ceiling(value)

End If

Any ideas?

Gauge

answered on 27 Jun 2013