Questions on UI for ASP.NET AJAX Forum

5 answers

121 views

RadFormDecorator hides CheckBox in templated RadComboBox

I have a page that has a RadFormDecorator on it which is decorating CheckBoxes. I also have a RadComboBox on the page where I am putting CheckBoxes in the ItemTemplate. When the page renders the CheckBoxes are not visible. If I turn off the CheckBox decoration in the RadFormDecorator they appear.

    
            <rad:RadFormDecorator ID="RadFormDecorator1" runat="server" DecorationZoneID="BodyContents" DecoratedControls="Buttons, CheckBoxes, RadioButtons" /> 
        
            <rad:RadComboBox ID="rcbTradeStatus" runat="server" DataValueField="pkTradeStatus" DataTextField="sStatusDesc" Width="300px" HighlightTemplatedItems="true" AllowCustomText="true">  
        
                <ItemTemplate> 
        
                    <asp:CheckBox ID="cbTradeStatus" runat="server" TextAlign="Right" Text='<%# Eval("sStatusDesc") %>' />   
        
                </ItemTemplate> 
        
            </rad:RadComboBox>

ComboBox

answered on 20 Jun 2011

1 answer

106 views

Automatic scrolling up when clicking on any row

I am using telerik RadGrid.

Here I am having around thousands of records(rows) in my grid. I have my pagesize of 10 records per page. Now when i am using 'Show all results', all the records are getting populated on single page. So, now I am having vertical scroll bar to scroll down.

Now here the issue is, when I am scrolling down to any record and the selecting that row(say 50th) then my grid is again getting scrolled up to first record. Though that 50th record is selected when i am again scrolling down.

So, is there any option to stop this kind of automatic scrolling up when clicking on any row?

Thanks in advance...

Grid

answered on 20 Jun 2011

1 answer

112 views

IE6/IE7 Datepicker absolute positioning issue

Hi,

I am running into an issue with the Calendar Datepicker control in IE6 and 7 and IE8/9 in compatibility mode, when the controls are drawn dynamically with absolute positioning. The controls drop about 10px down from their intended position sometimes as soon as the screen draws and sometimes when the mouse hovers over the first datapicker control. Below is an example of a test I built to demonstrate this behavior.
Please note the DOCTYPE tag I am using for the page, and that the application is running ASP.Net 4. I am using build 2011.1.413.40 of the Telerik.Web.UI assembly.

Page3.aspx

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="Page3.aspx.vb" Inherits="ASPNET4Test1.Page3" %>

<!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 runat="server">

<title></title>

</head>

<body>

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

<asp:ScriptManager ID="ScriptManager1" runat="server">

</asp:ScriptManager>

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

</telerik:RadAjaxManager>

<div>

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

</asp:Panel>

</div>

</form>

</body>

</html>

Page3.aspx.vb

Imports System.Data

Imports System.Collections.Generic

Imports Telerik.Web.UI

Imports System.Linq

Public Class Page3

Inherits System.Web.UI.Page

Private Sub Panel1_Init(ByVal sender As Object, ByVal e As System.EventArgs) Handles Panel1.Init

Try

Dim _date3 As RadDatePicker = Nothing

Dim oLabel As Label

Dim _cal As RadCalendar = Nothing

Dim _calAdded As Boolean = False

Dim Pnl As System.Web.UI.WebControls.WebControl = Panel1

Dim _posLeft As Integer = 80

Dim _posLabelLeft As Integer = 20

Dim _posTop As Integer

For _tabIndex As Integer = 1 To 3

_posTop = _tabIndex * 20 + 20

If IsNothing(_cal) Then

_cal = New RadCalendar()

_cal.ID = "sharedcalendar"

Pnl.Controls.Add(_cal)

End If

oLabel = New Label

oLabel.Style.Add("position", "absolute")

oLabel.Style.Add("top", String.Format("{0}px", (_posTop).ToString()))

oLabel.Style.Add("left", String.Format("{0}px", (_posLabelLeft).ToString()))

oLabel.Style.Add("width", String.Format("{0}px", (50).ToString()))

oLabel.Style.Add("height", String.Format("{0}px", (22).ToString()))

oLabel.Text = "Field " + _tabIndex.ToString()

oLabel.CssClass = "fls "

oLabel.EnableViewState = True

Pnl.Controls.Add(oLabel)

_date3 = New RadDatePicker()

_date3.ID = "dtp_" + _tabIndex.ToString()

_date3.Width = Unit.Pixel(60 + 15) '+ 10 ' 87

_date3.Height = Unit.Pixel(22 - 5) ' - 13

_date3.TabIndex = _tabIndex

_date3.SharedCalendar = _cal

_date3.Style.Add("position", "absolute")

_date3.Style.Add("top", String.Format("{0}px", (_posTop).ToString()))

_date3.Style.Add("left", String.Format("{0}px", _posLeft.ToString())) ' sCLeft)

_date3.Attributes.Add("fieldid", "fld" + _tabIndex.ToString())

_date3.Attributes.Add("fieldname", "fld" + _tabIndex.ToString())

_date3.Attributes.Add("fieldtype", "date")

_date3.Calendar.EnableNavigationAnimation = True

_date3.Culture = System.Globalization.CultureInfo.CurrentUICulture

_date3.MinDate = CDate("1900-1-1")

_date3.ShowPopupOnFocus = True

_date3.DatePopupButton.Visible = False

_date3.DateInput.EmptyMessage = System.Globalization.CultureInfo.CurrentUICulture.DateTimeFormat.ShortDatePattern.ToUpper()

_date3.DateInput.DateFormat = System.Globalization.CultureInfo.CurrentUICulture.DateTimeFormat.ShortDatePattern

_date3.DateInput.DisplayDateFormat = System.Globalization.CultureInfo.CurrentUICulture.DateTimeFormat.ShortDatePattern

_date3.DateInput.SelectionOnFocus = SelectionOnFocus.SelectAll

_date3.DateInput.ShowButton = False

_date3.DateInput.Width = Unit.Pixel(60)

_date3.DateInput.Height = Unit.Pixel(22 - 5)

Pnl.Controls.Add(_date3)

Next

Catch ex As System.Exception

Trace.Write(String.Format("Failed to draw fields. Exception: {0}", ex.ToString()))

Throw

Finally

Trace.Write("End ---> Panel1_Init")

End Try

End Sub

End Class

Here is an image depicting the behavior I am experiencing this this page.

Thanks
Ali M.

Calendar

answered on 20 Jun 2011

5 answers

221 views

Grid not showing Loading Icon

Hello,

I am using Telerik AJAX Hierarchical Grid. I am using the version of 2010.3.1317.20. I cant upgrade to the latest version as the framework I am using .Net 2.0.

Now the issues is, below is my code. I dont see the Ajax loader and also getting an error saying the two controls cannot have the ID. So I have changed the AjaxControlID in AjaxSettings.

I want to show the busy icon on the grid, either the user do some action on the grid like clicking delete button on any of the row. or adding new rows to the grid or until the grid loads the data.

I am assigning the datasource from the SQL Server database.

My page where i have embedd the telerik grid is inside the contentplaceholder.

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

<ContentTemplate>

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

<asp:Label ID="lblError" runat="server" Font-Bold="true" ForeColor="Red"></asp:Label>

<br />

<div id="Div1" style="z-index: 103; width: 80%; text-align: left" runat="server"

font-size="Large" font-names="Arial" font-bold="True" height="21px">

<div>

<div style="width: 20%; float: left">

<asp:Label ID="lblParentSerialNumber" runat="server">Parent Serial #</asp:Label>

</div>

<div style="width: 80%;">

<asp:TextBox ID="txtParentSerialNumber" runat="server" Width="150px" CausesValidation="false"

AutoPostBack="false" MaxLength="12"></asp:TextBox>

</div>

<div>

<div style="width: 20%; float: left; height: 19px;">

<asp:Label ID="lblSubSerialNumbers" runat="server">Sub Serial #</asp:Label>

</div>

<div style="width: 50%;">

<asp:TextBox ID="txtSubSerialNumbers" runat="server" TextMode="MultiLine" Width="150px"

Height="150px" AutoPostBack="false" CausesValidation="false"></asp:TextBox>

</div>

<div style="float: right">

<asp:Button ID="btnValidate" TabIndex="6" runat="server" Font-Bold="True" Width="130px"

BackColor="DarkKhaki" Text="Validate and Save" CausesValidation="true"></asp:Button>

<%-- <asp:Button ID="btnSave" TabIndex="4" runat="server" Font-Bold="True" Width="70px"

BackColor="Green" Text="Save" Enabled="false" />--%>

<asp:Button ID="btnClear" TabIndex="5" runat="server" Font-Bold="True" Width="70px"

BackColor="Peru" Text="Clear" CausesValidation="false" />

</div>

<br />

<div style="width: 80%; text-align: left">

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

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="RadGrid11">

<UpdatedControls>

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

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

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

Transparency="5">

<img style="border: 0; margin-top: 150px;" alt="Loading..." src="Images/infineralogo.gif" />

</telerik:RadAjaxLoadingPanel>

<telerik:RadGrid ID="RadGrid1" runat="server" Width="95%" ShowStatusBar="true" AutoGenerateColumns="False"

PageSize="10" AllowSorting="True" AllowMultiRowSelection="False" AllowPaging="True"

AlternatingItemStyle-BackColor="Ivory" ItemStyle-BackColor="LightGoldenrodYellow"

HeaderStyle-BackColor="SandyBrown" GridLines="None">

<PagerStyle Mode="NumericPages"></PagerStyle>

<MasterTableView Width="100%" DataKeyNames="ParentSerialNumber" AllowMultiColumnSorting="False">

<DetailTables>

<telerik:GridTableView DataKeyNames="SerialNoAssociateId" Name="SubSerialNumberGrid"

Width="100%" AllowSorting="true">

<Columns>

<telerik:GridBoundColumn SortExpression="SerialNoAssociateId" HeaderText="SerialNoAssociateId"

HeaderButtonType="TextButton" DataField="SerialNoAssociateId" Visible="false">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn SortExpression="ParentSerialNumber" HeaderText="ParentSerialNumber"

HeaderButtonType="TextButton" DataField="ParentSerialNumber" Visible="false">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn SortExpression="SubSerialNumber" HeaderText="Sub Serial Number"

HeaderButtonType="TextButton" DataField="SubSerialNumber">

</telerik:GridBoundColumn>

<telerik:GridButtonColumn HeaderText="Delete" ConfirmTitle="MPT" ConfirmDialogType="Classic"

ButtonType="ImageButton" ConfirmText="Are you sure you want to delete?" ItemStyle-HorizontalAlign="Left"

CommandName="DeleteSubSerial" Text="Delete" ImageUrl="Images/Delete.jpg">

</telerik:GridButtonColumn>

</Columns>

</telerik:GridTableView>

</DetailTables>

<Columns>

<telerik:GridBoundColumn SortExpression="ParentSerialNumber" HeaderText="Parent Serial Number"

HeaderButtonType="TextButton" DataField="ParentSerialNumber">

</telerik:GridBoundColumn>

</Columns>

</MasterTableView>

</telerik:RadGrid>

</div>

<br />

<div style="width: 80%; text-align: left">

<asp:DataGrid ID="dgdErrors" runat="server" AutoGenerateColumns="true" CellSpacing="2"

GridLines="None" Visible="false">

<AlternatingItemStyle BackColor="Ivory"></AlternatingItemStyle>

<ItemStyle BackColor="LightGoldenrodYellow"></ItemStyle>

<HeaderStyle BackColor="SandyBrown"></HeaderStyle>

</asp:DataGrid>

</div>

</asp:Panel>

</ContentTemplate>

</asp:UpdatePanel>

Grid

answered on 20 Jun 2011

3 answers

158 views

Opening a RadWindow from a RadGrid item click?

Hi,

Is it possible to open a RadWindow when I click an item on the RadGrid even by adding a link inside? I did have a solution but it reloads the page and its very sloppy.

The way I did it was that I added the following in my aspx:

<telerik:GridHyperLinkColumn DataTextFormatString="Edit Item"
        avigateUrlFields="country_id" UniqueName="country_id"         DataNavigateUrlFormatString="~/admin/AdmCountries.aspx?edit_id={0}"
                        HeaderText="Edit Item" DataTextField="country_id" >
        </telerik:GridHyperLinkColumn>

then I updated my codebehind's OnPageLoad like this:

    
             string editID = Request.QueryString["edit_id"];

             if (editID != null)

            {

              RadWindowManager1.Windows[0].VisibleOnPageLoad = true;

            } else {

              RadWindowManager1.Windows[0].VisibleOnPageLoad = false;

            }

So essentially reloading the page with the ID parameter and if it is set then the window is displayed. What I would like instead is not to have a postback, rather displaying the window with a given ID, maybe using AJAX.

I am new to this great product and would like to get the hang of it, please help.

Thanks,
Miklos

Window

answered on 20 Jun 2011

1 answer

67 views

Need for a more tight Calendar Cells

Hello,

I need to gain on Space specially in height on a page containing a RadCalendar. I tried to change the height and width properties of the radcalendar component, and i note that its size get invariant below a given threshold values. In the attached document, you can see in the first image the min calendar size i have got , and in the second the size of the calendar that i would like to get ( I want more tight calendar cells). Should i create a new skin. If it is the case, which CSS classes should i redefine?

Thanks & Regards,

Calendar

answered on 20 Jun 2011

3 answers

97 views

Encoding of localized texts

Hi,

I'm having problem with some texts when localizing.
For example when setting the following:
RadEditor.Localization.Tools.Zoom = "<aaa>"

The zoom dropdown disappears (or becomes very small). Seems to be some problem when encoding the text.
If setting the text as html-encoded ("<aaa>"), then the tooltip gets wrong (displays <aaa>).

Regards
Caesar

Editor

answered on 20 Jun 2011

1 answer

145 views

How to use RadAjaxLoadingPanel with programmatically created RadGris?

I have created a RadGrid control programmatically and added it to a placeholder control and at the moment I've placed the placeholder inside a ASP.NET AJAX UpdatePanel to avoid page flashing (the radgrid data gets updated (triggered) by clicking an external button).

I'd like to use RadAjaxLoadingPanel so that user will have a nice experience while the Grid gets updated.

1) How to use RadAjaxLoadingPanel with this scenario?

Do I have to use RadAjaxManager instead of UpdatePanel? if so, how to configure it as my RadGrid is created at runtime.

2)
Also, my RadGrid is using Export to Excel and Word built-in buttons. How would it affect these?

Many thanks,

Grid

answered on 20 Jun 2011

4 answers

413 views

RadGrid with XmlDataSource

Hi,

I am trying to figure this out for past couple of days.

I would like to know how to implement RadGrid with xmldatasource. It's pretty easy to bind it in the front end. But I would like to bind the xml to gridview from serverside. I would like to use XPath and DOM model to select the nodes/attributes from my Xml to be displayed as columns in the Gridview and content accordingly. My Xml looks something similar to this:

<structure>
   <headers>
      <headertext text="Product Name">
      <headertext text="Product ID">
      <headertext text="Product No.">
   </headers>
   <content>
       <row value="Apple">
       <row value="123">
       <row value="354367">  
   </row> 
</row>

I would like to populate HeaderText (Product Name, Product ID .... as column header) from server side using XPath and DOM and rows for each of the columns. Basically, there can be many columns and I have to iterate through each of them and display all column with all data.

Secondly, I am not able to create an instance of XmlDocument to load the xml from the server side, causing couple of errors.

Would be great if someone can help me in this issue.

Thanks.

Grid

answered on 20 Jun 2011

1 answer

164 views

Client side databind ASP.Net RadGrid with Checkbox column

I have a asp.net radgrid with checkcolumn, when i bind the grid from server the checkbox column is binding correctly.

If i bind the grid with client side programmatically, the checkbox column is not checking.

Please let me know how to bind the grid with checkbox column from client side.

Thanks & Regards
D Praveen

Grid

answered on 20 Jun 2011