| <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication2._Default" %> |
| <%@ 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 runat="server"> |
| <title>Untitled Page</title> |
| <link rel="Stylesheet" type="text/css" href="../Skins/Office2007/ComboBox.Office2007.css" /> |
| </head> |
| <body> |
| <form id="form1" runat="server"> |
| <asp:ScriptManager ID="ScriptManager1" runat="server" /> |
| <telerik:RadSplitter ID="RadSplitter1" runat="server" Height="100%" Width="100%" |
| VisibleDuringInit="false"> |
| <telerik:RadPane ID="RadPane1" runat="server"> |
| <telerik:RadComboBox ID="RadComboBox1" runat="server" Enabled="false" Skin="Office2007" |
| EnableEmbeddedBaseStylesheet="false" EnableEmbeddedSkins="false"> |
| <Items> |
| <telerik:RadComboBoxItem runat="server" Text="1" Value="1" /> |
| <telerik:RadComboBoxItem runat="server" Text="2" Value="2" /> |
| <telerik:RadComboBoxItem runat="server" Text="3" Value="3" /> |
| </Items> |
| </telerik:RadComboBox> |
| </telerik:RadPane> |
| </telerik:RadSplitter> |
| </form> |
| </body> |
| </html> |

<
asp:Content ID="Content3" ContentPlaceHolderID="ContentPlaceHolder2" Runat="Server">
<table class="style11">
<tr>
<td class="style12" valign="top">
<asp:Label ID="Label3" runat="server" Font-Names="Calibri" Font-Size="Medium"
Text="Select State:"></asp:Label>
</td>
<td class="style13">
<telerik:RadComboBox ID="RadComboBox1" Runat="server" width= "186px"
OnClientSelectedIndexChanging="LoadStates"
OnItemsRequested="RadComboBox1_ItemsRequested"
Skin="Sunset" Height="19px" EnableLoadOnDemand="False">
</telerik:RadComboBox>
</td>
<td class="style14" valign="top">
<asp:Label ID="Label4" runat="server" Font-Names="Calibri" Font-Size="Medium"
Text="Select Site:"></asp:Label>
</td>
<td valign="top">
<telerik:RadComboBox ID="RadComboBox2" Runat="server"
Width="186px"
OnClientSelectedIndexChanging="LoadProperties"
OnClientItemsRequested="ItemsLoaded"
OnItemsRequested="RadComboBox2_ItemsRequested" Height="19px"
Skin="Sunset" >
</telerik:RadComboBox>
</td>
</tr>
<tr>
<td class="style12">
</td>
<td colspan="3">
</td>
</tr>
</table>
<script type="text/javascript">
//global variables for the Properties combobox
var propertiesCombo;
function pageLoad() {
// initialize the global variables
// in this event all client objects
// are already created and initialized
propertiesCombo = $find(
"<%= RadComboBox2.ClientID %>");
}
function LoadProperties(combo, eventArqs) {
var item = eventArqs.get_item();
propertiesCombo.set_text(
"Loading...");
// if a continent is selected
if (item.get_index() > 0) {
// this will fire the ItemsRequested event of the
// properties combobox passing the State as a parameter
propertiesCombo.requestItems(item.get_value(),
false);
}
else {
// the -Select a continent- item was chosen
propertiesCombo.set_text(
" ");
propertiesCombo.clearItems();
}
}
function ItemsLoaded(combo, eventArqs) {
propertiesCombo = $find(
"<%= RadComboBox2.ClientID %>");
if (combo.get_items().get_count() > 0) {
// pre-select the first item
combo.set_text(combo.get_items().getItem(0).get_text());
combo.get_items().getItem(0).highlight();
}
combo.showDropDown();
}
</script>
</asp:Content>
C# Code
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
//fill the continents combo
LoadStates();
}
}
protected void LoadStates()
{
string path = Server.MapPath("~/App_Data/xxx.mdb");
OleDbConnection dbCon = new OleDbConnection("Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" + path);
dbCon.Open();
OleDbDataAdapter adapter = new OleDbDataAdapter("SELECT State, PropertyNumber FROM tblSiteInfo ORDER By PropertyNumber", dbCon);
DataTable dt = new DataTable();
adapter.Fill(dt);
dbCon.Close();
RadComboBox1.DataTextField =
"State";
RadComboBox1.DataValueField =
"State";
RadComboBox1.DataSource = dt;
RadComboBox1.DataBind();
//insert the first item
RadComboBox1.Items.Insert(0,
new RadComboBoxItem("- Select a state -"));
foreach (RadComboBoxItem item in RadComboBox1.Items)
{
item.ToolTip = item.Text;
}
}
protected void LoadProperties(string State)
{
string path = Server.MapPath("~/App_Data/xxx.mdb");
OleDbConnection dbCon = new OleDbConnection("Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" + path);
dbCon.Open();
//select a Property number based on the state
OleDbDataAdapter adapter = new OleDbDataAdapter("SELECT State, PropertyNumber FROM tblSiteInfo WHERE State=@State ORDER By PropertNumber", dbCon);
adapter.SelectCommand.Parameters.AddWithValue(
"@State", State);
DataTable dt = new DataTable();
adapter.Fill(dt);
dbCon.Close();
RadComboBox2.DataTextField =
"PropertyNumber";
RadComboBox2.DataValueField =
"PropertyNumber";
RadComboBox2.DataSource = dt;
RadComboBox2.DataBind();
foreach (RadComboBoxItem item in RadComboBox2.Items)
{
item.ToolTip = item.Text;
}
}
protected void RadComboBox1_ItemsRequested(object o, RadComboBoxItemsRequestedEventArgs e)
{
LoadStates();
}
protected void RadComboBox2_ItemsRequested(object o, RadComboBoxItemsRequestedEventArgs e)
{
// e.Text is the first parameter of the requestItems method
// invoked in LoadCountries method
LoadProperties(e.Text);
}
}

Below are my code and css..It want to center by menu , but i can't do so?
I have looked over telerik forum..so far none of then worked?
thanks,]
DIP
<
div style="width:90%;margin-left:auto;margin-right:auto;height:auto;text-align:center !important;">
<telerik:RadMenu ID="RadMenu1" runat="server" EnableEmbeddedSkins="false"
Skin="Dip" EnableViewState="False">
<
CollapseAnimation Type="OutQuint" Duration="200"></CollapseAnimation>
</telerik:RadMenu>
</div>
.RadMenu_Dip
{
/*margin-left:40px;*/
margin-top:8px;
}
.RadMenu_Dip_Context
{
background: none;
border:0;
}
.RadMenu_Dip
.rmLink
{
text-decoration: none;
color: #fff;
background: transparent;
}
.RadMenu_Dip
.rmLink:hover,
.RadMenu_Dip
.rmFocused,
.RadMenu_Dip
.rmExpanded
{
color: #006;
background: transparent url(Image/Menu/MainItemBackgroundHover.gif) no-repeat center;
}
.RadMenu_Dip
.rmText
{
font: bold 10px Arial, Verdana;
line-height: 20px;
background-image:none;
}
.RadMenu_Dip
.rmRootGroup .rmText .rmLeftImage
{
margin: 3px 1px 0; /* should be adjusted to the size of the images, if they are larger than 16x16px */
}
.RadMenu_Dip
.rmHorizontal .rmExpandBottom,
.RadMenu_Dip
.rmHorizontal .rmExpandTop
{
background: transparent url(Image/Menu/RootGroupArrowDown.gif) no-repeat right center;
}
.RadMenu_Dip
.rmVertical .rmExpandLeft,
.RadMenu_Dip
.rmVertical .rmExpandRight
{
background: transparent url(Image/Menu/invertedGroupImage.gif) no-repeat right center;
}
.RadMenu_Dip
.rmSlide
{
margin-top:-1px;
}
.RadMenu_Dip
.rmGroup
{
border: solid 1px #6788be;
background: white;
}
.RadMenu_Dip
.rmGroup .rmLink
{
background: url(Image/Menu/MenuItemBackground.gif);
border: 0px;
font-size: 10px;
color: #FFF;
}
.RadMenu_Dip
.rmGroup .rmText
{
font-weight: bold !important;
color:#FFF;
text-align: center !important;
/*margin-right: 0 !important;*/
padding-left: 30px;
padding-right: 40px;
font-size: 10px;
}
.RadMenu_Dip
.rmGroup .rmLink:hover,
.RadMenu_Dip
.rmGroup .rmFocused,
.RadMenu_Dip
.rmGroup .rmExpanded
{
color:#000066;
background: url(Image/Menu/MainItemBackgroundHover.gif);
border: 0px;
}
.RadMenu_Dip
.rmLeftArrow,
.RadMenu_Dip
.rmRightArrow,
.RadMenu_Dip
.rmTopArrow,
.RadMenu_Dip
.rmBottomArrow,
.RadMenu_Dip
.rmLeftArrowDisabled,
.RadMenu_Dip
.rmRightArrowDisabled,
.RadMenu_Dip
.rmTopArrowDisabled,
.RadMenu_Dip
.rmBottomArrowDisabled
{
background: #e7f1ff url(Image/Menu/left.gif) center center no-repeat;
width: 15px;
text-decoration:none;
text-indent:-3000px;
color:#e7f1ff;
overflow:hidden;
}
.RadMenu_Dip
.rmTopArrow,
.RadMenu_Dip
.rmTopArrowDisabled
{
background-image: url(Image/Menu/top.gif);
width: 100%;
height: 15px;
}
.RadMenu_Dip
.rmBottomArrow,
.RadMenu_Dip
.rmBottomArrowDisabled
{
background-image:url(Image/Menu/bottom.gif);
width: 100%;
height: 15px;
}
.RadMenu_Dip
.rmRightArrow,
.RadMenu_Dip
.rmLeftArrow
{
height: 100%;
}
.RadMenu_Dip
.rmRightArrow,
.RadMenu_Dip
.rmRightArrowDisabled
{
background-image: url(Image/Menu/right.gif);
}
.RadMenu_Dip
.rmExpandLeft,
.RadMenu_Dip
.rmExpandRight,
.RadMenu_Dip
.rmFocused .rmExpandLeft,
.RadMenu_Dip
.rmFocused .rmExpandRight,
.RadMenu_Dip
.rmExpanded .rmExpandLeft,
.RadMenu_Dip
.rmExpanded .rmExpandRight
{
background: transparent url(Image/Menu/invertedGroupImage.gif) right center no-repeat;
}
.RadMenu_Dip
.rmGroup .rmExpandLeft,
.RadMenu_Dip
.rmGroup .rmExpandRight,
.RadMenu_Dip
.rmGroup .rmFocused .rmExpandLeft,
.RadMenu_Dip
.rmGroup .rmFocused .rmExpandRight,
.RadMenu_Dip
.rmGroup .rmExpanded .rmExpandLeft,
.RadMenu_Dip
.rmGroup .rmExpanded .rmExpandRight
{
background: transparent url(Image/Menu/groupImage.gif) right center no-repeat;
}