Questions on UI for ASP.NET AJAX Forum

2 answers

126 views

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

315 views

[Solved] 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

213 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

101 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

93 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

105 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

467 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

3 answers

225 views

for each loop to display a treeview

I'm pretty new at this so I don't know much about how to use this or the proper way to call things so I apologize if I don't explain it very well.
Use this picture for reference: http://i178.photobucket.com/albums/w270/marcoshid/Other/Ethernet_View.jpg

I'm trying to make a treeview that will display the nodes '01', '02', etc one right under the other without the black node that is currently above the '02' node. Here is my code for it:

Eth_Rel ethernet_1 = new Eth_Rel();

protected void Ethernet_Load(object sender, EventArgs e)

{

RadTreeNode aParent = new RadTreeNode();

aParent.Text = "Ethernet Connection";

using (MapTest.Model.Computer_InventoryEntities context = new Computer_InventoryEntities())

{

int _roomID = 10;

var list = (from c in context.Eth_Rel where c.rm_id == _roomID select c).ToList();

string temp=null;

int id=999999;

// string etherName = null;

foreach ( Eth_Rel eth in list)

{

RadTreeNode ethernet = new RadTreeNode();

RadTreeNode ethernet1 = new RadTreeNode();

RadTreeNode panel = new RadTreeNode();

RadTreeNode panel1 = new RadTreeNode();

if ((temp != eth.SocketReference.Value.sck_pnl))

{

ethernet.Text = eth.Room.rm_code + " - " + eth.SocketReference.Value.sck_pnl;

panel.Text = "0" + eth.pnl_id.ToString();

RadTreeNode speed = new RadTreeNode();

speed.Text = "Speed: " + eth.SpeedReference.Value.spd_type;

panel.Nodes.Add(speed);

RadTreeNode connects = new RadTreeNode();

connects.Text = "Connects to: " + eth.ComputerReference.Value.comp_name;

panel.Nodes.Add(connects);

RadTreeNode location = new RadTreeNode();

location.Text = "Location: " + eth.LocationReference.Value.loc_name;

panel.Nodes.Add(location);

}

if ((temp == eth.SocketReference.Value.sck_pnl && id != eth.pnl_id))

{

panel1.Text = "0" + eth.pnl_id.ToString();

RadTreeNode speed = new RadTreeNode();

speed.Text = "Speed: " + eth.SpeedReference.Value.spd_type;

panel1.Nodes.Add(speed);

RadTreeNode connects = new RadTreeNode();

connects.Text = "Connects to: " + eth.ComputerReference.Value.comp_name;

panel1.Nodes.Add(connects);

RadTreeNode location = new RadTreeNode();

location.Text = "Location: " + eth.LocationReference.Value.loc_name;

panel1.Nodes.Add(location);

}

else

{

}

ethernet.Nodes.Add(panel);

aParent.Nodes.Add(ethernet);

ethernet.Nodes.Add(panel1);

aParent.Nodes.Add(ethernet);

temp = eth.SocketReference.Value.sck_pnl;

id = eth.pnl_id;

}

RadTreeView3.Nodes.Add(aParent);

Thanks for the help in advance,
Marcos H.

TreeView

answered on 28 Mar 2011

4 answers

396 views

RadGrid display issue in Google Chrome

Hi All,

Have two RadDatePicker and a RadGrid, which works fine.

Have to enter the Start Date and End Date, and click the Tick button.

while the Tick button is clicked the RadGrid displays with Datas.

Works fine in FireFox and IE

But in Google Chrome RadGrid is not displayed. The cursor points to the Start Date.

Have attached the screen shot.

Is there any option to rectify this

Thanking You

-Anto

Grid

answered on 28 Mar 2011

4 answers

107 views

RadScriptManager Naviagte event with historypoint enabled

I am using ReadScriptManager and RadAjaxManager with Navigate event for the back and forward button browser where I add the historypoint within the method that fire the event.
RadScriptManager.AddHistoryPoint("","");

it works fine locally but once I moved the application to development web server. it generates error where the history points are not configured and returned empty values
the navigate event fires but the history state e.State["mid"] is empty with no value.

Now is there any IE requirements for navigate event? Do I have to restart IIS? ...Etc

I appreciate your help

Ajax

answered on 28 Mar 2011