Questions on UI for ASP.NET AJAX Forum

1 answer

159 views

I generate the following client-side code to trigger the built-in expand functionality for the current item:

    
            There are 2 <a href='#' onclick='$find("ctl00_ContentPlaceHolder1_RadGrid1_ctl00").expandItem(0);return false;'>comments</a> on this post.

This expands just fine. However, I'd like to toggle the visibility of the row. I see a ._toggleExpand(this, event) method in the built-in Radgrid code:

    
            <td class="rgExpandCol"><input type="button" name="ctl00$ContentPlaceHolder1$RadGrid1$ctl00$ctl04$ctl00" value=" " onclick="$find(&quot;ctl00_ContentPlaceHolder1_RadGrid1_ctl00&quot;)._toggleExpand(this, event); return false;__doPostBack('ctl00$ContentPlaceHolder1$RadGrid1$ctl00$ctl04$ctl00','')" title="Expand" class="rgExpand" /></td><td>

Is there a way to harness ._toggleExpand(this, event) to toggle the item?

Or, is there a way that I can detect the state of the row to determine whether to use expandItem() or collapseItem()?

Thanks,

Ken

Grid

answered on 12 Feb 2010

1 answer

124 views

Hierarchy Grid Forcing Postback

I attempted to follow the hierarchy example at http://demos.telerik.com/aspnet-ajax/grid/examples/hierarchy/nestedviewtemplate/defaultcs.aspx, but am getting a post back when I go to expand a row.

Here's what I have, can you tell me what I'm doing wrong?

Thanks.

    
            <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server"> 
        
                    <AjaxSettings> 
        
                        <telerik:AjaxSetting AjaxControlID="ProjectGrid"> 
        
                            <UpdatedControls> 
        
                                <telerik:AjaxUpdatedControl ControlID="ProjectGrid"  LoadingPanelID="RadAjaxLoadingPanel1" /> 
        
                            </UpdatedControls> 
        
                        </telerik:AjaxSetting> 
        
                    </AjaxSettings> 
        
                </telerik:RadAjaxManager> 
        
                <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" /> 
        
                <telerik:RadSplitter ID="Splitter" runat="server" Orientation="Horizontal" width="100%"> 
        
                    <telerik:RadPane ID="ProjectPane" runat="server" width="100%"> 
        
                        <telerik:RadToolBar ID="ProjectToolBar" runat="server" width="100%"> 
        
                            <Items> 
        
                                <telerik:RadToolBarButton Text="My Projects" Font-Bold="True" Font-Size="16px" Font-Names="arial" Width="100%" /> 
        
                            </Items> 
        
                        </telerik:RadToolBar> 
        
                        <telerik:radgrid ID="ProjectGrid" width="100%" runat="server" AllowSorting="true" OnNeedDataSource="ProjectGrid_NeedDataSource" AutoGenerateColumns="false" OnDetailTableDataBind="ProjectGrid_DetailTableDataBind" ShowStatusBar="True" AllowMultiRowSelect="false"> 
        
                            <Clientsettings enablepostbackonrowclick="true"> 
        
                                <Selecting AllowRowSelect="true" /> 
        
                            </Clientsettings> 
        
                            <MasterTableView width="100%" DataKeyNames="projectnumber" HierarchyLoadMode="ServerOnDemand"> 
        
                                <DetailTables> 
        
                                    <telerik:GridTableView DataKeyNames="projectnumber" Name="ProjectDetails" width="100%"> 
        
                                        <Columns> 
        
                                            <telerik:GridBoundColumn HeaderText="Tasks" HeaderButtonType="TextButton" DataField="taskdesc" /> 
        
                                        </Columns> 
        
                                    </telerik:GridTableView> 
        
                                </DetailTables> 
        
                                <Columns> 
        
                                    <telerik:GridBoundColumn HeaderText="Project Number" DataField="projectnumber"></telerik:GridBoundColumn> 
        
                                    <telerik:GridBoundColumn HeaderText="Description" DataField="projectdesc"></telerik:GridBoundColumn> 
        
                                    <telerik:GridBoundColumn HeaderText="Printer Date" DataField="toprinterdate"></telerik:GridBoundColumn> 
        
                                    <telerik:GridBoundColumn HeaderText="CSR" DataField="fname" /> 
        
                                </Columns> 
        
                               </MasterTableView>  
        
                        </telerik:radgrid> 
        
                    </telerik:RadPane> 
        
                </telerik:RadSplitter>

Grid

answered on 12 Feb 2010

3 answers

373 views

[Solved] RadAjaxManager and Radscriptmanager in code behind

Code below will fail because the RadAjaxManager won't be found (RadAjaxManager.GetCurrent returns null). The handler won't be added. However when I place the RadScriptManager component on the form in stead of creating it in the Code behind everything runs fine. (The RadAjaxManager is placed on the form)

How can I make it in such a way that it will also work when creating the RadScriptManager in the codebehind

    
                Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load  
        
                    Dim _ScriptManager As RadScriptManager  
        
                    _ScriptManager = New RadScriptManager  
        
                    _ScriptManager.ID = "ScriptManager" 
        
                    _ScriptManager.EnablePageMethods = True 
        
                    Form.Controls.AddAt(0, _ScriptManager)  
        
                    If RadAjaxManager.GetCurrent(Me.Page) IsNot Nothing Then 
        
                        AddHandler RadAjaxManager.GetCurrent(Me.Page).AjaxRequest, AddressOf HandledRadAjaxRequest  
        
                    End If 
        
                End Sub

Ajax

answered on 12 Feb 2010

2 answers

191 views

Custom image in RADSLIDER used as SCROLL BAR

When we apply CSS to rad slider control ,handle image is not showing fully for example in mouse over it showing middle part of the image from our image. While dragging up and down it showing up and down region of the image so we can’t use full image.

Attached image (scroll Behaviour.jpg) is the image behaviour at various stages, like when dragging top, dragging down and mouse over. We do not want three types of images. We need the same image during all times!!!!

Attached image (smallScroller.jpg) is the real scroll image that we are using currently and we want to use in RADSlider control for the scroll functionality.

We are using the RADSlider control and the CSS provided. Please help in finding the issue!!

Thanks.

Slider

answered on 12 Feb 2010

1 answer

77 views

Using Custom Skins with VS 2008

I'm just starting with custom skins and I"m having a little problem. I've created a custom skin using the Visual Style Builder (nice BTW). I'm drug my new skin to the App_Themes directory and added a Menu control to my master page and a Calendar control to my content page set. Set EnableEmbeddedSkins="false" and set Skin="myskin". Compiled and opened up in IE and nothing..... From everything I read I shouldn't have to register the css files since everything is in the App_Themes directory. I played around a little and got the new skin to work by adding

to my master page and everything worked. I didn't think I would need to do that for each RadControl I'd be using. That could get cumbersome. What am I doing wrong? What is the best practice for using custome skins? From the documentation I thought I was doing things the right way but that doesn't appear to work unless I register the css for each control.

Thanks

Mike

General Discussions

answered on 12 Feb 2010

2 answers

215 views

Get height of grid

Hello,

How can I get the height of the grid each time it is resized (either by changing the Page size, number of records in the grid, etc.).

Thanks!

Grid

answered on 12 Feb 2010

1 answer

60 views

Save an record in ToolTip and Comunicate about it the mainpage

I need to save one new record in tooltip and to comunicate about it the page. How could I do it?

With this code I load control in the tooltip.

protected void OnAjaxUpdate(object sender, ToolTipUpdateEventArgs args)

{

this.UpdateToolTip(args.Value, args.UpdatePanel);

}

private void UpdateToolTip(string elementID, UpdatePanel panel)

{

var idanagraficatipo = -1;

int.TryParse(ddlCentroRichiedente.SelectedValue, out idanagraficatipo);

Control ctrl = Page.LoadControl("~/controls/preaccettazione/Anagrafica.ascx");

panel.ContentTemplateContainer.Controls.Add(ctrl);

controls_preaccettazione_Anagrafica details = (controls_preaccettazione_Anagrafica)ctrl;

details.IdAnagraficaTipo = idanagraficatipo;

}

I try to save record in the control but the problem that after postback I find textboxs empty.

Thank you,

Ines

ToolTip

answered on 12 Feb 2010

6 answers

316 views

[Solved] Duplicate pie slice colors?

I have several pie charts developed within the Telerik Reporting component. These pie charts are using the default slice colors. The problem is that the chart is generating two adjacent slices with the same color. This seems to be happening when there are 7 slices, and two of the slices next to each other are both blue.

Is this unusual? Is there a solution other than setting my own colors in the code-behind?

Thanks.
Dan

Chart (Obsolete)

answered on 12 Feb 2010

1 answer

135 views

UseStaticHeaders issue

I have a RadGrid and something strange seems to be happening with my Javascript when I have UseStaticHeaders set to TRUE.

I have the following line of Javascript:

var

orgIdCell = rgUsers.MasterTableView.get_dataItems()[i].get_cell("OrgIDColumn");

If UseStaticHeaders = FALSE, orgIdCell is populate and there are no problems.

If UseStaticHeaders = TRUE, orgIdCell comes back as NULL.

Why?

is there a workaround?

I need to use orgIdCell to access the innerText propery of a cell in the grid.

I am setting UseStaticHeaders and AllowScrolling to True/False in c# based on some conditions and other button clicks.

It seems that if both UseStaticHeaders and AllowScrolling are set to True, this issue occurs. If only one or the other are set to TRUE, this issue does not happen.

Thanks,
Dave

Grid

answered on 12 Feb 2010

8 answers

195 views

Day Cell colour issues

Hi

I have delevloped a Goodle like calendar that changes the back ground colour of the day cell dependent on a count of actions for that day (very like the google web history cal)

    
            <telerik:RadCalendar ID="DiaryCal" runat="server" Font-Names="Arial,Verdana,Tahoma" 
        
                Skin="Office2007"   
        
                ForeColor="Black"   
        
                Style="border-color: #ececec" AutoPostBack="True" 
        
                CultureInfo="English (United Kingdom)"   
        
                EnableMultiSelect = "false"   
        
                OnSelectionChanged="DiaryCal_OnSelectionChanged"   
        
                OnDayRender="DiaryCal_DayRender" 
        
                ShowDayCellToolTips="false"   
        
            > 
        
            </telerik:RadCalendar> 
        
            <asp:Table ID="Table1" runat="server" CellSpacing="1" BorderWidth="0" Width="175">  
        
                <asp:TableRow ID="TableRow1" runat="server" > 
        
                    <asp:TableCell BackColor="#daf3cb" HorizontalAlign="Center" Width="25%" Height="8px"></asp:TableCell>   
        
                    <asp:TableCell BackColor="#aade8a" HorizontalAlign="Center" Width="25%" Height="8px"></asp:TableCell>   
        
                    <asp:TableCell BackColor="#6dc738" HorizontalAlign="Center" Width="25%" Height="8px"></asp:TableCell>   
        
                    <asp:TableCell BackColor="#4e991f" HorizontalAlign="Center" Width="25%" Height="8px"></asp:TableCell>   
        
                </asp:TableRow>   
        
                <asp:TableRow ID="TableRow2" runat="server">  
        
                    <asp:TableCell HorizontalAlign="Center" Width="25%">  
        
                        <asp:Label ID="Label1" runat="server" Text="1-10" /> 
        
                    </asp:TableCell> 
        
                    <asp:TableCell HorizontalAlign="Center" Width="25%">  
        
                        <asp:Label ID="Label2" runat="server" Text="11-20" /> 
        
                    </asp:TableCell> 
        
                    <asp:TableCell HorizontalAlign="Center" Width="25%">  
        
                        <asp:Label ID="Label3" runat="server" Text="21-30" /> 
        
                    </asp:TableCell> 
        
                    <asp:TableCell HorizontalAlign="Center" Width="25%">  
        
                        <asp:Label ID="Label4" runat="server" Text="40+" /> 
        
                    </asp:TableCell> 
        
                </asp:TableRow> 
        
            </asp:Table> 
        
<telerik:RadToolTipManager ID="RadToolTipManager1" runat="server" ShowCallout="False" Skin="Office2007" style="display: none;" ShowDelay="0" />

in the code behind there is a handler for the DayRender Event and the tooltip events as follows

    
                Protected Sub DiaryCal_DayRender(ByVal sender As Object, ByVal e As Telerik.Web.UI.Calendar.DayRenderEventArgs)  
        
                    Dim cellID As String  
        
                    cellID = String.Format("{0}_{1}_{2}", DiaryCal.ClientID, e.Day.[Date].ToString("yyyy_M_d"), 0)  
        
                    If DiaryCounts IsNot Nothing Then  
        
                        For Each diaryCount As Safe.CRM.DAL.BusinessObjects.DiaryCount In DiaryCounts ' contains a list of days and counts  
        
                            If diaryCount.ActivityCompleteBy = e.Day.Date Then  
        
                                Dim iCounts As Integer = diaryCount.Counts  
        
                                If iCounts >= 1 And iCounts <= 10 Then  
        
                                    e.Cell.Style("background-color") = "#daf3cb"  
        
                                ElseIf iCounts >= 11 And iCounts <= 20 Then  
        
                                    e.Cell.Style("background-color") = "#aade8a"  
        
                                ElseIf iCounts >= 21 And iCounts <= 30 Then  
        
                                    e.Cell.Style("background-color") = "#6dc738"  
        
                                ElseIf iCounts >= 31 Then  
        
                                    e.Cell.Style("background-color") = "#4e991f"  
        
                                End If  
        
                                cellID = String.Format("{0}_{1}_{2}", DiaryCal.ClientID, e.Day.[Date].ToString("yyyy_M_d"), iCounts)  
        
                                Exit For  
        
                            End If  
        
                        Next  
        
                    End If  
        
                    e.Cell.Attributes.Add("id", cellID)  
        
                    RadToolTipManager1.TargetControls.Add(cellID, True)  
        
                End Sub  
        
                Protected Sub RadToolTipManager1_AjaxUpdate(ByVal sender As Object, ByVal e As Telerik.Web.UI.ToolTipUpdateEventArgs) Handles RadToolTipManager1.AjaxUpdate  
        
                    ' get the event date from the cell id    
        
                    Dim idParts As String() = e.TargetControlID.Split(New Char() {"_"c})  
        
                    Dim year As Integer = Int32.Parse(idParts(idParts.Length - 4))  
        
                    Dim month As Integer = Int32.Parse(idParts(idParts.Length - 3))  
        
                    Dim day As Integer = Int32.Parse(idParts(idParts.Length - 2))  
        
                    Dim eventDate As New DateTime(year, month, day)  
        
                    Dim items As Integer = Int32.Parse(idParts(idParts.Length - 1))  
        
                    ' display the proper content based on the event date    
        
                    Dim tooltipActivitesLabel As New Label()  
        
                    Dim tooltipDateLabel As New Label()  
        
                    Dim toolTipPanel As New Panel  
        
                    If items = 0 Then  
        
                        tooltipActivitesLabel.Text = "" 
        
                    ElseIf items = 1 Then  
        
                        tooltipActivitesLabel.Text = String.Format("{0} activity.", items)  
        
                    Else  
        
                        tooltipActivitesLabel.Text = String.Format("{0} activities.", items)  
        
                    End If  
        
                    tooltipDateLabel.Text = String.Format("{0}", eventDate.ToString(CType(DiaryCal, Telerik.Web.UI.RadCalendar).DayCellToolTipFormat))  
        
                    If tooltipActivitesLabel.Text <> "" Then  
        
                        toolTipPanel.Controls.Add(tooltipActivitesLabel)  
        
                        toolTipPanel.Controls.Add(New LiteralControl("<br />"))  
        
                    End If  
        
                    toolTipPanel.Controls.Add(tooltipDateLabel)  
        
                    toolTipPanel.HorizontalAlign = HorizontalAlign.Center  
        
                    e.UpdatePanel.ContentTemplateContainer.Controls.Add(toolTipPanel)  
        
                End Sub

All works fine untill I select a diary entry after this the tool tip still works but as the mouse moves over the other cells the background colour is reset.. Is there anyway I can use JS to keep the colour using a custom client side events.... or am i missing somthing else

Julian

Calendar

answered on 12 Feb 2010