Questions on UI for ASP.NET AJAX Forum

5 answers

357 views

How to Access GridViews child control in JavaScript??

I have used Telerik RadGrid. I have binded my gridviews with 100+ records. I have perform client side operation using javascript function. I am able to call call the javascript function but facing problem while accessing controls values in javascript function.

Please reply soon.

Thanks in advance.

-
Vikram

Grid

answered on 17 Sep 2010

4 answers

417 views

[Solved] RadEditor with no borders?

Is it possible to have a Rad Editor with no borders? I've tried using the css from the article to display an Editor as a textbox, but I still get a top and bottom border for the editor. I'm trying to use several editors on one page and create a custom display so they look like one, allowing me to save the text in particular chunks rather than as a whole.

Here is the code I am using and attached is an image of the result.

<style type="text/css">

.reWrapper_corner, .reWrapper_center

{

display: none !important;

}

.reLeftVerticalSide,

.reRightVerticalSide,

.reToolZone,

.reToolCell

{

background: white !important;

}

.reContentCell

{

border-width: 0 !important;

}

.reWrapper

{

border: 0 !important;

}

.RadEditor

{

filter: chroma(color=c2dcf0);

}

.rade_toolbar.WebBlue .ShowHistory

{

background-image: url(Images/history.png);

}

</style>

<telerik:RadEditor ID="txtEditor1" runat="server" EditModes="Design" ToolbarMode="PageTop" ToolsFile="~/NoTools.xml" ToolsWidth="684px" Width="99%" AutoResizeHeight="true" ContentAreaMode="Div" BorderStyle="None"telerik:RadEditor>

<telerik:RadEditor ID="txtEditor2" runat="server" EditModes="Design" ToolbarMode="PageTop" ToolsFile="~/NoTools.xml" ToolsWidth="684px" Width="99%" AutoResizeHeight="true" ContentAreaMode="Div" BorderStyle="None" ></telerik:RadEditor>

Editor

answered on 17 Sep 2010

1 answer

222 views

The Controls collection cannot be modified because the control contains code blocks (i.e. ).

I'm attempting to use radAjax with a radgrid that does drag and drop. I've done this before successfully, but in this case I cannot get beyond the error message,

The Controls collection cannot be modified because the control contains code blocks (i.e. ).

I've read the support articles and have wrapped everything in either RadCodeBlocks or RadScript blocks, but the error is still there. Any help would be appreciated, I've included the radgrid and the radajax code.

telerik:RadGrid runat="server" ID="grdUnits" AllowPaging="False" Width="100%" AllowMultiRowSelection="false">

<MasterTableView DataKeyNames="UnitID" Width="100%" TableLayout="Fixed" AutoGenerateColumns="false">

<Columns>

<telerik:GridBoundColumn UniqueName="CourseID" Visible="False" DataField="CourseID" ReadOnly="True"></telerik:GridBoundColumn>

<telerik:GridBoundColumn UniqueName="UnitID" Visible="False" DataField="UnitID"></telerik:GridBoundColumn>

<telerik:GridDragDropColumn HeaderStyle-Width="18px" ItemStyle-Width="18px"></telerik:GridDragDropColumn>

<telerik:GridTemplateColumn HeaderText="Units" HeaderStyle-Width="460px" HeaderStyle-Font-Bold="true">

<ItemStyle Width="460px" VerticalAlign="Top"></ItemStyle>

<ItemTemplate>

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

<a href='UnitDetails.aspx?sAction=Edit&CourseID=<%# Container.DataItem("CourseID") %>&UnitID=<%# Container.DataItem("UnitID")%>'>

<%# Container.DataItem("UnitName")%>

</a>

</telerik:RadCodeBlock>

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn HeaderText="Duration" HeaderStyle-Font-Bold="true">

<ItemStyle Width="90px" VerticalAlign="Top"></ItemStyle>

<ItemTemplate>

<asp:Label id="Label8" runat="server"

text='<%# GetDuration(container.dataitem("UnitIsOngoing"),Container.DataItem("UnitDuration"),Container.dataItem("UnitOfDurationName"))%>'>

</asp:Label>

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn HeaderText="Delete" HeaderStyle-Width="50px" HeaderStyle-Font-Bold="true">

<ItemStyle Width="50px" HorizontalAlign="Center" VerticalAlign="Middle"></ItemStyle>

<ItemTemplate>

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

<a onclick='DeleteConfirm(<%# Container.DataItem("UnitID")%>)' href="#here"><IMG id="imgDelete" alt="Delete" src="../Images/delete.gif" border="0"></a>

</telerik:RadCodeBlock>

</ItemTemplate>

</telerik:GridTemplateColumn>

</Columns>

</MasterTableView>

<ClientSettings AllowRowsDragDrop="true" >

<Selecting AllowRowSelect="True" EnableDragToSelectRows="false" />

</ClientSettings>

</telerik:RadGrid>

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

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="grdUnits">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="grdUnits" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Skin="Windows7" Transparency="30"

IsSticky="true" style="position:absolute; top:0; left:0; height:100%; width:100%;">

</telerik:RadAjaxLoadingPanel>

Ajax

answered on 17 Sep 2010

1 answer

160 views

How to Hide One Colum if dont have any values

HI Team

How to i hide one Column if Rad Grid if i dont have any value in that colum while bringing values from database
i have one rad grid in that i'm using GridImageColumn, in GridImageColumn if i have url means it should have to show image , if dont have url means it should have to hide the particular column

See my code...

this is the Url for DataImageUrlFields "~/UserImages/32.jpg"

<

telerik:RadGrid ID="grdtestcheck" runat="server" AutoGenerateColumns="False"

GridLines="None">

</RowIndicatorColumn>

</ExpandCollapseColumn>

<telerik:GridBoundColumn DataField="RepName" HeaderText="Name"

UniqueName="column">

</telerik:GridBoundColumn>

<telerik:GridImageColumn DataImageUrlFields="RepUrl" HeaderText="Image" ImageAlign="Middle"

ImageHeight="50px" ImageWidth="75px" UniqueName="column1">

</telerik:GridImageColumn>

</Columns>

</MasterTableView>

</telerik:RadGrid>

Plese give me how to hide the column like above....

Grid

answered on 17 Sep 2010

1 answer

384 views

Can I right align one or more buttons?

Hi

I have a toolbar with 3 buttons. They default to align to the left one after another. I want to add another button ("Help") but I would like this button to be on the far right of the toolbar is this possible?

Thanks

Johnathan

ToolBar

answered on 17 Sep 2010

6 answers

473 views

FileExplorer- Tree control

Hi Telerik,

I am using custom fileexplorer in my application. In this, i am adding some custom columns to the grid some of which are hidden and i could use them as attribute. I could get the attribute for an item in a grid how ever the same is not available for a tree node. This custom attribute are added for both files and directories in respective ResolveDirectory() and ResolveRootDirectoryAsTree() methods.

Is it possible to get the custom attribute of a tree node?
Is there any event available for treebind at client or server? What i have to do is, on binding, i have to check the custom attribute value and set a different image for the node. This is available with the grid :OnGridRowDataBound(). Do we have similar one for tree?
How could i disbale the custom menu item in a Tree? s explained in above case, i check the attribute and disable the menu item

I used the following code but no success in disabling context menu item
function OnClientContextMenuShowing
{ var contextMenu = radExplorer.get_tree().get_contextMenus();var menuItemImport = contextMenu[0]._findItemByValue("Import");
menuItemImport.disable();//None of this is making the custom menu item "Import" disabled
//menuItemImport..set_enabled(false);//
}
Regards,
Srikanth

FileExplorer

answered on 17 Sep 2010

1 answer

106 views

Error in RadManager Tool Tip

Hi Team,

I've implemented the RadManager Tool Tip by the guide of this  http://demos.telerik.com/aspnet-ajax/scheduler/examples/radtooltip/defaultcs.aspx example.

I've implemented completely whatever you defined in that example.

Below is my code.

aspx page:

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

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="RadScheduler1">

<UpdatedControls>

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

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" Width="100%" runat="server"

Skin="WebBlue">

</telerik:RadAjaxLoadingPanel>

<asp:UpdatePanel runat="server" ID="UpdatePanel1" UpdateMode="Conditional">

<ContentTemplate>

<div style="width: 803px; background: transparent url('Images/background.png') no-repeat 0 0;

padding-left: 20px;">

<telerik:RadScheduler runat="server" ID="RadScheduler1" Skin="Web20" CustomAttributeNames=

"StartTime,EndTime,SessionDate,DisplayPermitName,EventStartDate,DisplayClientTypeVisibility,DisplayResourceVisibility,DisplayFacilityVisibility,EventEndDate,ID,DisplayPermitVisibility,DisplayFacilityName,DisplayResourceName,DisplayClientTypeName,Event_ID"

SelectedDate="2010-08-10" DataStartField="EventStartDate" on EnableDatePicker="true"

GroupingDirection="Horizontal" MonthView-GroupingDirection="Horizontal" DataEndField="EventEndDate"

DayStartTime="08:00:00" DayEndTime="23:00:00" ShowFullTime="true" DataKeyField="ID"

FirstDayOfWeek="Monday" LastDayOfWeek="Friday" DataSubjectField="DisplayPermitName"

EnableEmbeddedSkins="false" AllowDelete="false" AllowEdit="false" TimelineView-NumberOfSlots="4"

AllowInsert="false" OnAppointmentDataBound="RadScheduler1_AppointmentDataBound"

OnDataBound="RadScheduler1_OnDataBound" >

<AdvancedForm Modal="true" />

<AppointmentTemplate>

<%--Permit Name--%>

<asp:LinkButton runat="server" ID="lblDisplayPermitName" OnClick="RedirectToEventMaintenance"

Style="font-weight: bold; color: HighlightText; font-size: 14px;" CommandArgument='<%# Eval("Event_ID") + "~" + Eval("SessionDate") %>'

Visible='<%# Convert.ToBoolean(Eval("DisplayPermitVisibility")) %>'>

<%# Eval("DisplayPermitName")%>

</asp:LinkButton><br />

<%--Start Time--%>

<%--End Time--%>

<%# Eval("StartTime")%>

-

<%# Eval("EndTime")%>

<br />

<%--ClientType Name--%>

<asp:Label runat="server" ID="lblDisplayClientTypeName" Text="ClientType Name :"

Visible='<%# Convert.ToBoolean(Eval("DisplayClientTypeVisibility")) %>'>

<%# Eval("DisplayClientTypeName")%>

</asp:Label><br />

<%--Facility Name--%>

<asp:Label runat="server" ID="lblDisplayFacilityName" Text="Facility Type Name :"

Visible='<%# Convert.ToBoolean(Eval("DisplayFacilityVisibility")) %>'>

<%# Eval("DisplayFacilityName")%>

</asp:Label>

<br />

<%--Resource Name--%>

<asp:Label runat="server" ID="lblDisplayResourceName" Text="Resource Name :" Visible='<%# Convert.ToBoolean(Eval("DisplayResourceVisibility")) %>'>

<%# Eval("DisplayResourceName")%>

</asp:Label><br />

</AppointmentTemplate>

</telerik:RadScheduler>

<telerik:RadToolTipManager runat="server" ID="RadToolTipManager1" Width="320" Height="210"

Animation="None" HideEvent="LeaveToolTip" Text="Loading..." RelativeTo="Element"

OnAjaxUpdate="RadToolTipManager1_AjaxUpdate" OnClientBeforeShow="clientBeforeShow"

EnableShadow="true" />

</ContentTemplate>

</asp:UpdatePanel>

</div>

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

<script type="text/javascript">

function hideActiveToolTip() {

var tooltip = Telerik.Web.UI.RadToolTip.getCurrent();

if (tooltip) {

tooltip.hide();

}

Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(beginRequestHandler);

function beginRequestHandler(sender, args) {

var prm = Sys.WebForms.PageRequestManager.getInstance();

if (args.get_postBackElement().id.indexOf('RadScheduler1') != -1) {

hideActiveToolTip();

}

function clientBeforeShow(sender, eventArgs) {

w = $telerik.$(window).width() / 2;

h = $telerik.$(window).height() / 2;

if ((sender._mouseX > w) && (sender._mouseY > h)) {

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

return;

}

if ((sender._mouseX < w) && (sender._mouseY > h)) {

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

return;

}

if ((sender._mouseX > w) && (sender._mouseY < h)) {

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

return;

}

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

}

</script>

</telerik:RadCodeBlock>

.cs file

---------

#region Scheduler Events

/// <summary>

/// RadScheduler1_AppointmentDataBound

/// </summary>

/// <param name="sender"></param>

/// <param name="e"></param>

protected void RadScheduler1_AppointmentDataBound(object sender, Telerik.Web.UI.SchedulerEventArgs e)

{

var schedulesGroupsSubjects = (from schdules in AdminController.State.Session.Schedules

group schdules by schdules.DisplayPermitName);

int count = schedulesGroupsSubjects.ToArray().Count();

for (int i = 0; i < count; i++)

{

// Random random = new Random();

// Color[] randomColor = new Color[count];

// randomColor[i] = Color.FromArgb(random.Next(255), random.Next(255), random.Next(255));

// string[] color = new string[count];

// color[i]=(new Random()).Next(0xffffff).ToString("x6");

string[] strColor = new string[]{"rsCategoryDarkBlue", "rsCategoryBlue", "rsCategoryDarkGreen", "rsCategoryGreen", "rsCategoryDarkRed",

"rsCategoryOrange", "rsCategoryPink", "rsCategoryRed", "rsCategoryViolet", "rsCategoryYellow"};

// strColor[i] = new Random().Next(strColor[i]).ToString();

var schedulevar = schedulesGroupsSubjects.ToArray()[i].ToList<Schedule>();

IList<Schedule> schNew = schedulevar.ToList<Schedule>();

for (int j = 0; j < schNew.Count; j++)

{

if (e.Appointment.Subject == schNew[j].DisplayPermitName)

e.Appointment.CssClass = strColor[i].ToString();

}

/// <summary>

/// RadScheduler1_OnDataBound

/// </summary>

/// <param name="sender"></param>

/// <param name="e"></param>

protected void RadScheduler1_OnDataBound(object sender, EventArgs e)

{

if (RadScheduler1.SelectedView == SchedulerViewType.MonthView)

RadScheduler1.ShowHoursColumn = false;

else if (RadScheduler1.SelectedView == SchedulerViewType.WeekView)

RadScheduler1.ShowHoursColumn = false;

else

RadScheduler1.ShowHoursColumn = true;

RadToolTipManager1.TargetControls.Clear();

ScriptManager.RegisterStartupScript(this, typeof(Page), "HideToolTip", "hideActiveToolTip();", true);

}

protected void RadScheduler1_AppointmentCreated(object sender, AppointmentCreatedEventArgs e)

{

if (e.Appointment.Visible && !IsAppointmentRegisteredForTooltip(e.Appointment))

{

string id = e.Appointment.ID.ToString();

foreach (string domElementID in e.Appointment.DomElements)

{

RadToolTipManager1.TargetControls.Add(domElementID, id, true);

}

private bool IsAppointmentRegisteredForTooltip(Appointment apt)

{

foreach (ToolTipTargetControl targetControl in RadToolTipManager1.TargetControls)

{

if (apt.DomElements.Contains(targetControl.TargetControlID))

{

return true;

}

return false;

}

protected void RadToolTipManager1_AjaxUpdate(object sender, ToolTipUpdateEventArgs e)

{

int aptId;

Appointment apt;

if (!int.TryParse(e.Value, out aptId))//The appoitnment is occurrence and FindByID expects a string

{

apt = RadScheduler1.Appointments.FindByID(e.Value);

if(apt == null)

apt = RadScheduler1.Appointments.FindByID(aptId);

}

else //The appointment is not occurrence and FindByID expects an int

apt = RadScheduler1.Appointments.FindByID(aptId);

AppointmentToolTip toolTip = (AppointmentToolTip)LoadControl("~/UserControls/AppointmentToolTip.ascx");

toolTip.TargetAppointment = apt;

e.UpdatePanel.ContentTemplateContainer.Controls.Add(toolTip);

}

#endregion

I got null value in "apt" of RadToolTipManager1_AjaxUpdate()

so exception raised in this page and appointmenttooltip.ascx page too

can some one help me out.....

Thanks,

Daniel.B

Scheduler

answered on 17 Sep 2010

5 answers

355 views

RadGrid DataTable Bound Not Binding Values

Im data binding a radgrid to a datatable and creating the columns and setting them to a column in the datatable. This shows all the columns and creates the correct number of rows but doesn't bind the values from the datatable into the grid. My code is below. and see screenshot attached.

Me.uxGrid.DataSource = dt

For Each dc In dt.Columns

gc = New GridBoundColumn

gc.HeaderText = dc.Caption

gc.UniqueName = dc.Caption

gc.DataField = dc.Caption

Me.uxGrid.MasterTableView.Columns.Add(gc)

Grid

answered on 17 Sep 2010

5 answers

169 views

Grouping

I'm trying to do a simple grouping in my grid but I cannot figure out what I am missing. All I want in my group "header" i guess it would be called is the field name but for some reason it is coming out [field_title]: [field_name]. When can I remove the field_title and only show field_name?

<telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateColumns="False"

DataSourceID="sqlCategories" GridLines="None">

<

MasterTableView DataKeyNames="Main_Category_ID,Sub_Category_ID"

DataSourceID="sqlCategories">

<

RowIndicatorColumn>

<

HeaderStyle Width="20px"></HeaderStyle>

</

RowIndicatorColumn>

<

ExpandCollapseColumn>

<

HeaderStyle Width="20px"></HeaderStyle>

</

ExpandCollapseColumn>

<telerik:GridBoundColumn DataField="Main_Category"

SortExpression="Main_Category" UniqueName="Main_Category" Visible="False">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="Sub_Category" HeaderText="Sub_Category"

SortExpression="Sub_Category" UniqueName="Sub_Category">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="Sub_Category_Desc"

HeaderText="Sub_Category_Desc" SortExpression="Sub_Category_Desc"

UniqueName="Sub_Category_Desc">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="Main_Category_ID" DataType="System.Int32"

HeaderText="Main_Category_ID" ReadOnly="True" SortExpression="Main_Category_ID"

UniqueName="Main_Category_ID">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="Sub_Category_ID" DataType="System.Int32"

HeaderText="Sub_Category_ID" ReadOnly="True" SortExpression="Sub_Category_ID"

UniqueName="Sub_Category_ID">

</telerik:GridBoundColumn>

</Columns>

<telerik:GridGroupByExpression>

<telerik:GridGroupByField FieldAlias="Main_Category" FieldName="Main_Category" FormatString="{0}"></telerik:GridGroupByField>

</SelectFields>

<telerik:GridGroupByField FieldName="Main_Category" SortOrder="Descending"></telerik:GridGroupByField>

</GroupByFields>

</telerik:GridGroupByExpression>

</GroupByExpressions>

</

MasterTableView>

</telerik:RadGrid>

Grid

answered on 17 Sep 2010

2 answers

81 views

z-index problem while using two RadMenus at the same time

Good day!
I use two RadMenu at the same time. One of them is depended on enother. But I want the first one to have z-index bigger than second one =(
but they behave wrong =(
You can see the bug at attached image.
Both grids have the same my own custom skin,
Z-index of div with the first menu is bigger than z-index of the div with second one.
what can I do? =(

Menu

answered on 17 Sep 2010