Questions on UI for ASP.NET AJAX Forum

4 answers

123 views

[Solved] Activate Panelbars from DropDownList

Trying to utilize the RadPanelBar but I need it controlled by a RadDropDownList. I am unsure of how to do this via the code-behind because there is no "ID" associated with them. Currently they are set to visible=false but would like to make them visible when a user changes the DropDownList.

If option 1 then show these RadPanelBar options
If Option 2 then show these RadPanelBar options,
etc...

PanelBar

answered on 16 Oct 2013

4 answers

140 views

[Solved] Wrong start time

Hello,

I have a problem with the RadScheduler control. When I move an appointment, sometime, the new start time is false…

I test with args.get_newStartTime() (client side) and e.ModifiedAppointment.Start (server side) and the twice send me the same value.

<telerik:RadScriptBlock runat="server">

<script type="text/javascript">

function onAppointmentMoveEnd(sender, args)

{

alert(args.get_newStartTime());

}

</script>

</telerik:RadScriptBlock>

<div>

<telerik:RadScheduler OnClientAppointmentMoveEnd="onAppointmentMoveEnd" runat="server"

ID="schPlanning" DataKeyField="Libelle" DataSubjectField="SujetEvenement"

DataDescriptionField="Libelle" DataStartField="Debut" DataEndField="Fin" Height="1000px">

</telerik:RadScheduler>

</div>

public partial class Calendrier : Page

{

private void schPlanning_AppointmentUpdate(object sender, AppointmentUpdateEventArgs e)

{

DateTime newStartTime = e.ModifiedAppointment.Start;

// Alert(newStartTime)

}

protected override void OnInit(EventArgs e)

{

base.OnInit(e);

schPlanning.AppointmentUpdate += new AppointmentUpdateEventHandler(schPlanning_AppointmentUpdate);

}

protected void Page_Load(object sender, EventArgs e)

{

if (!IsPostBack)

{

List<Evenement> evenements = new List<Evenement>();

evenements.Add(new Evenement("Sujet", "Libelle", DateTime.Now.Date.AddHours(15), DateTime.Now.Date.AddHours(17)));

schPlanning.DataSource = evenements;

}

public class Evenement

{

public string SujetEvenement { get; set; }

public string Libelle { get; set; }

public DateTime Debut { get; set; }

public DateTime Fin { get; set; }

public Evenement(string sujetEvenement, string libelle, DateTime debut, DateTime fin)

{

SujetEvenement = sujetEvenement;

Libelle = libelle;

Debut = debut;

Fin = fin;

}

I join a screenshot when I have the error.

Information:

- Telerik 2013.2.717.35

- Internet Explorer 9.0.8112.16421

Sorry for my approximate English, I’m French.

Jérémy

Scheduler

answered on 16 Oct 2013

3 answers

263 views

Excel Export & Remove Expand Icon

Hi All,

I have an all code-behind solution and noticed an interesting quirk. I have a grid with hierarchy. Whenever I go to export it to Excel I receive a blank row under each row with content. I found the following link that points out my HiearchyLoadMode as being the culprit, and sure enough, if I switch from Client to ServerOnDemand the blank rows go away.

Unfortunately, I am using the Export to Excel functionality along with this link that pertains to hiding the expand/collapse icons when there are no records, and setting it to something other than Client hides all expand/collapse icons.

Does anyone one have any ideas how I can have both?

Thanks,
Mark

Grid

answered on 16 Oct 2013

3 answers

490 views

[Solved] Disable Button on CheckBox unchecked

I am using the code below to force customers to select item from a Grid CheckBox

function GetCheckedItemCountbtnClick() {

var checkedcount = 0;

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

for (var i = 0; i < grid.get_masterTableView().get_dataItems().length; i++) {

var objchkbox = grid.get_masterTableView().get_dataItems()[i].findElement("CheckBoxStatus");

if (objchkbox.checked) {

checkedcount++;

}

//}

if (checkedcount > 8) {

objchkbox.checked = false;

alert("Please select only 8 item");

return false;

}

if (checkedcount == 0) {

alert("Please Check at least one CheckBox");

return false;

}

}





I have a Button I want to disable when the 'checkedcount ==0' unless an item is checked

<asp:Button ID="btnPrint" runat="server" Font-Size="X-Small" OnClick="btnPrint_Click"
                            Text="Print" ToolTip="Create a  report..." />


Nothing seems to work for me. Any idea will be appreciated.

General Discussions

answered on 16 Oct 2013

4 answers

135 views

Extra space after resizing browser window

hi support,

I'm using RadSplitter and RadPane to build my page (see page markup as below). The page has min-height and min-width setup in order to show scrollbar(s) whenever the size of browser window hits the minimum height/width. The problem i have is an extra space appears at the bottom of page (under the most outer RadSplitter) after resizing the browser window to the min-height and this ONLY happens in IE8 and Safari 5.0 + (images attached), the page itself is quite simple and i don't know it's because i'm doing something wrong or related to telerik control. Please help and very appreciated!

<%@ 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 id="Head1" runat="server">

<title></title>

<style type="text/css">

html, body, form

{

height: 100%;

margin: 0;

padding: 0;

overflow: hidden;

}

form.main

{

overflow: auto;

}

.MainDiv

{

height: 100%;

margin: 0;

padding: 0;

overflow: hidden;

min-height:500px;

min-width:1000px;

}

.LeftColumn, .RightColumn

{

background: #eee;

}

.CenterColumn

{

background: #fff;

border: 1px solid #777;

}

.Footer

{

background: #eee;

text-align: center;

}

.Header

{

text-align: center;

}

</style>

</head>

<body>

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

<telerik:RadScriptManager ID="MasterRadScriptManager" runat="server">

</telerik:RadScriptManager>

<div id="mainDiv" class="MainDiv">

<telerik:RadSplitter runat="server" ID="PageSplitter" Orientation="Horizontal" BorderSize="1"

VisibleDuringInit="false" Width="100%" Height="100%">

<telerik:RadPane runat="server" ID="TopHeaderPane" Height="50px" Locked="true" Scrolling="None">

<div class="Header">Top Header</div>

</telerik:RadPane>

<telerik:RadPane runat="server" ID="MainPane" Scrolling="None">

<telerik:RadSplitter runat="server" ID="MainSplitter" BorderSize="0" Orientation="Vertical"

VisibleDuringInit="false" Width="100%" Height="100%">

<telerik:RadPane runat="server" ID="LeftColumnPane" Scrolling="None" CssClass="LeftColumn"

Width="220px">

<div id="LeftSideColumn">Left side menu contents</div>

</telerik:RadPane>

<telerik:RadPane runat="server" ID="MainContentPane" Scrolling="None"

CssClass="CenterColumn">

<telerik:RadSplitter runat="server" ID="MainContentSplitter" Orientation="Horizontal"

BorderSize="1" VisibleDuringInit="false" Width="100%" Height="100%">

<telerik:RadPane runat="server" ID="MainContentScreenContentPane" Scrolling="Both">

<asp:TextBox ID="textBox01" runat="server">Input textbox</asp:TextBox>

</telerik:RadPane>

<telerik:RadPane runat="server" ID="MainContentButtonBarPane" Scrolling="None" Height="40px"

Locked="true">

<asp:Button ID="SubmitButton" runat="server" Text="Submit" />

</telerik:RadPane>

</telerik:RadSplitter>

</telerik:RadPane>

<telerik:RadPane runat="server" ID="RightColumnPane" CssClass="RightColumn" Width="220px"

Scrolling="None">

<div id="RightSideColumn">Right side menu contents</div>

</telerik:RadPane>

</telerik:RadSplitter>

</telerik:RadPane>

<telerik:RadPane runat="server" ID="MasterFooterPane" Height="25px" CssClass="Footer"

Scrolling="None">

<div class="Footer">Footer Bar</div>

</telerik:RadPane>

</telerik:RadSplitter>

</div>

</form>

</body>

</html>

thanks,
Roger

Splitter

answered on 16 Oct 2013

6 answers

517 views

RadDatePicker SelectedDate null when disable

Hi,

In my page i have 3 date picker, but only 2 are enable. The last one of those is disable and only have a selectedDate when the first 2 one have a date selected. Everything is set from client side on OnDateSelected event.

But i try to get the date from my last datepicker in server side it always return me a null value.

I try to enable the control and it work fine i was able to get the selecteddate. But i can't keep the control enable i absolutly need it disable.

Here is the code i'm using to validate my selecteddate:

    
                    <script language="javascript" type="text/javascript">  
        
                        var datePickerAttributionSetter;  
        
                        function InitializedAttributionDateSetter(sender, args)  
        
                        {  
        
                            var datePickerAttribution = $find("<%= RadDatePickerAttribution.ClientID %>");  
        
                            var datePickerTheoricalExam = $find("<%= RadDatePickerTheroicExam.ClientID %>");  
        
                            var datePickerPracticalExam = $find("<%= RadDatePickerPracticalExam.ClientID %>");  
        
                            datePickerAttributionSetter =  
        
                             new QualificationAttribution.QualificationAttributionDateSetter(datePickerAttribution,  
        
                             datePickerTheoricalExam, datePickerPracticalExam);  
        
                        }  
        
                        Sys.Application.add_load(InitializedAttributionDateSetter);      
        
                    </script>

    
            QualificationAttribution.QualificationAttributionDateSetter = function(datePickerAttribution, datePickerTheoricalExam, datePickerPracticalExam)  
        
            {  
        
                this._datePickerAttribution = datePickerAttribution;  
        
                this._datePickerTheoricalExam = datePickerTheoricalExam;  
        
                this._datePickerPracticalExam = datePickerPracticalExam;  
        
                if ((this._datePickerTheoricalExam != null) && (this._datePickerPracticalExam != null))  
        
                {  
        
                    var theoricalSelectedDateHandler = FixHandler(this.OnSelectedDate, this);  
        
                    datePickerTheoricalExam.add_dateSelected(theoricalSelectedDateHandler);  
        
                    datePickerTheoricalExam.add_disposing(function()  
        
                    {  
        
                        datePickerTheoricalExam.remove_dateSelected(theoricalSelectedDateHandler);  
        
                    });  
        
                    var practicalSelectedDateHandler = FixHandler(this.OnSelectedDate, this);  
        
                    datePickerPracticalExam.add_dateSelected(practicalSelectedDateHandler);  
        
                    datePickerPracticalExam.add_disposing(function()  
        
                    {  
        
                        datePickerPracticalExam.remove_dateSelected(practicalSelectedDateHandler);  
        
                    });  
        
                }  
        
            }  
        
            QualificationAttribution.QualificationAttributionDateSetter.prototype.OnSelectedDate = function()  
        
            {  
        
                var theoricalExamDate = this.GetDate(this._datePickerTheoricalExam);  
        
                var practicalExamDate = this.GetDate(this._datePickerPracticalExam);  
        
                if ((theoricalExamDate != null) && (practicalExamDate != null))  
        
                {  
        
                    var highestDate = this.GetHighestDate(theoricalExamDate, practicalExamDate);  
        
                    this._datePickerAttribution.set_selectedDate(new Date(highestDate));  
        
                }  
        
                else 
        
                {  
        
                    this._datePickerAttribution.set_selectedDate();  
        
                }  
        
            }  
        
            QualificationAttribution.QualificationAttributionDateSetter.prototype.GetDate = function(radDatePicker)  
        
            {  
        
                return radDatePicker.get_selectedDate();  
        
            }  
        
            QualificationAttributionDateSetter.prototype.GetHighestDate = function(theoricalExamDate, practicalExamDate)  
        
            {  
        
                if ((theoricalExamDate == null) || (practicalExamDate == null))  
        
                {  
        
                    return null;  
        
                }  
        
                if (theoricalExamDate > practicalExamDate)  
        
                {  
        
                    return theoricalExamDate;  
        
                }  
        
                return practicalExamDate;  
        
            }

Thx for your time,
Guillaume

Calendar

answered on 16 Oct 2013

2 answers

523 views

Sys.Extended.UI - Framework 4.0 Error

I've seen some posts in here about this issue but none seem to be answered.

I'm developing an ASP.Net Website using the AjaxControlToolkit - September 2013 release along with the Q2 2013 SP1 release of the Telerik.Web.UI controls.

I have a RadScriptManager on my page:
<telerik:RadScriptManager ID="ScriptManager1" runat="server">
<Scripts>
<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />
</Scripts>
</telerik:RadScriptManager>

I also have an AjaxToolkit:ModalPopupExtender that, when the application is ran, throws the following Javascript error:
Microsoft JScript runtime error: 'Sys.Extended.UI' is null or not an object

If I replace my RadScriptManager with an AjaxToolkit:ToolkitScriptManager, it works fine.

I believe this issue is because in the 3.5 and up frameworks for the AjaxControlToolkit, the namespace changed from AjaxControlToolkit to Sys.Extended.UI.

I just need to know how to make my RadScriptManager work with the latest AjaxControlToolkit so I don't get this error.

Thanks!

Ajax

answered on 16 Oct 2013

1 answer

74 views

how to find panel in radscheduler advancedform

Hello, Telerik team,
we use radscheduler advancedtemplate. The requirement Do NOT show description panel when select resource rooms 201. When select other resource Rooms will show up that description panel.

Please see below code. We have panel in <AdvancedInsertTemplate>and <AdvancedEditTemplate> block for description label and textbox. When select a room 201(please see attached screen), need to hide that description panel. Please help for how I can find that panel ID in "roomResource_SelectedIndexChanged", then make that panel visible is false or you have good solution for hide that panel? Thanks.

<AdvancedInsertTemplate>
<asp:DropDownList ID="roomResource" runat="server" OnSelectedIndexChanged="roomResource_SelectedIndexChanged"
AppendDataBoundItems="true" AutoPostBack="true" DataSourceID="SqlDataSource1" SelectedValue='<%#Eval("room") %>' DataTextField="roomname" DataValueField="roomid" />
......
<asp:Panel ID=DescriptionInset" runat="server">
     <asp:Label ID="Room1Desc" Text="Description" runat="server"></asp:Label>
     <asp:TextBox ID="txtRoom1Desc" runat="server"></asp:TextBox> />
</asp:Panel>
.......
</AdvancedInsertTemplate>
<AdvancedEditTemplate>
......
<asp:Panel ID="DescriptionEdit" runat="server">
        <asp:Label ID="Label2" Text="Description" runat="server"></asp:Label>
        <asp:TextBox ID="txtRoom1Desc" runat="server" Text='<%# Eval("Description") %>' />
</asp:Panel>
.......
</AdvancedEditTemplate>

General Discussions

answered on 16 Oct 2013

1 answer

153 views

Text show Html Encode when selected value

When I bind data table with text html Text
Show in dropdowntree is ok. But when set selected value of RadDropdownTree, dropdowntree show html encode text -> Wrong.
See example:
Load data in dropdowntree: see before.jpg

When set selected value of dropdowntree: see after.jpg

DropDownTree

answered on 16 Oct 2013

1 answer

117 views

RadEditor's default font is not available in Content

Hi

We are using RadEdior control with following markup
<telerik:RadEditor ID="reNotes" runat="server" ClientIDMode="Static"
Language="en-US"
TabIndex="72"
EditModes="Design"
Height="150px"
Width="100%"
ToolsFile="~/EditorTools.xml"
CssClass="defaultText" >
</telerik:RadEditor>

.defaultText
{
padding-top: 0px;
text-align:left;
}

Default text on the page is Arial 11px. When User set font style to Arial, "radeditor.content" property does not include font -family name into the style. Please see the attached document.
We would like to get the default font-family name too from "radeditor.content". Can you please suggest how can I achieve this?

Thank you.

Editor

answered on 16 Oct 2013