Questions on UI for ASP.NET AJAX Forum

1 answer

287 views

[Solved] Highlighted Menu Item's background color not changing when page has radScheduler control

I am using RadMenu control on Web forms along with RadScheduler on the page. But Selected Menu Item's background color not changing .

Even when i am using pull down Menu item having sub items. Then again parent item is not getting highlighted when page has rad scheduler.

I am using skin as Web20. Please advise.

This is the Site Master code.

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

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

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript">
        var uploadedFilesCount = 0;
        var isEditMode;
        function validateRadUpload(source, e) {
            // When the RadGrid is in Edit mode the user is not obliged to upload file.
            if (isEditMode == null || isEditMode == undefined) {
                e.IsValid = false;
                if (uploadedFilesCount > 0) {
                    e.IsValid = true;
                }
            }
            isEditMode = null;
        }

        function OnClientFileUploaded(sender, eventArgs) {
            uploadedFilesCount++;
        }

    </script>
    <asp:ContentPlaceHolder ID="head" runat="server">
    </asp:ContentPlaceHolder>
    <link href="RELStyles.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
        .style2 {
            width: 828px;
        }
    </style>
</head>
<body style="background-image: url('images/BlueVerticalGradient.png'); background-repeat: repeat-x; background-color: #b3c3cc">
    <form id="form1" runat="server">
        <telerik:RadScriptManager runat="server" ID="scriptManager1" EnableHandlerDetection="false">
        </telerik:RadScriptManager>
        <div>
            <table align="center" class="mainTable" width="993px">
                <tr>
                    <td width="993px" class="whitebg">
                        <table width="993px">
                            <tr>

                                <td align="center" width="713px">
                                    <table>
                                        <tr>
                                            <td>
                                                <img src="Images/REL-logo.jpg" title="Reliant Share!" alt="Reliant Share!" />
                                            </td>
                                            <td class="RelHeaderText">Reliant Care Management Company <span class="RelHeaderTextSmall">L.L.C.</span></td>
                                        </tr>
                                    </table>
                                </td>
                                <td align="right" height="114px" width="280px">
                                    <table height="114px" align="right">
                                        <tr>
                                            <td valign="top" align="right">
                                                <asp:Label runat="server" CssClass="txtHeader" ID="lblName"></asp:Label>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td class="headerContact" align="right" valign="bottom">To contact the Reliant Share! Administrator: <a href="mailto:becky.bos@primecaretech.com">click
                                                here </a>
                                            </td>
                                        </tr>
                                    </table>
                                </td>
                            </tr>
                        </table>
                    </td>
                </tr>
                <tr>
                    <td >
                        <telerik:RadMenu RenderMode="Lightweight" EnableShadows="false" Width="993px" runat="server" OnItemClick="radMainMenu_ItemClick" ID="radMainMenu" >
                            <Items>
                                <telerik:RadMenuItem Text="Home" runat="server" NavigateUrl="Welcome.aspx"></telerik:RadMenuItem>
                                <telerik:RadMenuItem runat="server" Text="Event Calendar" NavigateUrl="EventCalendar.aspx"></telerik:RadMenuItem>
                                <telerik:RadMenuItem runat="server" Text="Conference Rooms" >
                                    <Items>
                                        <telerik:RadMenuItem Text="Large Conference Room" runat="server" NavigateUrl="LargeConfRoom.aspx"></telerik:RadMenuItem>
                                        <telerik:RadMenuItem Text="Small Conference Room" runat="server" NavigateUrl="SmallConfRoom.aspx"></telerik:RadMenuItem>
                                    </Items>
                                </telerik:RadMenuItem>
                                <telerik:RadMenuItem runat="server" Text ="Conference Lines" >
                                    <Items>
                                        <telerik:RadMenuItem Text="All Users" Selected PageViewID="pvAlluserLine" runat="server" NavigateUrl="ConfLineAllUsers.aspx" ></telerik:RadMenuItem>
                                        <telerik:RadMenuItem Text="Ops Team Only" PageViewID="pvOpsteamLine" runat="server" NavigateUrl="ConfLineOpsTeam.aspx" ></telerik:RadMenuItem>
                                        <telerik:RadMenuItem Text="Wentric & Jim Only" PageViewID="pvW&JteamLine" runat="server" NavigateUrl="ConfLineWAndJ.aspx" ></telerik:RadMenuItem>
                                        <telerik:RadMenuItem Text="ALF/RCF" PageViewID="ALFRCFteamLine" runat="server" NavigateUrl="ConfLineALFRCF.aspx" ></telerik:RadMenuItem>
                                    </Items>
                                </telerik:RadMenuItem>
                                <telerik:RadMenuItem Text="Links" NavigateUrl="Links.aspx" runat="server">
                                </telerik:RadMenuItem>
                                <telerik:RadMenuItem Text="Contacts" PageViewID="pvContacts" NavigateUrl="Contacts.aspx"
                                    runat="server">
                                </telerik:RadMenuItem>
                                <telerik:RadMenuItem Text="Files" NavigateUrl="FileExplorer.aspx" runat="server">
                                </telerik:RadMenuItem>
                                <telerik:RadMenuItem Text="File Upload" NavigateUrl="FileUploader.aspx" runat="server">
                                </telerik:RadMenuItem>
                                <telerik:RadMenuItem Text="Manage Announcements" PageViewID="pvManageAnnouncements" NavigateUrl="ManageAnnounceMents.aspx"
                                    runat="server">
                                </telerik:RadMenuItem>
                                <telerik:RadMenuItem Text="Manage Links" NavigateUrl="ManageLinks.aspx" runat="server">
                                </telerik:RadMenuItem>
                                <telerik:RadMenuItem Text="Files Admin" NavigateUrl="FileAdmin.aspx" runat="server">
                                </telerik:RadMenuItem>
                            </Items>
                        </telerik:RadMenu>
                    </td>
                </tr>
                <tr>
                    <td runat="server" id="contentTD" class="cptd">
                        <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
                        </asp:ContentPlaceHolder>
                    </td>
                </tr>
            </table>
        </div>
    </form>
</body>
</html>

and this is the Radscheduler declaration on one of the pages.

<table align="center">
    <tr>
        <td> </td>
    </tr>
    <tr>
        <td align="center"><asp:Label runat="server" ID="lblCalendarType" CssClass="txtHeader"></asp:Label></td>
    </tr>
    <tr>
        <td> </td>
    </tr>
    <tr>

        <td align="center">
                <telerik:RadScheduler Width="940px" runat="server" ID="ASIScheduler" DataDescriptionField="Description"
                    DataEndField="End" DataRecurrenceParentKeyField="RecurrenceParentID" DataRecurrenceField="RecurrenceRule"
                    DataKeyField="ID" DataReminderField="Reminder" DataSourceID="SqlDataSource1"
                    DataStartField="Start" DataSubjectField="Subject"
                    EnableDescriptionField="True" Height="700px"
                    SelectedView="MonthView" OnAppointmentDataBound="ASIScheduler_AppointmentDataBound">
                    <Reminders Enabled="True" />
                    <AdvancedForm Modal="true"></AdvancedForm>
                    <TimeSlotContextMenuSettings EnableDefault="true"></TimeSlotContextMenuSettings>
                    <AppointmentContextMenuSettings EnableDefault="true"></AppointmentContextMenuSettings>
                </telerik:RadScheduler>
                <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:DevConnString %>"
                    SelectCommand="SELECT [ID], [Subject], [start], [End],[RecurrenceRule], [RecurrenceParentID], [Reminder], [Description], [Annotations] FROM [EventCalendar] where Calendartype=@CalendarType"
                    DeleteCommand="DELETE FROM [EventCalendar] WHERE [ID] = @ID" InsertCommand="INSERT INTO [EventCalendar] ([Subject], [Start], [End], [RecurrenceRule], [RecurrenceParentID], [Description],[Reminder],CalendarType,SavedBy) VALUES (@Subject, @Start, @End, @RecurrenceRule, @RecurrenceParentID, @Description, @Reminder,@CalendarType,@SavedBy)"
                    UpdateCommand="UPDATE [EventCalendar] SET [Subject] = @Subject, [Start] = @Start, [End] = @End, [RecurrenceRule] = @RecurrenceRule, [RecurrenceParentID] = @RecurrenceParentID, [Description] = @Description,[SavedBy]=@SavedBy WHERE [ID] = @ID">
                    <UpdateParameters>
                        <asp:Parameter Name="ID" Type="Int32"></asp:Parameter>
                        <asp:Parameter Name="Subject" Type="String"></asp:Parameter>
                        <asp:Parameter Name="Description" Type="String"></asp:Parameter>
                        <asp:Parameter Name="Start" Type="DateTime"></asp:Parameter>
                        <asp:Parameter Name="End" Type="DateTime"></asp:Parameter>
                        <asp:Parameter Name="RecurrenceRule" Type="String"></asp:Parameter>
                        <asp:Parameter Name="RecurrenceParentID" Type="Int32"></asp:Parameter>
                        <asp:Parameter Name="Reminder" Type="String"></asp:Parameter>
                        <asp:Parameter Name="SavedBy" Type="String"></asp:Parameter>
                    </UpdateParameters>
                    <InsertParameters>
                        <asp:Parameter Name="Subject" Type="String"></asp:Parameter>
                        <asp:Parameter Name="Description" Type="String"></asp:Parameter>
                        <asp:Parameter Name="Start" Type="DateTime"></asp:Parameter>
                        <asp:Parameter Name="End" Type="DateTime"></asp:Parameter>
                        <asp:Parameter Name="RecurrenceRule" Type="String"></asp:Parameter>
                        <asp:Parameter Name="RecurrenceParentID" Type="Int32"></asp:Parameter>
                        <asp:Parameter Name="Reminder" Type="String"></asp:Parameter>
                        <asp:Parameter Name="SavedBy" Type="String"></asp:Parameter>
                        <asp:Parameter Name="Calendartype" Type="String"></asp:Parameter>
                    </InsertParameters>
                    <SelectParameters>
                        <asp:Parameter Name="Calendartype" Type="String"></asp:Parameter>
                    </SelectParameters>
                </asp:SqlDataSource>

        </td>

    </tr>
</table>

Menu

answered on 27 Dec 2016

1 answer

183 views

Issue after upgrading to RadGrid - Sorting and Pagination not working properly

Hi,

We have upgraded our existing .NET application from .NET 2.0 to .NET 4.5.2. As part of this upgrade, we have upgraded the Telerik controls as well. The Grid which is upgraded, ie the RadGrid has the following features which are not working as earlier.

1. The sorting is not working properly. The records are getting sorted only in ascending order, descending order sorting is not working at all. Even while sorted in ascending order, when moved to the next page, the sorting is not getting applied. If I click on the column header for sorting, it moves to the first page and shows those records alone as sorted.

2. Pagination is not working properly. When the next page button is clicked, it moves only till second page. After that, how many ever times, the next page is clicked, it remains in second page only. Where if i select on a particular page, say 4, it moves to the fourth page correctly. If i click next page after that, it again moves back to the second page and stays there.

Requesting suggestions to fix this issue at the earliest. Let me know if you require any further details.

P.S: I have implemented NeedDataSource event handler as well for binding the data already.

Regards,

Santhosh.

Grid

answered on 27 Dec 2016

2 answers

245 views

click Thumbnail image event ?

Hi:

because I don't need ImageArea, and only need ThumbnailsArea, so I hide ImageArea !

I need when user click each image (not scroll or next) at ThumbnailsArea, I can fire some client event , and wish get some information about user selected image. How can I do ?

<telerik:RadImageGallery ID="RadImageGallery1" runat="server" Width="550px" Height="100px" ImagesFolderPath="~\img\" >
<ThumbnailsAreaSettings ShowScrollButtons="true" Mode="Thumbnails" ScrollButtonsTrigger="Hover" Position="Top" ThumbnailsSpacing="10"/>
<ImageAreaSettings ShowDescriptionBox="False" ShowNextPrevImageButtons="False" />
<ToolbarSettings Position="None" ShowFullScreenButton="false" ShowSlideshowButton="false" ShowThumbnailsToggleButton="false" />
</telerik:RadImageGallery>

ImageGallery

answered on 27 Dec 2016

1 answer

121 views

Column resize behave different in IE & Chrome

hi, we are facing a strange issue with grid resize. Will Grid resize / horizontal scroll bar automatically wont work in IE? And also in chrome getting the attached issue in all grids, can this be better aligned?

In your demo you have avoided vertical lines, but we have vertical lines, Check the attachment.

Grid

answered on 27 Dec 2016

3 answers

224 views

Can I prevent next columns from resizing automatically when manually resizing a column ?

Hello,

When resizing a column in a RadGrid, widths of the next columns are automatically resized.

I would like to prevent that, or to freeze the column widths of some columns.

I tried the property EnableNextColumnResize set to false on my grid's (from http://docs.telerik.com/devtools/aspnet-ajax/controls/grid/columns/resizing), but it doesn't change anything.

Is there any solution to this ?

Thanks and regards.

Grid

answered on 27 Dec 2016

10 answers

217 views

FileBrowserContentProvider - TreeView Performance

Hi,

Please see the following scenario:

There is the structure:

Folder A

----- Sub-folder 1

----- Sub-folder 2

----- ...

----- Sub-folder 1000

So, we have folder with thousand sub-folders.

Clicking on the Folder A in tree-view side of File-Explorer, we will have the following steps:

1. ResolveRootDirectoryAsTree - execute one time for Folder A in grid (acceptable)

2. ResolveRootDirectoryAsTree - execute one time for Folder A in the tree-view (acceptable)

3. ResolveRootDirectoryAsTree - execute one thousand times, for each sub-folder in the tree-view (very slow)

As you can see, the step 3 is the cause of very slow loading.

Is there any way to avoid this behavior? Do you have any suggestion?

Maybe to try to disable expand of nodes if there is a very large amount of data under them? Only to populate a grid, as the Windows explorer does?

When i turn-off expanding of the tree-view nodes (args.set_cancel(true) on node clicking for test purpose) i have very good response. Because, there are only two executions of ResolveRootDirectoryAsTree method.

Am i missing something here?

I red the article "Setup virtual scrolling in the RadGrid embedded in RadFileExplorer", but i still have the tree-view issue.

FileExplorer

answered on 27 Dec 2016

8 answers

617 views

Client-Side Validation for the CheckBoxes Inside a RadGrid

Hi All.

I have a rad grid and the grid having check boxes in item templates.. i wish to validate that check box at client side.. if any one of the check box was not selected at the time of update then need to show an alert message..
Please help ...

i tried this script but its not working

<script type="text/javascript">

function ValidateCheckBox() {

validateTextBox();

//get target base & child control.

var TargetBaseControl = document.getElementById('<%= RadGridAssetCode.ClientID%>');

var TargetChildControl = "CheckBox1";

//get all the control of the type INPUT in the base control.

var Inputs = TargetBaseControl.getElementsByTagName("input");

for (var n = 0; n < Inputs.length; ++n)

if (Inputs[n].type == 'checkbox' && Inputs[n].id.indexOf(TargetChildControl, 0) >= 0)

if (Inputs[n].checked) return true;

alert('Select at least one checkbox!');

return false;

}

</script>

<ItemTemplate>

<asp:CheckBox id="CheckBox1" OnCheckedChanged="ToggleRowSelection" AutoPostBack="True" runat="server"></asp:CheckBox>

</ItemTemplate>

<telerik:RadButton ID="btnSave" runat="server" Text="Update" OnClientClick="javascript:return ValidateCheckBox();">

<Icon PrimaryIconCssClass="rbSave" PrimaryIconLeft="4" PrimaryIconTop="4" />

</telerik:RadButton>

Please help...

Regards

Prassin

Grid

answered on 27 Dec 2016

1 answer

146 views

[Solved] Building Radio Button Back End

Hello!

I was wondering if there was a way on the back end to setup the toggle states like:

My current code is something like this:

RadButton button = new RadButton();
                        button.GroupName = rbl.ID;
                        button.ToggleType = ButtonToggleType.Radio;
                        button.ButtonType = RadButtonType.StandardButton;
                        button.AutoPostBack = false;
                        button.Text = row.option_name;
                        button.Value = row.option_value;
                        button.RenderMode = RenderMode.Lightweight;
                        button.Icon.PrimaryIconCssClass = "rbToggleRadio";

Would I have to set an on change to handle changing the PrimaryIconCssClass?

Button

answered on 27 Dec 2016

1 answer

499 views

add label to raddropdownlist in a rad listbox

Hello, I am new to telerik,

I have being able to add dropdownlist to my radlistbox but I have a couple of challenges with:

1. I need to display a label in front of each dropdownlist,

<telerik:RadListBox RenderMode="Lightweight" ID="RadListBox3" runat="server" AutoPostBackOnTransfer="True">
<ItemTemplate>
BDF1<telerik:RadComboBox ID="cmbBDF4" Runat="server" Skin="WebBlue">
<Items>
<telerik:RadComboBoxItem runat="server" Font-Size="Smaller" Text="NORTH CENTRAL" Value="NORTH CENTRAL" />
<telerik:RadComboBoxItem runat="server" Font-Size="Smaller" Text="SOUTHERN" Value="SOUTHERN" />
<telerik:RadComboBoxItem runat="server" Font-Size="Smaller" Text="NORTHERN" Value="NORTHERN" />
<telerik:RadComboBoxItem runat="server" Font-Size="Smaller" Text="CENTRAL" Value="CENTRAL" />
<telerik:RadComboBoxItem runat="server" Font-Size="Smaller" Text="ZONE" Value="ZONE" />
</Items>
</telerik:RadComboBox>
</ItemTemplate>
<Items>
<telerik:RadListBoxItem Text="BDF1" Value="BDF1" />
<telerik:RadListBoxItem Text="BDF2" Value="BDF2" />
<telerik:RadListBoxItem Text="BDF3" Value="BDF3" />
<telerik:RadListBoxItem Text="BDF4" Value="BDF4" />
</Items>
</telerik:RadListBox>

2. I need to get the value of each selected dropdownlist value.

ListBox

answered on 26 Dec 2016

9 answers

473 views

preventing client appointment resize

Hi, this is embarrasing but I can't seem to find a property to disable the client resizing the appointments. Moving, adding and editing is OK but clients are not allowed to change the length of the appointment.

I can prevent the event with OnClientAppointmentResizeStart(), but it makes no sense to have the option there and then cancel it, thats just confusing UI design - I want to remove the resize iconography period. (which presumably means slighly less JS is generated too).

regards
ewart

Scheduler

answered on 26 Dec 2016