Questions on UI for ASP.NET AJAX Forum

1 answer

336 views

Set content between Sticky Header and Footer

Hi, I was able to set sticky header and footer with Pagelayout In Master page. However, the child page do not in between the header and footer.

The child page in the content place holder display in the whole browser with the header and footer appear front of it. Anywhere I could get the child page appear between the sticky header and footer, and the child page will scroll when overflow. Thanks

I'm using Visual studio 2010 with .net framework 4.0.

OS:Windows 7

Browser: IE 10

Telerik version:2015.1.225.40

Preferred programming language: VB.NET

Below are my code for Master page and child page

<%@ Master Language="VB" AutoEventWireup="false" CodeBehind="Responsive.master.vb" Inherits="GMAT.Responsive" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>

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

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

<meta http-equiv="Page-Enter" content="blendTrans(Duration=.5)" />

<meta http-equiv="Page-Exit" content="blendTrans(Duration=.5)" />

<meta name="viewport" content="initial-scale=1.0, minimum-scale=1, maximum-scale=1.0, user-scalable=no" />

<link href="~/Styles/Site.css" rel="stylesheet" type="text/css" />

<link href="~/Styles/jquery-ui/css/cupertino/jquery-ui-1.10.3.custom.min.css" rel="stylesheet" type="text/css" />

<script src="scripts/jquery-1.10.1.min.js" type="text/javascript"></script>

<script src="scripts/jquery-ui/jquery-ui-1.10.3.custom.min.js" type="text/javascript"></script>

<script src="scripts/jquery.sessionTimeout.js" type="text/javascript"></script>

<asp:ContentPlaceHolder ID="head" runat="server">

</asp:ContentPlaceHolder>

<style type="text/css">

.header1 {

background-color: black;

position:fixed;

width:100%;

top:0;

z-index:1000;

}

.header2 {

background-color: #E8EAEC;

}

.header3 {

background: linear-gradient(#FDFEFE, #F0F2F4) repeat scroll 0 0 rgba(0, 0, 0, 0);

}

.content {

}

.article2 {

background-color: #EEF1F3;

}

.footer {

background-color: black;

}

html,

body,

form {

margin: 0;

padding: 0;

height: 100%;

}

.container {

min-height: 100%;

position: relative;

}

.allContent {

padding-top:40px;

padding-bottom: 84px; /* Height of the footer */

}

.footer {

position: fixed;

bottom: 0;

width: 100%;

height: 84px; /* Height of the footer */

background: black;

}

</style>

</head>

<body>

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

<asp:ToolkitScriptManager ID="TSM_CMS_MAIN" runat="server">

</asp:ToolkitScriptManager>

<div>

<telerik:RadPageLayout runat="server" ID="PageLayoutMaster" HtmlTag="None" GridType="Fluid" >

<Rows>

<telerik:LayoutRow RowType="Generic" CssClass="container">

<Rows>

<telerik:LayoutRow RowType="Generic" CssClass="allContent">

<Rows>

<telerik:LayoutRow RowType="Container" WrapperCssClass="header1" WrapperHtmlTag="Div">

<Columns>

<%--Logo--%>

<telerik:LayoutColumn Span="2" SpanMd="3" SpanSm="12" SpanXs="12">

<a href="#" class="logo">

<img src="images/logo1.jpg" alt="logo"/>

</a>

</telerik:LayoutColumn>

<telerik:LayoutColumn Span="2" SpanMd="2" SpanSm="12" SpanXs="12">

<div class="title_main2">

<h1>

Testing

</h1>

</div>

</telerik:LayoutColumn>

<%--Main Nav--%>

<telerik:LayoutColumn Span="8" SpanMd="7" SpanSm="12" SpanXs="12">

<telerik:RadMenu ID="RadMenu1" runat="server" RenderMode="Auto" EnableRoundedCorners="true" EnableSelection="true" EnableShadows="true" >

<Items>

<telerik:RadMenuItem Text="Home" NavigateUrl="Default.aspx" />

<telerik:RadMenuItem IsSeparator="true" />

<telerik:RadMenuItem Text="Grid Page" NavigateUrl="Grid.aspx" />

<telerik:RadMenuItem IsSeparator="true" />

<telerik:RadMenuItem Text="ListView Page" NavigateUrl="ListView.aspx" />

<telerik:RadMenuItem IsSeparator="true" />

<telerik:RadMenuItem Text="testing" NavigateUrl="testing.aspx" />

<telerik:RadMenuItem IsSeparator="true" />

<telerik:RadMenuItem Text="Projects" />

</Items>

</telerik:RadMenu>

</telerik:LayoutColumn>

<telerik:LayoutColumn Span="12" SpanMd="12" SpanSm="12" SpanXs="12">

<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">

</asp:ContentPlaceHolder>

</telerik:LayoutColumn>

</Columns>

</telerik:LayoutRow>

<telerik:LayoutRow RowType="Container" WrapperCssClass="content" WrapperHtmlTag="Div" HtmlTag="None">

<Content>

<telerik:RadPageLayout runat="server" ID="PageLayoutConent" HtmlTag="None" GridType="Fluid">

<Rows>

<telerik:LayoutRow RowType="Container" WrapperCssClass="article1" WrapperHtmlTag="Div">

<Content>

</Content>

</telerik:LayoutRow>

</Rows>

</telerik:RadPageLayout>

</Content>

</telerik:LayoutRow>

</Rows>

</telerik:LayoutRow>

<telerik:LayoutRow RowType="Container" WrapperCssClass="footer" WrapperHtmlTag="Div">

<Content>

<div style="height: 84px"><a style="color: white">Sticky footer</a></div>

</Content>

</telerik:LayoutRow>

</Rows>

</telerik:LayoutRow>

</Rows>

</telerik:RadPageLayout>

</div>

</form>

</body>

</html>


<%@ Page Title="" Language="vb" AutoEventWireup="false" MasterPageFile="~/Responsive.Master" CodeBehind="ResponsivePage.aspx.vb" Inherits="GMAT.ResponsivePage" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
        <div>
                <table border="1px" height="1000px" style="width:100%">
                    <tr>
                        <td style="float:left;text-align:justify;font-size:0.9em;vertical-align:bottom;">
                             
                        </td>
                        <td style="float:right;text-align:justify;font-size:0.9em; color:White;">
                           The First line
                        </td>
                    </tr>
                    <tr>
                        <td style="float:left;text-align:justify;font-size:0.9em;">
                             
                        </td>
                        <td style="float:right;text-align:justify;font-size:0.9em;vertical-align:bottom;">
                            © Second line: 
                             
                             
                             
                        </td>
                    </tr>
                    <tr>
                        <td style="float:left;text-align:justify;font-size:0.9em;">
                             
                        </td>
                        <td style="float:right;text-align:justify;font-size:0.9em;vertical-align:bottom;">
                            © The Last line 
                             
                             
                             
                        </td>
                    </tr>
                </table>
                </div>
</asp:Content>

PageLayout

answered on 08 Apr 2015

9 answers

1.0K+ views

GDI+ Error in System.Drawing.Graphics.MeasureString

My application populates a combobox with 3000+ items. When I select all the items in the list, I get the following error on postback of the page.

Is there a limit on the maximum number of items/characters I can display in the combobox?

[ExternalException (0x80004005): A generic error occurred in GDI+.]
System.Drawing.Graphics.MeasureString(String text, Font font, SizeF layoutArea, StringFormat stringFormat) +1593640
System.Drawing.Graphics.MeasureString(String text, Font font, SizeF layoutArea) +18
System.Drawing.Graphics.MeasureString(String text, Font font) +43
Telerik.Web.UI.RadComboBox.MeasureCheckedItemsText(String checkedItemsTexts) +188
Telerik.Web.UI.RadComboBox.OnPreRender(EventArgs e) +421
System.Web.UI.Control.PreRenderRecursiveInternal() +113
System.Web.UI.Control.PreRenderRecursiveInternal() +222
System.Web.UI.Control.PreRenderRecursiveInternal() +222
System.Web.UI.Control.PreRenderRecursiveInternal() +222
System.Web.UI.Control.PreRenderRecursiveInternal() +222
System.Web.UI.Control.PreRenderRecursiveInternal() +222
System.Web.UI.Control.PreRenderRecursiveInternal() +222
System.Web.UI.Control.PreRenderRecursiveInternal() +222
System.Web.UI.Control.PreRenderRecursiveInternal() +222
System.Web.UI.Control.PreRenderRecursiveInternal() +222
System.Web.UI.Control.PreRenderRecursiveInternal() +222
System.Web.UI.Control.PreRenderRecursiveInternal() +222
System.Web.UI.Control.PreRenderRecursiveInternal() +222
System.Web.UI.Page.ProcessRequestMain(Boolean includeStagesBeforeAsyncPoint, Boolean includeStagesAfterAsyncPoint) +4297

ComboBox

answered on 08 Apr 2015

1 answer

216 views

RadGrid Dyanmic Dropdown in Batch Mode

Here is my scenario

I have two grid and two buttons and layout is as follows

UI :

1. Student_Grid <Student Name, Student ID, Select Checkbox> : Student Info Grid

2. Move Button : Button which will Copy Selected Students from Student_Grid to Notice_Grid

3. Notice_Grid <Student Name, Student ID, some columns, Hobbies_dropdownlist>

4. Submit Button : which will send data to server.

DataTable :

1. Student_data <master>

2. Hobbies_data <master>

3. Student_hobbies <relationship table>

Requirement :

User will select few students from Student_Grid and use Move button to copy those to Notice_Grid where user selects Hobbies (which is different for different students)

Problem:

I am creating datatable in aspx.vb page and then binding that data to Notice_Grid. Problem is, I m not able to populate dropdownlist datasource since, it is dynamic. I tried different ways but didnt find way to assign datasource to dropdownlist/combobox based on studentid. each row could have different list under hobbies column.

Thanks in advance

Note: I am using Radgrid with Batch mode

Grid

answered on 08 Apr 2015

1 answer

315 views

ListBox scrollbar skin / custom colors

With reference to the attached image, I would like to adjust the scrollbar to fit in better with the Metro Touch skin.

I do not want to resort to an external plug-in, just make the color or shading more harmonious with the surrounding content.

ListBox

answered on 08 Apr 2015

6 answers

71 views

What You See is **NOT** What You Get

With the below code snippet, the text is offset to the right and down in the first RadOrgChart node, and becomes further offset in each subsequent node... rapidly disappearing completely from the node.

When exporting a table that has multiple RadGrids, the text is properly centered but the images of table borders and RadGrid cells are offset left and up. Almost as if the image ignores the PDF margins while the text does not.

Does anyone have an idea on how to get the PDF to reflect what is seen on the screen?

<div class="foo">

<telerik:RadOrgChart ID="orgCMF" runat="server" DataFieldID="POSC" DataFieldParentID="CPMOS"

DataTextField="POSC" DisableDefaultImage="true" OnNodeDataBound="orgCMF_NodeDataBound" Skin="Simple">

<ItemTemplate>

<div class="nodeText">

<span>Rank: <%#DataBinder.Eval(Container.DataItem, "Rank")%></span></br>

<span>DMOS: <%#DataBinder.Eval(Container.DataItem, "POSC")%></span>

<br />

<asp:Label ID="lblAuth" runat="server"/>

<br />

<asp:Label ID="lblAuthFem" runat="server" />

<br />

</div>

</ItemTemplate>

</telerik:RadOrgChart>

</div>

ClientExportManager

answered on 08 Apr 2015

1 answer

203 views

Editor's Absolute Path

Hi, we are using the Editor to upload file to another folder outside of the website folder.
Is there a way to change the Editor's Absolute Path programmatically?

Example in http://www.abc.com/admin/

1. We set the Image Manager path using ~/client/{client_name} which is a virtual folder pointing to folder outside of the current website folder. The {client_name} is a variable depending on current user.

2. The editor will then automatically set the image path as http://www.abc.com/client/{client_name}/image.jpg.

3. Is there a way to change the absolute path to http://www.fileserverabc.com/client/{client_name}/image.jpg
instead of http://www.abc.com/client/{client_name}/image.jpg ?

Thanks.

Editor

answered on 08 Apr 2015

5 answers

102 views

single click server side

How do i get selected day DataKeyField (id) on single click server side?
I use ReadOnly="true"

Scheduler

answered on 08 Apr 2015

7 answers

94 views

Issue while drag drop file

Hello Support,

We are using 2013.1.220.35 Version of telerik.

We have an issue while dragging dropping row.

When using drag/drop in grid if you right click while dragging the item you are dragging becomes stuck in place on the screen.

Attaching the snapshot.

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

<%@ 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></title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager runat="server" ID="ScriptManager1">
</asp:ScriptManager>
<script type="text/javascript">
function rowDblClick(sender, eventArgs) {
sender.get_masterTableView().editItem(eventArgs.get_itemIndexHierarchical());
}
</script>
<div>
<telerik:RadGrid ID="rgDomo" AutoGenerateColumns="false" CellSpacing="2" MasterTableView-NoMasterRecordsText="There are no records to display"
Skin="WebBlue" BorderStyle="Double" BorderColor="Black" Visible="true" Width="900"
runat="server" OnRowDrop="RowDrop" AllowMultiRowEdit="True" OnItemDataBound="rgDomo_ItemDataBound"
OnItemCreated="rgDomo_ItemCreated">
<ClientSettings EnableAlternatingItems="false">
</ClientSettings>
<MasterTableView DataKeyNames="iDomoID,iOrderNo,sDomoListImage,sDomoBGImage,bIsSystemDomo,bVisibleToSideBar,sDomoName,bIsGroupDomo,iDomoType"
EditMode="InPlace">
<Columns>
<telerik:GridBoundColumn DataField="iDomoID" Visible="false" />
<telerik:GridBoundColumn DataField="bIsSystemDomo" Visible="false" />
<telerik:GridBoundColumn DataField="iOrderNo" Visible="false" />
<telerik:GridBoundColumn DataField="bVisibleToSideBar" Visible="false" />
<telerik:GridBoundColumn DataField="bIsGroupDomo" Visible="false" />
<telerik:GridBoundColumn DataField="iDomoType" Visible="false" />
<telerik:GridTemplateColumn ItemStyle-Width="34" HeaderText="Sort" UniqueName="Sort">
<HeaderStyle HorizontalAlign="Center" VerticalAlign="Bottom" />
<ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" CssClass="col1" />
</telerik:GridTemplateColumn>
<telerik:GridBoundColumn DataField="sDomoListImage" Visible="false" />
<telerik:GridTemplateColumn ItemStyle-Width="34" HeaderText="Icon" UniqueName="Sort">
<HeaderStyle HorizontalAlign="Center" VerticalAlign="Bottom" CssClass="col2" />
<ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" CssClass="col2" />
<ItemTemplate>
<asp:ImageButton ID="btnIcon" ImageUrl='<%#HttpContext.Current.Session("imageUrl")+ Eval("sDomoListImage")%>'
BackColor='<%# System.Drawing.ColorTranslator.FromHtml(Eval("sDomoBGImage"))%>'
OnClick="btnIcon_Click" Width="34px" CssClass="iconimage" runat="server" />
</ItemTemplate>
</telerik:GridTemplateColumn>
<telerik:GridTemplateColumn ItemStyle-Width="50" ColumnGroupName="Domo" HeaderText="Label"
UniqueName="sDomoName">
<HeaderStyle HorizontalAlign="Center" VerticalAlign="Bottom" CssClass="col3" />
<ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" CssClass="col3" />
<ItemTemplate>
<asp:TextBox ID="txtDomoName" runat="server" Text='<%#Eval("sDomoName")%>' BackColor="#213051"
ForeColor="White" CssClass="labletext"
AutoPostBack="true"></asp:TextBox>
</ItemTemplate>
</telerik:GridTemplateColumn>
<telerik:GridTemplateColumn ItemStyle-Width="50" HeaderText="Show/Hide" UniqueName="IsVisibleToSideBar">
<HeaderStyle HorizontalAlign="Center" VerticalAlign="Bottom" CssClass="col4" />
<ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" CssClass="col4" />
<ItemTemplate>
<asp:CheckBox ID="chkShowHide" runat="server"
AutoPostBack="true" />
</ItemTemplate>
</telerik:GridTemplateColumn>
<telerik:GridTemplateColumn ItemStyle-Width="50" HeaderText="Delete" UniqueName="Delete">
<HeaderStyle HorizontalAlign="Center" VerticalAlign="Bottom" CssClass="col5" />
<ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" CssClass="col5" />
<ItemTemplate>

<asp:Image ID="btnDelete" ImageUrl="../Images/Buttons/delete-btn_workvine.png"
runat="server" alt="Delete Domo" title="Delete Domo" Style="cursor: pointer" />
</ItemTemplate>
</telerik:GridTemplateColumn>
</Columns>
</MasterTableView>
<ClientSettings AllowRowsDragDrop="true">
<Selecting AllowRowSelect="True" EnableDragToSelectRows="true" />
<ClientEvents OnRowDblClick="rowDblClick" />
</ClientSettings>
</telerik:RadGrid>
</div>
</form>
</body>
</html>

Grid

answered on 08 Apr 2015

8 answers

366 views

problem changing the calender to persian

hi

I have to use the Scheduler in a farsi(persian) website,to change the calendar from georgian to persian I have written the following codes:

     System.Globalization.CultureInfo culture = new System.Globalization.CultureInfo("fa-IR");
        System.Globalization.DateTimeFormatInfo info = culture.DateTimeFormat;
        info.AbbreviatedDayNames = new string[] { "ی", "د", "س", "چ", "پ", "ج", "ش" };
        info.DayNames = new string[] { "یکشنبه", "دوشنبه", "ﺳﻪشنبه", "چهارشنبه", "پنجشنبه", "جمعه", "شنبه" };
        info.AbbreviatedMonthNames = new string[] { "فروردین", "اردیبهشت", "خرداد", "تیر", "مرداد", "شهریور", "مهر", "آبان", "آذر", "دی", "بهمن", "اسفند", "" };
        info.MonthNames = new string[] { "فروردین", "اردیبهشت", "خرداد", "تیر", "مرداد", "شهریور", "مهر", "آبان", "آذر", "دی", "بهمن", "اسفند", "" };
        info.AMDesignator = "ق.ظ";
        info.PMDesignator = "ب.ظ";
        info.ShortDatePattern = "yyyy/MM/dd";
        info.FirstDayOfWeek = DayOfWeek.Saturday;
        System.Globalization.PersianCalendar cal = new System.Globalization.PersianCalendar();

        typeof(System.Globalization.DateTimeFormatInfo).GetField(
            "calendar", System.Reflection.BindingFlags.Public |
            System.Reflection.BindingFlags.Instance |
            System.Reflection.BindingFlags.NonPublic).SetValue(info, cal);

        object obj = typeof(System.Globalization.DateTimeFormatInfo).GetField(
            "m_cultureTableRecord", System.Reflection.BindingFlags.Public |
            System.Reflection.BindingFlags.Instance |
            System.Reflection.BindingFlags.NonPublic).GetValue(info);

        obj.GetType().GetMethod("UseCurrentCalendar",
           System.Reflection.BindingFlags.NonPublic |
           System.Reflection.BindingFlags.Instance).Invoke(obj,
           new object[] { cal.GetType().GetProperty("ID",
   System.Reflection.BindingFlags.Instance |
   System.Reflection.BindingFlags.NonPublic).GetValue(cal, null) });

        typeof(System.Globalization.CultureInfo).GetField("calendar",
            System.Reflection.BindingFlags.Public | System.Reflection.BindingFlags.Instance |
            System.Reflection.BindingFlags.NonPublic).SetValue(culture, cal);

        System.Threading.Thread.CurrentThread.CurrentCulture = culture;

        RadScheduler1.Culture = culture;
        RadScheduler1.SelectedDate = DateTime.Now.Date;
        TimeSpan ts = new TimeSpan(3, 30, 00);
        RadScheduler1.TimeZoneOffset = ts;
        RadScheduler1.FirstDayOfWeek = DayOfWeek.Saturday;
        RadScheduler1.Localization.HeaderDay = "روز";
        RadScheduler1.Localization.HeaderToday = "امروز";

the result is strange,the dayview & weekview is ok but in the monthview and also in the calendar at the corner of the page(when navigating from current month to next or previuos month ) day conversions are incorrect

I have shown the problems in the picture at the following url

http://upload.iranblog.com/7/1247614585.jpg

can anyone help me chang the calender implemented in aspxScheduler from georgian to persian please??

Scheduler