Questions on UI for ASP.NET AJAX Forum

3 answers

195 views

Client side performance using a lot of RadComboBox on RadGrid

Hi Telerik Team,

My RadGrid have 5 columns ( 4 GridBoundColumn, 1 template column with RadComboBox control).
I change page size of my RadGrid to 2k records anh it's too slow to render my Radgird.

View source of the page, each RadComboBox will be added a script bellow:

Sys.Application.add_init(function()

$create(Telerik.Web.UI.RadComboBox, {"_dropDownWidth":0,"_height":0,"_isAspNet35":true,"_skin":"Web20","_uniqueId":"rdgDemo1$ctl00$ctl200$txtProjectPaid_20101","clientStateFieldID":"rdgDemo1_ctl00_ctl200_txtProjectPaid_20101_ClientState","collapseAnimation":"{\"duration\":450}","expandAnimation":"{\"duration\":450}","itemData":[]}, null, null, $get("rdgDemo1_ctl00_ctl200_txtProjectPaid_20101"));

});

So, if my radgrid have 2k records, my page will have 2k above script. It's very slow....

Could you give me any solutions to solve this?

Thanks!

ComboBox

answered on 27 Mar 2012

1 answer

109 views

Unnecessary UI component around Raddock title in IE7

Hello,
I have set the height of radDock using $telerik.getViewPortSize() in JavaScript since the height of rad dock is not occupying the height of form. I cannot hard Code the height since it is not compatible on changing screen resolution. Everything works fine expect for on IE7. It causes some unpleasant UI effects which can be observed in the attached file. I have added a div around the Rad Dock Layout which surrounds the Rad dock and finally the rad grid. My main target is to provide full length to rad dock to capture the whole screen. Providing height in percentage was also not suitable. How can these components be rectified? Thanks in advance.

Dock

answered on 27 Mar 2012

1 answer

226 views

How to disallow a blank and a 0 to be entered on a RadNumericTextBox

I am using RadControls for ASP.NET AJAX Q1 2012 in my current project.

I have a web page which has a RadNumericTextBox as follows:

<telerik:RadNumericTextBox ID="rntbInitialLevel" MaxLength="4" MinValue="0" MaxValue="100" Type="Number" Width="35" runat="server">

<NumberFormat DecimalDigits="1" />

</telerik:RadNumericTextBox>

The valid value that can be entered on the RadNumericTextBox ranges from 0.10 to 100.0.

I would like to disallow the user from entering a blank, "0", "00", "000", "0000", "0.0", "0.00", "00.0"

Can you please show me how to do this?

Thanks,
Herman

General Discussions

answered on 27 Mar 2012

2 answers

147 views

How RadStyleSheetManager work with App_Themes folder?

Hi,

I wonder if RadStyleSheetManger could combine css files for non-RadControl pages?

Also, Could we use RadStyleSheetManager work with the App_Themes folder ( the ASP.NET folder for .skin)?

Thanks

Ping

ScriptManager and StyleSheetManager

answered on 27 Mar 2012

1 answer

91 views

RadTreeView: draggin node between trees without deleting it from source

I have 2 radtreeview controls in a site, and want to copy one node the other tree control by drag/drop functionality but the source node is being deleted from the source node (cut/paste), I want to emulate the copy functionality, without deleting the node form the source.
Thanks in advance for the help.

TreeView

answered on 27 Mar 2012

1 answer

126 views

listview update of pk

Hi,

i have a problem with the listview update function.
I'm using the CRUD Operations for the update.

My database looks something like:
fk1
fk2
id
...
...

fk1,fk2 and id are part of the primary key.

My listview can update every column, except columns belonging to the pk. Is this intended or am i doing something wrong?

Greetings

PS: I'm using a linqdatasource.

ListView

answered on 27 Mar 2012

4 answers

234 views

RadScheduler/RadAjaxManager second AJAX request does nothing

We are using RadScheduler and RadAjaxManager and it works for the first AJAX request (eg, change month) but the second request does nothing, no error message, no change to display at all.

This is a little complex to explain but the specifics of the problem are that the website it is used on is a content management system that does not have actual ASPX pages for content pages, instead it uses ASP.NET 4.0 page routing. A routing rule sends the page request to a specific ASPX page which works out the URL requested and displays the requested content.

The problem we are having only occurs on pages requested this way. Our RadScheduler/RadAjaxManager are in an ASCX custom control and if I add that control directly to an ASPX file and request it directly the problem does not happen.

This is the code from our ASCX control:

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="WsiEventCalendar.ascx.cs" Inherits="STAFF.PageTemplates.WsiEventCalendar" %>

<%@ Register TagPrefix="scheduler" TagName="AdvancedForm" Src="AdvancedForm.ascx" %>

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

<asp:Panel ID="pnlError" runat="server" Visible="false">

Event not found.

</asp:Panel>

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

<Scripts>

<asp:ScriptReference Path="AdvancedForm.js" />

<%--Needed for JavaScript IntelliSense in VS2010--%>

<%--For VS2008 replace RadScriptManager with ScriptManager--%>

<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>

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

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="RadScheduler1">

<UpdatedControls>

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

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

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

<script type="text/javascript">

//<![CDATA[

// Dictionary containing the advanced template client object

// for a given RadScheduler instance (the control ID is used as key).

var schedulerTemplates = {};

function schedulerFormCreated(scheduler, eventArgs) {

// Create a client-side object only for the advanced templates

var mode = eventArgs.get_mode();

if (mode == Telerik.Web.UI.SchedulerFormMode.AdvancedInsert ||

mode == Telerik.Web.UI.SchedulerFormMode.AdvancedEdit) {

// Initialize the client-side object for the advanced form

var formElement = eventArgs.get_formElement();

var templateKey = scheduler.get_id() + "_" + mode;

var advancedTemplate = schedulerTemplates[templateKey];

if (!advancedTemplate) {

// Initialize the template for this RadScheduler instance

// and cache it in the schedulerTemplates dictionary

var schedulerElement = scheduler.get_element();

var isModal = scheduler.get_advancedFormSettings().modal;

advancedTemplate = new window.SchedulerAdvancedTemplate(schedulerElement, formElement, isModal);

advancedTemplate.initialize();

schedulerTemplates[templateKey] = advancedTemplate;

// Remove the template object from the dictionary on dispose.

scheduler.add_disposing(function () {

schedulerTemplates[templateKey] = null;

});

}

// Are we using Web Service data binding?

if (!scheduler.get_webServiceSettings().get_isEmpty()) {

// Populate the form with the appointment data

var apt = eventArgs.get_appointment();

var isInsert = mode == Telerik.Web.UI.SchedulerFormMode.AdvancedInsert;

advancedTemplate.populate(apt, isInsert);

}

//]]>

</script>

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

<script type="text/javascript">

function Export(sender, e) {

$find("<%= RadAjaxManager1.ClientID %>").__doPostBack(sender.name, "");

}

</script>

</telerik:RadCodeBlock>

<style type="text/css">

.RadScheduler .rsExportButton

{

position: absolute;

bottom: 0;

right: 0;

border: 0;

height: 24px;

width: 24px;

background: url('/images/icons/Outlook.gif') no-repeat center center;

}

.RadScheduler .rsAllDayRow .rsExportButton

{

right: 20px;

height: 16px;

width: 16px;

background: url('/images/icons/SmallOutlook.gif');

}

</style>

<asp:Panel ID="pnlForm" runat="server">

<telerik:RadScheduler ID="RadScheduler1" runat="server" SelectedView="WeekView"

TimeZoneOffset="00:00:00" DayStartTime="08:00:00" DayEndTime="18:00:00" OnAppointmentCreated="RadScheduler1_AppointmentCreated"

ProviderName="SchedulerData" EnableDescriptionField="True" AppointmentStyleMode="Default" OnAppointmentCommand="RadScheduler1_AppointmentCommand"

OnClientFormCreated="schedulerFormCreated" CustomAttributeNames="AppointmentColor,EventLocation">

<AdvancedForm Modal="true" />

<Reminders Enabled="false" />

<AppointmentTemplate>

<div class="rsAptSubject">

<%# Eval("Subject") %>

</div>

<%# Eval("Description") %>

<div style="text-align: right;">

<asp:Button runat="server" ID="Button1" CssClass="rsExportButton" ToolTip="Export to iCalendar"

CommandName="Export" OnClientClick="Export(this, event); return false;" Style="cursor: pointer;

cursor: hand;" />

</div>

</AppointmentTemplate>

<AdvancedEditTemplate>

<scheduler:AdvancedForm runat="server" ID="AdvancedEditForm1" Mode="Edit" Subject='<%# Bind("Subject") %>'

Description='<%# Bind("Description") %>' Start='<%# Bind("Start") %>' End='<%# Bind("End") %>'

RecurrenceRuleText='<%# Bind("RecurrenceRule") %>' EventLocation='<%# Bind("EventLocation") %>'

AppointmentColor='<%# Bind("AppointmentColor") %>' AudienceID='<%# Bind("Audience") %>'

CategoryID='<%# Bind("Category") %>' />

</AdvancedEditTemplate>

<AdvancedInsertTemplate>

<scheduler:AdvancedForm runat="server" ID="AdvancedInsertForm1" Mode="Insert" Subject='<%# Bind("Subject") %>'

Start='<%# Bind("Start") %>' End='<%# Bind("End") %>' Description='<%# Bind("Description") %>'

RecurrenceRuleText='<%# Bind("RecurrenceRule") %>' EventLocation='<%# Bind("EventLocation") %>'

AppointmentColor='<%# Bind("AppointmentColor") %>' AudienceID='<%# Bind("Audience") %>'

CategoryID='<%# Bind("Category") %>' />

</AdvancedInsertTemplate>

<TimelineView UserSelectable="false" />

<TimeSlotContextMenuSettings EnableDefault="true" />

<AppointmentContextMenuSettings EnableDefault="true" />

</telerik:RadScheduler>

</asp:Panel>

And the code behind:

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using Telerik.Web.UI;

using System.Text;

using SharedDataAccess;

namespace STAFF.PageTemplates

{

public partial class WsiEventCalendar : System.Web.UI.UserControl

{

protected void Page_Load(object sender, EventArgs e)

{

}

protected void RadScheduler1_AppointmentCreated(object sender, AppointmentCreatedEventArgs e)

{

e.Appointment.ToolTip = e.Appointment.Subject + ": " + e.Appointment.Description;

//showing the recurring icons

if (e.Appointment.RecurrenceState == RecurrenceState.Master || e.Appointment.RecurrenceState == RecurrenceState.Occurrence)

{

Panel recurrenceStateDiv = new Panel();

recurrenceStateDiv.CssClass = "rsAptRecurrence";

e.Container.Controls.AddAt(0, recurrenceStateDiv);

}

if (e.Appointment.RecurrenceState == RecurrenceState.Exception)

{

Panel recurrenceStateDiv = new Panel();

recurrenceStateDiv.CssClass = "rsAptRecurrenceException";

e.Container.Controls.AddAt(0, recurrenceStateDiv);

}

protected void RadScheduler1_AppointmentCommand(object sender, AppointmentCommandEventArgs e)

{

if (e.CommandName == "Export")

{

WriteCalendar(RadScheduler.ExportToICalendar(e.Container.Appointment));

}

private void WriteCalendar(string data)

{

HttpResponse response = Page.Response;

response.Clear();

response.Buffer = true;

response.ContentType = "text/calendar";

response.ContentEncoding = Encoding.UTF8;

response.Charset = "utf-8";

response.AddHeader("Content-Disposition", "attachment;filename=\"WsiEventExport.ics\"");

response.Write(data);

response.End();

}

Any idea why this problem is happening only in these circumstances?

Ajax

answered on 27 Mar 2012

1 answer

144 views

How to Control Dock floating position

Hi,

I am facing Dock floating issue in my project. I implemented telerik Raddock control under RadZone. Whenever i will drag the Dock to outside the Zone and leave same place then the Dock position has same where i left the Dock.

I want to force it so that items can never be floating windows. They should always be docked.

We should be able to move them between docks, but if you drop it out of a dock zone, it should return back to it's previous position automatically.

I don't want ,the position of Dock can fix where i left the Dock. I want when i leave the Dock outside the Zone ,it should come to the same Zone or it will fix on particular zone which is nearer or wherever i am dropping in zone only.
This issue ,i am reporting because when i am leaving the Dock in different position then its not saving the particular Dock position in my database.
I attached screenshot for reference.

Please help me for this issue.

Thanks,
Rajesh

Dock

answered on 27 Mar 2012

0 answers

141 views

remove vertical scroll in internet explorer

I would like to remove the vertical scroll and preserve the landscape for the telerik radgrid of internet explorer 9 I have tried all ways but I can not always generate a vertical scroll when doing so does horinzontal scroll on page

this makes IE compatibility mode

in a first image is as it comes by default the grid in this case when you start the grid do not want to scroll vertically and therefore selected the seguna when a row is activated scrolling but both the grid such as the page

Grid

asked on 27 Mar 2012

5 answers

1.6K+ views

[Solved] Always show vertical scrollbar (and no horizontal scrollbar)

Hi,

I'm using the following grid:

    
            <telerik:RadGrid 
        
                Width="350px" 
        
                Height="527px"> 
        
                <MasterTableView  
        
                    TableLayout="Fixed"> 
        
                    <Columns> 
        
                        <telerik:GridTemplateColumn> 
        
                            <HeaderStyle Width="257px" /> 
        
                        </telerik:GridTemplateColumn> 
        
                        <telerik:GridBoundColumn> 
        
                            <HeaderStyle Width="65px" /> 
        
                        </telerik:GridBoundColumn> 
        
                    </columns> 
        
                </MasterTableView> 
        
                <ClientSettings> 
        
                    <Scrolling AllowScroll="True" ScrollHeight="475px" UseStaticHeaders="true" SaveScrollPosition="True"></Scrolling> 
        
                </ClientSettings> 
        
            </telerik:RadGrid>

(showing only parts related to sizing and scrolling).

This code gives me the following result (table in red) :
   - when there are not enough items in the grid to require scrolling: screenshot
   - when there are enough items in the grid to allow scrolling: screenshot

I would like to have a vertical scrollbar on the right of this grid without having a horizontal one.

- If I set Width="100%" to my MasterTableView, then the 2 columns take all the table's width, which is nice when there's not enough items in the grid to allow scrolling. As soon as scrolling is needed, the vertical scrollbar shows up (at the correct location, i.e. "inside" the grid, so the grid width is still 350px - that's all the space I have). But because the vertical scrollbar takes like 15 (?) pixels in width, there's not enough space anymore for my 2 columns and this results in a horizontal scrollbar showing up.

- I would like either:
    a) have the vertical scrollbar ONLY shows up (no horizontal). In that case, I can hardly imagine how it would manage displaying my 2 columns with a correct width in both cases where scrolling is needed or not needed.
    b) have the vertical scrollbar ONLY always shown. In that case, my 2 columns width is the same whereas we need scrolling or not, only the scrollbar would get enabled or disabled. This is what I'm looking for.

Is it possible to achieve this?

Thanks
Nicolas

Grid

answered on 27 Mar 2012