Questions on UI for ASP.NET AJAX Forum

0 answers

71 views

Composite Control and Intellisense support for enum Property

Hello,

I'm facing the following problem. I'm trying to build a Composite Control that uses Telerik control as child control, I try to create a new Property for this control that can only be Val1, Val2 or Val3.

I've created a enum to list all property values:

public enum MyEnum{Val1,Val2,Val3}

Then I've created a Property in my composite control whose type is MyEnum like this:

public MyEnum? MyControlAttribute

{

get { return (MyEnum?)ViewState["MyControlAttribute"]; }

set { ViewState["MyControlAttribute"] = value; }

}

When I build my library and try to use the composite control, Intellisense don't work as needed. I would like to have Intellisense propose Val1, Val2 or Val3 for the attribute. Is that possible?

<ns:MyCompositeControl ID="ccid" runat="server" MyControlAttribute="...." />

I suppose I missed an attribute on the Property MyControlAttribute, but I don't know which one.

Any help would be appreciated.

Thanks.

Pascal

General Discussions

asked on 14 Apr 2011

1 answer

117 views

Grid Sorting with AjaxManager

When I introduce a RadAjaxManager (which I now need for other reasons) it breaks my Sorting and Paging? Any advice?

<%@ Control Language="vb" AutoEventWireup="false" CodeBehind="Grid.ascx.vb" Inherits="WebDBMS.Grid" %>

<%@ Register assembly="Telerik.Web.UI" namespace="Telerik.Web.UI" tagprefix="telerik" %>

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

<telerik:RadCodeBlock runat="server" ID="RadCodeBlock1">

<script type="text/javascript">

var allowMenu = "<%=AllowMenu%>";

function RowContextMenu(sender, eventArgs) {

if (allowMenu == "True" && __ual == "99") {

var menu = $find("<%=RadMenu1.ClientID %>");

var evt = eventArgs.get_domEvent();

if (evt.target.tagName == "INPUT" || evt.target.tagName == "A") {

return;

}

var index = eventArgs.get_itemIndexHierarchical();

document.getElementById("radGridClickedRowIndex").value = index;

sender.get_masterTableView().selectItem(sender.get_masterTableView().get_dataItems()[index].get_element(), true);

menu.show(evt);

evt.cancelBubble = true;

evt.returnValue = false;

if (evt.stopPropagation) {

evt.stopPropagation();

evt.preventDefault();

}

function RowDblClick(sender, args) {

var grid = sender;

var MasterTable = grid.get_masterTableView();

var row = MasterTable.get_dataItems()[args.get_itemIndexHierarchical()];

var cell = MasterTable.getCellByColumnUniqueName(row, "ID");

if (cell != null) {

var value = cell.innerHTML;

if (__name != null) {

var url = "../Forms/getEditForm.aspx?key=" + __name + "&id=" + value;

winopen(url, null, "toolbar=0,scrollbars=1,location=0,statusbar=1,menubar=0,resizable=1");

}

function OpenClick() {

var grid = $find("<%=QueryRadGrid.ClientID %>");

var MasterTable = grid.get_masterTableView();

var row = MasterTable.get_selectedItems()[0];

if (row != null) {

var cell = MasterTable.getCellByColumnUniqueName(row, "ID");

var value = cell.innerHTML;

var url = "./Forms/getEditForm.aspx?key=" + __name + "&id=" + value;

winopen(url, null, "toolbar=0,scrollbars=1,location=0,statusbar=1,menubar=0,resizable=1");

}

function RepaintGrid() {

var grid = $find("<%= QueryRadGrid.ClientID %>")

grid.repaint();

}

function MassChange(sender, args) { // Customer Corrections Only

var grid = $find("<%=QueryRadGrid.ClientID %>");

var MasterTable = grid.get_masterTableView();

var items = MasterTable.get_selectedItems();

var itemIds = '';

for (var i = 0; i < items.length; i++) {

var row = items[i];

var cell = MasterTable.getCellByColumnUniqueName(row, "ID");

var value = cell.innerHTML;

if (itemIds != '') itemIds += ',';

itemIds += value;

}

if (itemIds != '') {

if (confirm("Perform Mass Change?") == true) {

winopen('../Forms/MassChange.aspx?xx_tranid=' + itemIds, 'MassChange', 'width=800, height=500');

}

return false;

}

</script>

</telerik:RadCodeBlock>

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="QueryRadGrid">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="QueryRadGrid" LoadingPanelID="RadAjaxLoadingPanel1" />

<telerik:AjaxUpdatedControl ControlID="RadMenu1" />

</UpdatedControls>

</telerik:AjaxSetting>

<telerik:AjaxSetting AjaxControlID="RadMenu1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="QueryRadGrid" LoadingPanelID="RadAjaxLoadingPanel1" />

<telerik:AjaxUpdatedControl ControlID="RadMenu1" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" />

<telerik:RadContextMenu ID="RadMenu1" runat="server" OnClientItemClicking="MassChange"

EnableRoundedCorners="true" EnableShadows="true">

<Items>

<telerik:RadMenuItem Text="Mass Change" />

</Items>

</telerik:RadContextMenu>

<input type="hidden" id="radGridClickedRowIndex" name="radGridClickedRowIndex" />

<telerik:RadGrid ID="QueryRadGrid" runat="server" style="width:100%; height:99%; position: absolute;"

Font-Names="Verdana" GridLines="Horizontal" AllowSorting="True" ShowGroupPanel="True"

Skin="Office2007" AllowPaging="True" PageSize="50" AutoPostBack="True">

<MasterTableView>

<HeaderStyle Wrap="false" />

</MasterTableView>

<ClientSettings AllowDragToGroup="True">

<Scrolling UseStaticHeaders="true" AllowScroll="True" SaveScrollPosition="True"/>

<Selecting AllowRowSelect="True" />

<ClientEvents OnRowDblClick="RowDblClick" />

</ClientSettings>

<PagerStyle AlwaysVisible="true" />

<ExportSettings ExportOnlyData="true" IgnorePaging="true"/>

</telerik:RadGrid>

Grid

answered on 14 Apr 2011

1 answer

382 views

OnMouseOver Backgroung color in listview items

I am using a RadListView. now I would like to single item background color on MouseOver and on Mouse Out.now i use a a CSS on mouseover,
<style type="text/css">
.normal { background-color: #000000 }
.normalActive { background-color: #999999 }
</style>

it change colored all item. but i need single item. any solution???

ListView

answered on 14 Apr 2011

2 answers

104 views

RadTooltipManager doesn't work

Hi there, I'm rehearsing with AJAX controls, following your CourseWare.
It seems that RadTooltipManager doesn't work...
The tooltips linked to the tblOptions table are displsyed with standard format, while to one created with RadTooltip works correctly

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="05-UI_1.aspx.vb" Inherits="AjaxProva1._05_UI_1" %>

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

<!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>AJAX / UI Getting started</title>

</head>

<body>

<form id="form1" runat="server">

<div>

<asp:ScriptManager ID="ScriptManager1" runat="server">

</asp:ScriptManager>

<telerik:RadFormDecorator ID="RadFormDecorator1" runat="server" Skin="Hay" />

<table id="tblOptions" style="width: 100%;">

<tr>

<td style="color: #808000; border-right-style: solid; border-width: thin; border-color: #808000">

Music Styles

</td>

<td style="color: #808000">

Media

</td>

</tr>

<tr>

<td colspan="2">

<hr />

</td>

</tr>

<tr>

<td style="border-right-style: solid; border-width: thin; border-color: #808000"

title="Check all the styles you want to see included in the listing." valign="top">

<asp:CheckBox ID="CheckBox1" runat="server" Text="Classical" />

<br />

<asp:CheckBox ID="CheckBox2" runat="server" Text="Classic Rock" />

<br />

<asp:CheckBox ID="CheckBox3" runat="server" Text="Jazz and Fusion" />

<br />

<asp:CheckBox ID="CheckBox4" runat="server" Text="Rhythm and Blues" />

</td>

<td title="Choose the media you want." valign="top">

<asp:RadioButtonList ID="RadioButtonList1" runat="server">

<asp:ListItem Selected="True">CD</asp:ListItem>

<asp:ListItem>Tape</asp:ListItem>

</asp:RadioButtonList>

</td>

</tr>

</table>

<asp:Button ID="Button1" runat="server" Text="See Listing" />

<telerik:RadToolTipManager ID="RadToolTipManager1" runat="server" Animation="FlyIn"

Skin="Hay" ToolTipZoneID="tblOptions">

</telerik:RadToolTipManager>

<telerik:RadToolTip ID="RadToolTip1" runat="server" ManualClose="True" Position="BottomRight"

RelativeTo="Element" Skin="Hay" TargetControlID="Button1" Title="See Listings">

<asp:Image ID="Image1" runat="server" ImageUrl="~/Images/music.png" />

Click this button to view the listings in our catalog for all the types of music

you have selected.

</telerik:RadToolTip>

</div>

</form>

</body>

</html>

ToolTip

answered on 14 Apr 2011

6 answers

396 views

Cell Value within selected row

Hi,

GridView control that is released by Microsoft with VS2005, I can easily get the value of any cell with in the selected row (Server side)

Protected Sub GridView1_SelectedIndexChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles GridView1.SelectedIndexChanged

Dim ItemValue As String

ItemValue = GridView1.SelectedRow.Cells(1).Text

End Sub

Can I do it using the rad grid control in simlier way.

Please Help me on this...

Thanks

Grid

answered on 13 Apr 2011

2 answers

96 views

Position by element issue with client-side tooltipmanager

Hello,

I have a radgrid with a column of thumbnail images (unique per row), and I would like to add a tooltip with the full-size image that shows and hides when the mouse is above the thumbnail.

this can all be done on the client since the thumbnail images are named similarly to the full-size images. So far I have the following code:

my tooltip manager markup:

<telerik:RadToolTipManager ID="slideToolTipMan" runat="server" OffsetY="-1"

ShowEvent="FromCode" OnClientBeforeShow="OnClientBeforeShow"

EnableShadow="true"

Sticky="false"

RelativeTo="Mouse"

Position="MiddleRight">

</telerik:RadToolTipManager>

the itemtemplate of the gridtemplatecolumn in the radgrid

<ItemTemplate>

<img onmouseout='HideSlideToolTip(this);' onmouseover='ShowSlideToolTip(this);' id="thumbnailImg" alt="X" src='...' />

</ItemTemplate>

the relevant javascript code:

function ShowSlideToolTip(element) {

var tooltipManager = $find("<%= slideToolTipMan.ClientID %>");

if (!tooltipManager) return;

var tooltip = tooltipManager.getToolTipByElement(element);

if (!tooltip) {

tooltip = tooltipManager.createToolTip(element);

tooltip.set_position(Telerik.Web.UI.ToolTipPosition.MiddleRight);

// <here I insert content into the tooltip>

tooltip.show();

tooltip.set_autoCloseDelay(0);

tooltip.set_contentElement(imgElement);

}

tooltip.set_position(Telerik.Web.UI.ToolTipPosition.MiddleRight);

}

function OnClientBeforeShow(sender, args) {

sender.set_position(Telerik.Web.UI.ToolTipPosition.MiddleRight);

}

function HideSlideToolTip(element) {

var controller = Telerik.Web.UI.RadToolTipController.getInstance();

var tooltip = controller.get_activeToolTip();

if (tooltip) tooltip.hide();

}

The result doesn't work the way it should... it is very peculiar.

the tooltips tend to show up at like one of three or so places (ie to the "middleRight" of say Row 1, row 4, and row 5)

all of the tooltips show up and display the correct content when hovered over the corresponding target, however where the tooltip is positioned seems almost random.

this is becoming a problem for the usability of the interface, because the tooltip is rendered on top of it's own target, and thus it closes and reopens with every mouse movement (since the mouseout event is fired when the tooltip element is on top of the target element).

I have tried everything i can think of, but it does not seem to cooperate. any help would be much appreciated!

ToolTip

answered on 13 Apr 2011

3 answers

137 views

URL in a Grid

I have a bound grid autogenerating the columns. One column as an abbreviation in it and another has a URL.. What I'd like to do is have the URL column just be a hyperlink for the abbreviation. So, how can I make the abbreviation column a hyperlink column then how can i set the URL to be the value of the other column?

Grid

answered on 13 Apr 2011

1 answer

90 views

ExcelML Border Styling

Hi, I am trying to add grid lines to excelml or a border. I want this applied to all styles no matter what style it is. I tried to do this to the default styles, but my excel file won't open because it's "corrupt". Here is my code:

For Each style As StyleElement In e.Styles

Select Case style.Id

Case "itemStyle"

Dim borders As New BorderStylesCollection()

Dim borderStyle As New BorderStyles

For i As Integer = 1 To 4

'four borders

borderStyle.PositionType = DirectCast(i, PositionType)

borderStyle.Color = System.Drawing.Color.Black

borderStyle.LineStyle = LineStyle.Continuous

borderStyle.Weight = 1.0R

borders.Add(borderStyle)

Next

For Each border As BorderStyles In borders

style.Borders.Add(border)

Next

Exit Select

Case "alternatingItemStyle"

Dim borders As New BorderStylesCollection()

Dim borderStyle As New BorderStyles

For i As Integer = 1 To 4

'four borders

borderStyle.PositionType = DirectCast(i, PositionType)

borderStyle.Color = System.Drawing.Color.Black

borderStyle.LineStyle = LineStyle.Continuous

borderStyle.Weight = 1.0R

borders.Add(borderStyle)

Next

For Each border As BorderStyles In borders

style.Borders.Add(border)

Next

Exit Select

End Select

Next

Can anyone help me?

Thank you.

Grid

answered on 13 Apr 2011

1 answer

79 views

Problem with GridDateTimeColumn Filter

I'm new to the teleric-controls.

I was having a look at an issue where the GridDateTimeColumn of the RadGrid didn't seem to working accordingly. The problem is the filter where the date-format of the database is different then the one displayed in the Grid. I have set the DataFormatString to {0:yyyy-MM-dd}, whereas in the database it is formatted to yyyy-MM-dd. When entering the date in the "filter-box" it also changes to a format that is different then the one expected (it seems to have turned the date around; for instance, yyyy-MM-dd-format has been dd-MM-yyyy-format).

I have been looking in the forums, but can't find a solution that quickly.

Kind Regards,

Pieter

Grid

answered on 13 Apr 2011

3 answers

117 views

Problems with RadEditor

Hello,

I have some questions about the insert, update and delete RadGrid:

1) By deleting a record, I want to display a yes/no alert. If the user confirm then the record is deleted, If not, then the alert is closed and the record stay. How can I do that?

2) I cant display a radwindow from the edit form, why? and how can I do that?

3) Before executing the delete action, I need to retrieve a specific value from the deleted record, for example the value which displayed in the "PagNam" column in order to remove the file with the name "PagNam" by deleting the record.
How can I do it?

Please, I need your hep,
It is appreciated to send me a sample code with an explaination.

Regards,
Bader

Editor

answered on 13 Apr 2011