Questions on UI for ASP.NET AJAX Forum

1 answer

301 views

I'm following this page: http://docs.telerik.com/devtools/aspnet-ajax/controls/grid/functionality/scrolling/how-to/scrolling-to-the-selected-item

but the scroll remains at the top of the grid...

Here is my .aspx page:

<telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateColumns="False" RenderMode="Auto" AllowSorting="False" GroupingEnabled="false" AllowPaging="False" OnNeedDataSource="RadGrid1_OnNeedDataSource" Skin="Metro" OnItemDataBound="RadGrid1_OnItemDataBound" AllowFilteringByColumn="False">

<MasterTableView AllowNaturalSort="false">

<Columns>

<telerik:GridBoundColumn HeaderText="" UniqueName="Position" HeaderStyle-Width="40px">

</telerik:GridBoundColumn>

<telerik:GridTemplateColumn ItemStyle-CssClass="gridImage" HeaderStyle-Width="43px">

<ItemTemplate>

<%# getImage(Container.DataItem) %>

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridBoundColumn DataField="Pseudo" HeaderText="Pseudo" UniqueName="Pseudo" >

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="Points" HeaderText="Points" UniqueName="Points" HeaderStyle-Width="70px">

</telerik:GridBoundColumn>

</Columns>

</MasterTableView>

<ClientSettings ReorderColumnsOnClient="false" AllowColumnsReorder="false">

<Virtualization EnableVirtualization="false" InitiallyCachedItemsCount="100"

LoadingPanelID="RadAjaxLoadingPanel1" ItemsPerView="20" />

<Scrolling AllowScroll="true" UseStaticHeaders="true" ScrollHeight="300px" />

<Resizing AllowColumnResize="false" />

<ClientEvents OnGridCreated="GridCreated" />

</ClientSettings>

</telerik:RadGrid>

<script type="text/javascript">

function GridCreated(sender, eventArgs) {

//gets the main table scrollArea HTLM element

var scrollArea = document.getElementById(sender.get_element().id + "_GridData");

var row = sender.get_masterTableView().get_selectedItems()[0];

//if the position of the selected row is below the viewable grid area

if (row) {

if ((row.get_element().offsetTop - scrollArea.scrollTop) + row.get_element().offsetHeight + 20 > scrollArea.offsetHeight) {

//scroll down to selected row

scrollArea.scrollTop = scrollArea.scrollTop + ((row.get_element().offsetTop - scrollArea.scrollTop) +

row.get_element().offsetHeight - scrollArea.offsetHeight) + row.get_element().offsetHeight;

}

//if the position of the the selected row is above the viewable grid area

else if ((row.get_element().offsetTop - scrollArea.scrollTop) < 0) {

//scroll the selected row to the top

scrollArea.scrollTop = row.get_element().offsetTop;

}

</script>

I select the 50th row in the RadGrid1_OnItemDataBound event handler.

In the browser, in debug mode, it goes in the GridCreated function, and at the end scrollArea.scrollTop is set to 2440 ; but the scroll remains at the top of the grid...

What's wrong?

Grid

answered on 25 Mar 2016

1 answer

78 views

[Solved] USerControlForm Widthe is not correct

I have a user control form set for editing and adding records but the form data fields are off the form hard to explain so I have attached a screen shot. Looks like I need to increase the width of the form but all of my attempts to that have no effect. Can any one explain what I am missing? Not sure what properties I need to change and I hate to do it but below is the code I use for this grid

<body>

<div></div>

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

<div>

<asp:Label ID="Label1" runat="server" Text="Search Case Nunber: "></asp:Label> <asp:TextBox ID="txtSearchBox" runat="server"></asp:TextBox> <asp:Button ID="Button1" runat="server" Text="Go" OnClick="Button1_Click" /><br /><br />

</div>

<telerik:RadScriptManager ID="RadScriptManager1" runat="server"></telerik:RadScriptManager>

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

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="RadGrid1">

<UpdatedControls>

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

</UpdatedControls>

</telerik:AjaxSetting>

<telerik:AjaxSetting AjaxControlID="ConfiguratorPanel">

<UpdatedControls>

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

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Skin="Windows7"></telerik:RadAjaxLoadingPanel>

<telerik:RadFormDecorator ID="RadFormDecorator1" runat="server" DecorationZoneID="Grid" DecoratedControls="All" EnableRoundedCorners="false" />

<div id="Grid" class="Grid-container">

<telerik:RadGrid ID="RadGridInvestigations"

runat="server"

AutoGenerateColumns="False"

AllowPaging="True"

AllowSorting="True"

AllowAutomaticInserts="True"

OnNeedDataSource="RadGridInvestigation_NeedDataSource"

OnItemCreated="RadGridInvestigation_ItemCreated"

OnUpdateCommand="RadGridInvestigation_UpdateCommand"

OnInsertCommand="RadGridInvestigation_InsertCommand"

Font-Size="Large">

<PagerStyle Mode="NextPrevNumericAndAdvanced" />

<MasterTableView

EditMode="PopUp"

AutoGenerateColumns="false"

DataKeyNames="CaseID"

GridLines="Horizontal"

CommandItemDisplay="Top"

NoMasterRecordsText="No Records matched your search return to the search page and try again." ShowFooter="False">

<EditFormSettings>

<PopUpSettings Modal="False"/>

</EditFormSettings>

<Columns>

<telerik:GridEditCommandColumn ButtonType="ImageButton"></telerik:GridEditCommandColumn>

<telerik:GridBoundColumn DataField="CaseID" HeaderText="Case ID" ReadOnly="true" ForceExtractValue="Always" ConvertEmptyStringToNull="true" Display="false" UniqueName="CaseID" />

<telerik:GridBoundColumn DataField="CaseNumber" HeaderText="CaseNumber" UniqueName="CaseNumber" ReadOnly="false" Display="false"/>

<telerik:GridHyperLinkColumn FilterControlAltText ="Filter CaseNumber column"

Uniquename="CaseNumber" DataNavigateUrlFormatString ="~/InvWithTips.aspx?CaseNumber={0}"

DataTextField="CaseNumber" HeaderText="Case Number"

DataNavigateUrlFields="CaseNumber"

SortExpression="CaseNumber" HeaderStyle-Wrap="false" >

</telerik:GridHyperLinkColumn>

<telerik:GridBoundColumn DataField="CaseName" HeaderText="Name" SortExpression="CaseName"

UniqueName="CaseName" Display="True">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="InvestigativeUnit" HeaderText="Unit Assigned" SortExpression="InvestigativeUnit"

UniqueName="InvestigativeUnit" HeaderStyle-Wrap="True">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="PrimaryContact" HeaderText="PrimaryContact" SortExpression="PrimaryContact"

UniqueName="PrimaryContact">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="PrimaryContactEmail" HeaderText="PrimaryContactEmail" SortExpression="PrimaryContactEmail"

UniqueName="PrimaryContactEmail">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="PrimaryContactPhone" HeaderText="Primary Phone" SortExpression="PrimaryContactPhone"

UniqueName="PrimaryContactPhone">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="SecondaryContact" HeaderText="2nd Contact" SortExpression="PrimaryContact"

UniqueName="SecondaryContact">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="SecondaryEmail" HeaderText="2nd Email" SortExpression="SecondaryEmail"

UniqueName="SecondaryEmail">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="SecondaryPhone" HeaderText="2nd Phone" SortExpression="SecondaryPhone"

UniqueName="SecondaryPhone">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="DateOpened" HeaderText="DateOpened" SortExpression="DateOpened"

UniqueName="DateOpened" DataFormatString="{0:dd/MM/yyyy}">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="Status" HeaderText="Status" SortExpression="Status"

UniqueName="Status">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="DateClosed" HeaderText="DateClosed" SortExpression="DateClosed"

UniqueName="DateClosed" DataFormatString="{0:dd/MM/yyyy}">

</telerik:GridBoundColumn>

</Columns>

<EditFormSettings UserControlName="InvestigationDetailsControl.ascx" EditFormType="WebUserControl" PopUpSettings-Width="400px">

<EditColumn UniqueName="EditCommandColumn1" ></EditColumn>

</EditFormSettings>

</MasterTableView>

</telerik:RadGrid>

</div>

<telerik:RadInputManager runat="server" ID="RadInputManager1" Enabled="true">

<telerik:TextBoxSetting BehaviorID="TextBoxSetting1">

</telerik:TextBoxSetting>

</telerik:RadInputManager>

<telerik:RadWindowManager ID="RadWindowManager1" runat="server" />

</form>

</body>

Any help would be great

Thanks

Perry

Grid

answered on 25 Mar 2016

4 answers

156 views

Hierarchy grid edit, update and delete

I have a hierarchy grid that has 6 detail tables. All the data for the grid is bound in code behind.

I need to create custom insert, edit and delete templates for each of the detail tables. The information I have found has the datasource client side. I need information to create these server side.

Grid

answered on 25 Mar 2016

3 answers

268 views

RadStyleSheetManager and .NET themes

Is it possible to use .NET themes with RadStyleSheetManager?

When I use a RadStyleSheetManager to combine my external stylesheets, it places the WebResource file AFTER the .NET themes stylesheet in the Head tag, with the result that the theme I'm trying to apply from the App_Themes folder is overridden by the base styles in the external stylesheets combined by the Telerik control. As in:

<head>

</head>

Is there a way to get the StyleSheetManager to place its webresource file before the .NET themes file?

Thanks

ScriptManager and StyleSheetManager

answered on 25 Mar 2016

1 answer

161 views

Disable expand RadMenu

Hello,

My special scenario is as follows:

A topMenu with sublinks and a boxmenu with this sublinks on the page. I don't want to show the sublinks as expanded dropdown in the topMenu. The user should only one click on the top menu to reach the subpage, where the boxMenu will be visible. The links on the box menu should be "connected" with the topMenu to let the topLink as marked.

So my idea, let the topMenu expanding disabled. I have created two sitemapProviders web.sitemapTop and web.siteMapBox with the related structure.

With "expanding" the top-menu, all works fine. But I want to avoid expanding the TopMenu because of design-reasons (surely a bit user unfriendly...).

When I delete the submenuItems from the TopSiteMap, the boxLinks don't let the TopMenuLink as marked...

How can I disable the expand functionality of a radmenu (asp.net)?

Thanks in advance.

regards,

lux

Menu

answered on 25 Mar 2016

5 answers

265 views

Display RadPageView Dynamically in RadTab

Hi Team

I am trying to load RadPageView Dyamically inside the RadTab but unable to do so.

Ex: I have a treeview and RadTab on the screen. My requirement is if user selects the value in treeeview ex: Exmployee, then I need to dispaly Employee.aspx in RadTab. Similarly if user selects Department then display Department in RadTab.

Below is my code:

<telerik:RadTab

runat="server"

Value="ADM110_DepotAdminManage_Tab"

Text="Depot"

PageViewID="RadPageView_ADM110_DepotAdminManage"

/>

<telerik:RadPageView

ID="RadPageView_ADM110_DepotAdminManage"

runat="server"

ContentUrl="ADM110_DepotAdminManage.aspx"

Height="90%" >

</telerik:RadPageView>

In the above code, I am unable to change the ContentUrl dynamically. Please let me know is any method to change contentUrl dynamically.

Thanks
Sharan

TabStrip

answered on 25 Mar 2016

2 answers

282 views

Dynamic URL for Tab Strip Client Side

Hi I have following structure of code

Global.asax - conytains URL Routing as it is
-------------------------------------------------------------------
routes.MapPageRoute("Company",
"/Health/Company/{ID}/{Name}",
"~/Health/company/CompanyPro.aspx"
);

Company.master contains tabstrip and iam creating the Dynamic url url1 url2 etc. Hoe can i assign this url to tab strip url through javascript ?

-----------------------------------------------------
<telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">
<script type="text/javascript">
...........
var url1 = String.format('/Health/Company/{0}/{1}/{2}', clientid, name);
var url2 = --- Some URL ---

</script>

please help

</telerik:RadScriptBlock>

<telerik:RadTabStrip ID="radTabMain" runat="server" Width="100%" OnTabClick="radTabMain_TabClick">
<Tabs>
<telerik:RadTab Text="Home" runat="server" Url="">
</telerik:RadTab>
<telerik:RadTab Text="AboutUs" runat="server" Url="">
</telerik:RadTab>
<telerik:RadTab Text="Contact Us" runat="server" Url="">
</telerik:RadTab>
<telerik:RadTab Text="Feedback" runat="server" Url="">
</telerik:RadTab>
</Tabs>
</telerik:RadTabStrip>

TabStrip

answered on 25 Mar 2016

16 answers

1.4K+ views

Ignore grouping header when exporting to Excel

Hi all,

I have a rad grid table where one of the columns is the "Group By" column. When I export to excel, all I want is just the data exported in the order that is presented on the screen, but I get the extra "header" group by lines. IE...

COL1         COL2         COL3
COL1: 12345
12345         xxx               yyy
12345         fygr               dhet
12345         kljasdflk         qweqwe
COL1: 56789
56789         iouoaisuio   oiuiou
56789         werwer         ewrwer

How I can the export to excel to NOT export the group by header lines? I have "ExportOnlyData" set to true.

I tried the following just before the export...

RadGrid1.GroupingEnabled = false;
RadGrid1.Rebind();

...but the rebind changed the order of the rows so that the data was no longer grouped.

Thanks!

Grid

answered on 25 Mar 2016

1 answer

93 views

Style parent rows on excel export

I am using a linkbutton to use teleriks excel export to export the entire tree of the rad tree list. Is there a way to style the parent rows only? I see an expand collapse cell style setting, but that just styles the cell with the expand/collapse icon. However, I need to style that entire row. Is there a way to do that?

TreeList