Questions on UI for ASP.NET AJAX Forum

1 answer

182 views

Combobox expanding UNDER a Modal RadWindow...

I have 2 RadComboboxes inside a Rad Window that opens in Modal form...When I start typing to search/select, the Combo Boxes expand UNDER the Modal window, not on top...I tried changing the Z-Index, but no change. Am I doing something wrong here?(Obviously)

I am using the latest version of the Telerik Ajax controls. It is an ASP.NET 4 Ajax application built using Telerik's Rad Project and this is all in Visual Studio 2010. Below is my HTML for the Rad Window and Comboboxes.

Help?!/Thanks

Mark

<telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" > <telerik:RadWindow ID="radWinAddCredit" runat="server" Modal="true" AutoSize="true" Title="Add/Edit Credit"

<br>                                    Visible="false" VisibleOnPageLoad="True" Skin="WebBlue" Height="300px" ShowContentDuringLoad="False" Width="300px"><

br> <ContentTemplate> <table class="form"> <tr> <td class="formHeader"> Add Credit </td> </tr> <tr> <td class="formLabel" align="left"> Craft </td> </tr> <tr> <td align="left"> <telerik:RadComboBox ID="cboCrafts" Skin="WebBlue" ZIndex="100" MarkFirstMatch="true" runat="server"> </telerik:RadComboBox> </td> </tr> <tr> <td class="formLabel" align="left"> Title </td> </tr> <tr> <td align="left"> <telerik:RadComboBox ID="cboShowTitles" Skin="WebBlue" ZIndex="100" EnableAutomaticLoadOnDemand="true" EmptyMessage="Type to Search..." MarkFirstMatch="true" runat="server"> <WebServiceSettings Method="GetShowTitles" Path="../Admin/Controls/AdminService.asmx" /> </telerik:RadComboBox> </td> </tr> <tr> <td class="formLabel" align="left"> Comment </td> </tr> <tr> <td align="left"> <asp:TextBox ID="txtCreditComment" runat="server" Width="195"></asp:TextBox> </td> </tr> <tr> <td align="right"> <asp:Button ID="btnAddCredit" runat="server" OnClick="btnAddCredit_Click" Text="Add" /> <asp:Button ID="btnCancelPopup" runat="server" OnClick="btnCancelPopup_Click" Text="Cancel" /> </td> </tr> </table> </ContentTemplate> </telerik:RadWindow> </telerik:RadAjaxPanel>

ComboBox

answered on 29 Mar 2011

3 answers

127 views

SelectedText change after OnClientBlur

Hi Telerik Team,

RadCombobox selected text have change after selected and click somewhere on page.
I notice that this happening when items are same value. If value are unique this will not happening.

Please test the following code.
If select "ccc" or "ddd" and click somewhere the selected text will change to "aaa"
If select "222" or "333" and click somewhere the selected text will change to "111"

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

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

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<title>Untitled Page</title>

</head>

<body>

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

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

<div>

<telerik:RadComboBox ID="CboPOL" Runat="server">

<Items>

<telerik:RadComboBoxItem runat="server" Text="aaa" Value="First" />

<telerik:RadComboBoxItem runat="server" Text="bbb" Value="First" />

<telerik:RadComboBoxItem runat="server" Text="ccc" Value="First" />

<telerik:RadComboBoxItem runat="server" Text="ddd" Value="First" />

<telerik:RadComboBoxItem runat="server" Text="eee" Value="First" />

<telerik:RadComboBoxItem runat="server" Text="111" Value="Second" />

<telerik:RadComboBoxItem runat="server" Text="222" Value="Second" />

<telerik:RadComboBoxItem runat="server" Text="333" Value="Second" />

<telerik:RadComboBoxItem runat="server" Text="abc" Value="third" />

<telerik:RadComboBoxItem runat="server" Text="hij" Value="forth" />

</Items>

</telerik:RadComboBox>

</div>

</form>

</body>

</html>

ComboBox

answered on 29 Mar 2011

14 answers

529 views

Upload MaxUploadSize

My web application has a Max Request Length of 20 MB

I set Configuration.MaxUploadFileSize on my RadFileExplorer to 10 MB from the code-behind.

The control successfully catches files between 10 MB and 20 MB. However, any files more than 20 MB cause ASP.NET to throw an exception.

FileExplorer

answered on 28 Mar 2011

2 answers

111 views

Icons on Appointments

Hi,
Can someone tell me what the icons in the top left mean? They look like a broken refresh icon or something...
[IMG]http://i.imgur.com/I5fzV.png[/IMG]

Scheduler

answered on 28 Mar 2011

1 answer

263 views

RadComboBox arrow cell size changes when AllowCustomText option set

Hi All,

I have a custom skin for my RadComboBox and wondered if any of you out there could explain to me why the arrow 'box' on the right of the control changes width if I set the "AllowCustomeText" option to true?

I have attached the exact code I'm using to create the issue along with my custom skin. It is worth noting that this custom skin was generated with the Beta version of Teleriks's StyleBuilder ( http://stylebuilder.telerik.com ) . Of course because this is in Beta it's not guaranteed to generate skins with out teething problems and I understand that. That said I'm using Teleriks icon png file.

I've also attached a blown up image of the controls sat on my page and highlighted the difference in width between them. The only difference between the setup of these controls is that the top on has AllowCustomText="True" whereas the bottom one doesn't have the option set at all.

To configure a test page, save my skin, reference it in a new asp.net web page, copy my code in and start debugging.

Relevant ASP.Net mark up:

<telerik:RadComboBox

id="Test15"

runat="server"

width="200px"

height="100px"

DropDownWidth="200px"

AllowCustomText="true"

EmptyMessage="Select an option..."

Skin="Probitas"

EnableEmbeddedSkins="false"

onClientDropDownClosing="AlignDropDownCaretLeft"

>

<Items>

<telerik:RadComboBoxItem Text="Short option" Value="1" />

<telerik:RadComboBoxItem Text="AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPpQqRrSsTtUuVvWwXxYyZz1234567890" Value="2" />

<telerik:RadComboBoxItem Text="aAbBcCdDeEfFgGhHiIjJkKlLmMnNoOpPqQrRsStTuUvVwWxXyYzZ0123456789" Value="3" />

<telerik:RadComboBoxItem Text="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz9876543210" Value="4" />

<telerik:RadComboBoxItem Text="abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ9876543210" Value="5" />

</Items>

</telerik:RadComboBox><br />

<br />

<telerik:RadComboBox

id="Test16"

runat="server"

width="200px"

height="100px"

DropDownWidth="200px"

AllowCustomText="false"

EmptyMessage="Select an option..."

Skin="Probitas"

EnableEmbeddedSkins="false"

onClientDropDownClosing="AlignDropDownCaretLeft"

>

<Items>

<telerik:RadComboBoxItem Text="Short option" Value="1" />

<telerik:RadComboBoxItem Text="AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPpQqRrSsTtUuVvWwXxYyZz1234567890" Value="2" />

<telerik:RadComboBoxItem Text="aAbBcCdDeEfFgGhHiIjJkKlLmMnNoOpPqQrRsStTuUvVwWxXyYzZ0123456789" Value="3" />

<telerik:RadComboBoxItem Text="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz9876543210" Value="4" />

<telerik:RadComboBoxItem Text="abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ9876543210" Value="5" />

</Items>

</telerik:RadComboBox><br />

StyleSheet (ComboBox.Probitas.Css):

/* RadComboBox Simple skin */

/*global*/

.RadComboBox_Probitas,

.RadComboBox_Probitas .rcbInput,

.RadComboBoxDropDown_Probitas

{

font: 12px "Segoe UI", Arial, sans-serif;

color: #333;

}

/* combobox */

div.RadComboBox_Probitas table td.rcbInputCell

{

height: 18px;

line-height: 18px;

border: 1px solid #10568A;

background: #fff;

}

* html div.RadComboBox_Probitas table td.rcbInputCell

{

height /**/: 20px;

line-height /**/: 20px;

}

div.RadComboBox_Probitas table td.rcbInputCellLeft { border-width: 1px 0 1px 1px; }

div.RadComboBox_Probitas table td.rcbInputCellRight { border-width: 1px 1px 1px 0; }

* html div.RadComboBox_Probitas .rcbInputCell .rcbInput

{

height /**/: 16px;

padding /**/: 2px 0; /* This should fix the ajax introduced height in IE7 and not break IE6 */

}

.RadComboBox_Probitas .rcbInputCell .rcbEmptyMessage

{

color: #666;

}

.RadComboBox_Probitas .rcbHovered .rcbInputCell .rcbInput,

.RadComboBox_Probitas .rcbFocused .rcbInputCell .rcbInput { color: #333333; }

div.RadComboBox_Probitas table td.rcbArrowCell

{

border: 1px solid #10568A;

background: #fff url('ComboBox/rcbSprite.png') no-repeat -1px 50%;

}

div.RadComboBox_Probitas .rcbReadOnly .rcbArrowCellLeft,

div.RadComboBox_Probitas .rcbArrowCellHidden.rcbArrowCellLeft { border-width: 1px 1px 1px 1px; }

div.RadComboBox_Probitas .rcbReadOnly .rcbArrowCellRight,

div.RadComboBox_Probitas .rcbArrowCellHidden.rcbArrowCellRight { border-width: 1px 1px 1px 1px; }

.RadComboBox_Probitas td.rcbArrowCell { background-position: -1px 50%; }

.RadComboBox_Probitas .rcbHovered .rcbArrowCell { background-position: -21px 50%; }

.RadComboBox_Probitas .rcbFocused .rcbArrowCell { background-position: -41px 50%; }

.RadComboBox_Probitas .rcbDisabled .rcbArrowCell { background-position: -61px 50%; }

.RadComboBox_Probitas .rcbReadOnly td.rcbArrowCell { background-position: -2px 50%; }

.RadComboBox_Probitas .rcbHovered .rcbReadOnly .rcbArrowCell { background-position: -22px 50%; }

.RadComboBox_Probitas .rcbFocused .rcbReadOnly .rcbArrowCell { background-position: -42px 50%; }

.RadComboBox_Probitas .rcbDisabled .rcbReadOnly .rcbArrowCell { background-position: -62px 50%; }

.RadComboBox_Probitas td.rcbArrowCellHidden,

.RadComboBox_Probitas .rcbHovered td.rcbArrowCellHidden,

.RadComboBox_Probitas .rcbFocused td.rcbArrowCellHidden,

.RadComboBox_Probitas .rcbReadOnly td.rcbArrowCellHidden,

.RadComboBox_Probitas .rcbHovered .rcbReadOnly .rcbArrowCellHidden,

.RadComboBox_Probitas .rcbFocused .rcbReadOnly .rcbArrowCellHidden,

.RadComboBox_Probitas .rcbDisabled .rcbReadOnly .rcbArrowCellHidden,

.RadComboBox_Probitas table.rcbDisabled td.rcbArrowCellHidden

{

/*background: #none; */

background: #ffffff;

}

.RadComboBox_Probitas .rcbHovered .rcbArrowCell,

.RadComboBox_Probitas .rcbHovered .rcbReadOnly .rcbInputCell,

.RadComboBox_Probitas .rcbHovered .rcbReadOnly .rcbArrowCellHidden { background-color: #ffffff; }

.RadComboBox_Probitas .rcbFocused .rcbArrowCell,

.RadComboBox_Probitas .rcbFocused .rcbReadOnly .rcbInputCell,

.RadComboBox_Probitas .rcbFocused .rcbReadOnly .rcbArrowCellHidden { background-color: #ffffff; }

div.RadComboBox_Probitas .rcbHovered .rcbArrowCell,

div.RadComboBox_Probitas .rcbHovered .rcbInputCell { border-color: #10568A; }

div.RadComboBox_Probitas .rcbFocused .rcbArrowCell,

div.RadComboBox_Probitas .rcbFocused .rcbInputCell { border-color: #10568A; }

div.RadComboBox_Probitas .rcbDisabled .rcbArrowCell,

div.RadComboBox_Probitas .rcbDisabled .rcbInputCell { border-color: #10568A; }

div.RadComboBox_Probitas .rcbArrowCell a

{

height: 20px;

}

div.RadComboBox_Probitas td.rcbArrowCellHidden,

div.RadComboBox_Probitas .rcbArrowCellHidden a

{

width: 1px;

}

div.RadComboBox_Probitas td.rcbArrowCellHidden.rcbArrowCellRight

{

border-left: 1px solid #10568A;

}

/* Read-only styles */

/* dropdown */

.RadComboBoxDropDown_Probitas

{

background: #fff;

border-color: #10568A;

}

.RadComboBoxDropDown_Probitas .rcbHeader,

.RadComboBoxDropDown_Probitas .rcbFooter

{

background: #e4e4e4;

color: #000;

}

.RadComboBoxDropDown_Probitas .rcbHeader

{

border-bottom-color: #10568A;

}

.RadComboBoxDropDown_Probitas .rcbFooter

{

border-top-color: #10568A;

}

.RadComboBoxDropDown_Probitas .rcbItem em

{

background: #ffffff;

}

div.RadComboBoxDropDown_Probitas .rcbHovered

{

background: #ffffff;

color: #ffffff;

border: 1px solid #10568A;

padding: 1px 5px;

}

.RadComboBoxDropDown_Probitas .rcbSeparator

{

color: #fff;

background: #8a8a8a;

}

.RadComboBox_Probitas .rcbDisabled .rcbInputCell .rcbInput,

.RadComboBoxDropDown_Probitas .rcbDisabled

{

color: #888888;

}

.RadComboBoxDropDown_Probitas .rcbLoading

{

background: #ffffff;

}

.RadComboBoxDropDown_Probitas .rcbMoreResults

{

border-top-color: #10568A;

background: #ffffff;

color: #333333;

}

.RadComboBoxDropDown_Probitas .rcbMoreResults a

{

background: url('ComboBox/rcbSprite.png') no-repeat -1px -85px;

}

div.RadComboBox_Probitas .rcbInputCell

{

border-color: #10568A;

}

.RadComboBox_Probitas .rcbInput

{

color: #000000;

}

DIV.RadComboBox_Probitas .rcbArrowCell

{

border-color: #10568A;

}

div.RadComboBox_Probitas .rcbHovered .rcbInputCell

{

border-color: #10568A;

}

div.RadComboBox_Probitas .rcbHovered .rcbInput

{

color: #000000;

}

.RadComboBox_Probitas .rcbHovered .rcbArrowCell

{

border-color: #10568A;

background-color: #FFFFFF;

}

div.RadComboBox_Probitas .rcbFocused .rcbInputCell

{

border-color: #10568A;

}

div.RadComboBox_Probitas .rcbFocused .rcbInput

{

color: #000000;

}

div.RadComboBox_Probitas .rcbFocused .rcbArrowCell

{

background-color: #FFFFFF;

}

div.RadComboBox_Probitas .rcbDisabled .rcbInputCell

{

border-color: #888888;

}

div.RadComboBox_Probitas .rcbDisabled .rcbArrowCell

{

border-color: #888888;

}

div.RadComboBoxDropDown_Probitas

{

border-color: #10568A;

}

div.RadComboBoxDropDown_Probitas .rcbHeader

{

background-color: #BCD1E1; /*light blue*/

}

div.RadComboBoxDropDown_Probitas .rcbHovered

{

border: #10568A 1px solid;

background-color: #BCD1E1;

color: #000000;

}

/*General*/

div.RadComboBox_Probitas .rcbInputCell

{

border-color: #10568A;

border-right: #10568A 1px solid;

}

div.RadComboBox_Probitas .rcbArrowCell

{

border-color: #10568A;

}

/*Hovered*/

div.RadComboBox_Probitas .rcbHovered .rcbInputCell

{

border-right: #10568A 1px solid;

}

div.RadComboBox_Probitas .rcbHovered .rcbInput

{

color: #000000;

}

/*Focused*/

div.RadComboBox_Probitas .rcbFocused .rcbInputCell

{

border-right: #10568A 1px solid;

border-color: #10568A;

}

div.RadComboBox_Probitas .rcbFocused .rcbInput

{

color: #000000;

}

/*Disabled*/

div.RadComboBox_Probitas .rcbDisabled .rcbInputCell

{

border-right: #888888 1px solid;

border-color: #888888;

}

div.RadComboBox_Probitas .rcbDisabled .rcbInput

{

color: #888888;

}

div.RadComboBox_Probitas .rcbDisabled .rcbArrowCell

{

border-color: #888888;

color: #888888;

}

div.RadComboBox_Probitas table td.rcbInputCell

{

padding-right: 5px;

padding-left: 0px;

}

ComboBox

answered on 28 Mar 2011

2 answers

189 views

Download "Web Mail" demo?

Is there a way I can download the code for the Telerik Web Mail demo located at http://demos.telerik.com/aspnet-ajax/webmail/? I checked the demo in my local but this one links directly to Telerik site.

General Discussions

answered on 28 Mar 2011

1 answer

84 views

Bugs Client Side Api: findItemByText()

In the client-side api of the (very nice btw!) RibbonBar I found a bug.

<telerik:RadRibbonBar ID="rrbEditor" OnClientButtonClicked="rrbEditor_onClientButtonClicked" OnClientButtonToggled="rrbEditor_onClientButtonClicked" OnClientMenuItemClicked="rrbEditor_onMenuItemClicked">

<telerik:RibbonBarTab Text="Handy">

<telerik:RibbonBarGroup Text="Clipboard">

<Items>

<telerik:RibbonBarMenu Size="Large" Text="Paste" ImageUrl="../../Images/Telerik/icons/editorimages/Paste.png">

</Items>

</telerik:RibbonBarGroup>

</telerik:RibbonBarTab>

<telerik:RibbonBarTab Text="Layout">

<telerik:RibbonBarGroup Text="Font">

<Items>

<telerik:RibbonBarButtonStrip>

<Buttons>

<telerik:RibbonBarToggleButton Size="Small" Text="Bold" ImageUrl="../../Images/Telerik/icons/editorimages/Bold.png" />

</Buttons>

</telerik:RibbonBarButtonStrip>

</Items>

</telerik:RibbonBarGroup>

</telerik:RibbonBarTab>

</telerik:RadRibbonBar>

As you can see, this RibbonBar has two tabs. However when we use the findItemByText() method:

var ribbonBar = $find("<%= rrbEditor.ClientID %>");

var Bold = ribbonBar.findItemByText("Bold");

var Paste = ribbonBar.findItemByText("Paste");

You will find Bold == null while Paste is an item. However if we swap the two tabs (So 'Layout' will be the first tab), now Bold is an item and Paste == null.

So findItemByText() only looks in the first tab.

Hope you can fix this.

RibbonBar

answered on 28 Mar 2011

1 answer

72 views

transfer items between TreeViews

Hi there,

I was able to connect to my hierarchical sql data according to demo
http://demos.telerik.com/aspnet-ajax/treeview/examples/programming/databinding/defaultcs.aspx.

Now I need to transfer the items between two TreeViews, similar to the demo below except for the demo is using ListBoxs:
http://demos.telerik.com/aspnet-ajax/listbox/examples/functionality/transfer/defaultcs.aspx

But I need to keep the hierarchy information during transfer. Say, if the item belongs to group1 in TreeView1, it will also be shown as group1 item in TreeView2 after transfered to TreeView2.

TreeView2 is blank at first, after finished selecting data from TreeView1, I would like to write everything in TreeView2 to database with hierarchy info.

How could I accomplish that?

Thanks,
Di

ListView

answered on 28 Mar 2011

3 answers

73 views

RadWindow opened with <asp:Button> but NOT OPENED with <telerik:RadToolBarbutton>. Why?

Hi all, I have in the same page.aspx a RadToolBar with its RadToolBarButton and a simple <asp:Button>.
In this page I have also a simple RadWindow so defined:

    
            <telerik:RadWindowManager ID="RadWinMngr" runat="server"> 
        
                <Windows> 
        
                    <telerik:RadWindow ID="RadWindowAddUser" runat="server" NavigateUrl="http://www.google.com" VisibleOnPageLoad="true" Visible="false" /> 
        
                </Windows> 
        
            </telerik:RadWindowManager>

In the code behind, for the simple <asp:Button> I have:

    
            Private Sub Button1_click(...) 
        
                RadWindowAddUser.Visible = True 
        
            End Sub

and for the RadToolBarButton I have:

    
            Private Sub AddUser() 
        
                RadWindowAddUser.Visible = True 
        
            End Sub

I'm sure that the AddUser sub is correctly called because I've verified it by debug breakpoint.

The problem is that when I click on <asp:Button> the RadWindowAddUser is shown correctly, but when I click on RadToolBarButto it doesn't!
Why???

Anybody can help me? Thanks.

Giulio Ferri

Window

answered on 28 Mar 2011

5 answers

388 views

Master Page Layout:

Is there any good documentation, how to really do a professional master page layout, Im having alot of trouble.
Im new to telerik and also asp.net.

can you assist me?
what are some good websites with the layout structure, i understand how to add the contentholders, now im trying to
come up to speed on the layout. my layouts are horrible

General Discussions

answered on 28 Mar 2011