Questions on UI for ASP.NET AJAX Forum

1 answer

134 views

Hello,

I try to integrate the Telerik libraries, replacing my asp:gridview by a RadGrid, and I have a problem on an update. Here is my case:

I have a page with an update panel containing a grid (asp:gridview).
On page load, I add dynamically some user controls in an asp place holder. These user controls contain their own update panel with buttons or drop down lists inside (not always the some control). When the button or the drop down list of the UC is selected, it calls some code of the business layer, and the business layer raises an event. The page (which has subscribed to this event), load a datatable, set the datatable as datasource of the grid, and bind it. I update the update panel containing the grid to refresh it. It works correctly.

I want to replace the asp:gridview by a RadGrid.

I keep the update panel containing the RadGrid, because I can't use the RadAjaxManager (even dynamically) because the controls of the user controls are not always the same (button or drop down list).

It seems to work. When I click on a user control button, the gridview is correctly displayed. If a click ONE TIME on a header, the sort is done. BUT if a click again, I obtain the following error message (same error on each action):
Microsoft JScript runtime error: Sys.InvalidOperationException: Impossible de trouver UpdatePanel avec l'ID 'RadGrid1Panel'. S'il est mis à jour dynamiquement, il doit se trouver dans un autre UpdatePanel.

To avoid the update panel problem, I tried to remove the UpdatePanel around the RadGrid and add a RadAjaxPanel (referencing a AjaxLoadingPanel) around all the page. But this time, I see the loading panel but the RadGrid is not updated after the binding. Should I do something to trigger the update ?

Thanks by advance.

Damien

Ajax

answered on 21 Dec 2012

2 answers

123 views

Displaying multiple fields with timeline

I have data that relates values assigned to discrete date ranges. Each range is identified by a combination of up to 6 different fields that need to be displayed with the range.

These are all in the primary datasource for the scehduler. The obvious way would seem to be to simply group the rows by the additional fields so that I get something like,

field1value    field2value    field3value    field4value    __________ timeline ___________
field1value    field2value    field3value    field4value    __________ timeline ___________
field1value    field2value    field3value    field4value    __________ timeline ___________

However, I don't see any straightforward way to accomplish this. The only thing I can see to do would be to take a roundabout way and create a second data source with the same data and a composite key formed from those additional fields and a foreign key back to the primary. Add that as a resource, then group by the composite key.

Of course this would dump it all into a single column and leave it without proper headers, not exactly ideal.

Is there a better way to accomplish that?

Scheduler

answered on 21 Dec 2012

3 answers

183 views

Big size of Telerik.Web.UI.WebResource.js creating problems

Hi,

We use Telerik AJAX ASP.NET extensively. On one page the page response time is very critical. On this page we are using RadGrid and RadComboBox. We have included RadScriptManager too.

One issue we are facing is that when user accesses this page for first time then Telerik.Web.UI.WebResource.js file is downloaded. This file is about 0.7 MB is size! This is creating major performance issues due to which we are being forced to re-write the page without Telerik.

Is there a way to reduce this size? On this particular page we are just using the RadGrid and RadComboBox- is there a way that we include the js for just these two controls? Or is there some other way?

Note: Using Telerik CDN is not going to help as using this yet on first visit the js file size would remain the same. Using RadCompression is not going to help as main problem is the 0.7 MB size of Telerik.Web.UI.WebResource.js.

I googled a bit but did not find a solution. PLEASE HELP, else its bye bye Telrik for us!

Thanks,
- Manoj

General Discussions

answered on 21 Dec 2012

1 answer

230 views

Radgrid export in Custom Control

Hello
I created custom control to list some data from database. I used radgrid for this. Now everything works fine, except exporting.
When I click export button GvExpertise_ItemCommand is triggered and columns are set hidden. But after that exception is triggered:

The Controls collection cannot be modified because the control contains code blocks (i.e. <% ... %>).

Description: An unhandled exception occurred during the execution of the current web request. Please review the stack trace for more information about the error and where it originated in the code.

Exception Details: System.Web.HttpException: The Controls collection cannot be modified because the control contains code blocks (i.e. <% ... %>).

Source Error:

An unhandled exception was generated during the execution of the current web request. Information regarding the origin and location of the exception can be identified using the exception stack trace below.

Stack Trace:


            [HttpException (0x80004005): The Controls collection cannot be modified because the control contains code blocks (i.e. <% ... %>).]
   System.Web.UI.ControlCollection.Add(Control child) +9601391
   Telerik.Sitefinity.Web.SitefinityRequiredControls.Page_PreRenderComplete(Object sender, EventArgs e) +521
   System.EventHandler.Invoke(Object sender, EventArgs e) +0
   System.Web.UI.Page.OnPreRenderComplete(EventArgs e) +121
   System.Web.UI.Page.ProcessRequestMain(Boolean includeStagesBeforeAsyncPoint, Boolean includeStagesAfterAsyncPoint) +1155

Version Information: Microsoft .NET Framework Version:4.0.30319; ASP.NET Version:4.0.30319.17929

Codefile:

public class ExpertiseListView : SimpleView

{

#region control info

public static Guid GroupPageGuid = new Guid("6743bffb-7cce-4e5c-9d9e-fc7ff1fa5e73");

public static Guid PageGuid = new Guid("f0608080-5054-48b7-8218-a72ac6842e40");

public static string TemplateName = "ContactsFormModule.Resources.Backend.ExpertiseListView.ascx";

protected override string LayoutTemplateName { get { return TemplateName; } }

#endregion

#region controls

protected virtual ITextControl LblTitle { get { return base.Container.GetControl<ITextControl>("LblTitle", true); } }

protected virtual HyperLink BtnAdd { get { return base.Container.GetControl<HyperLink>("BtnAdd", true); } }

protected virtual RadGrid GvExpertise { get { return base.Container.GetControl<RadGrid>("GvExpertise", true); } }

#endregion

public static string FieldName(bool isGeneral, bool isCompany)

{

if (isGeneral && isCompany)

return "...";

else if (isGeneral)

return "..";

else if (isCompany)

return ".";

else

return string.Empty;

}

protected override void InitializeControls(GenericContainer container)

{

LblTitle.Text = "Expertise";

LblAdd.Text = "Dodaj";

//BtnAdd.NavigateUrl = App.WorkWith().Page(ExpertiseEditView.PageGuid).Get().GetFullUrl();

GvExpertise.NeedDataSource += GvExpertise_NeedDataSource;

GvExpertise.ItemCommand += GvExpertise_ItemCommand;

GvExpertise.ItemDataBound += GvExpertise_ItemDataBound;

}

void GvExpertise_NeedDataSource(object sender, GridNeedDataSourceEventArgs e)

{

GvExpertise.DataSource = new ContactsManager().Expertises;

}

void GvExpertise_ItemDataBound(object sender, GridItemEventArgs e)

{

if (e.Item is GridDataItem)

{

((LinkButton)((GridDataItem)e.Item)["DeleteColumn2"].Controls[0]).Text = ((Expertise)e.Item.DataItem).IsVisible ? "skrij" : "prikaži";

((Literal)((GridDataItem)e.Item)["Field"].Controls[0]).Text = FieldName(((Expertise)e.Item.DataItem).General,((Expertise)e.Item.DataItem).Company);

}

void GvExpertise_ItemCommand(object sender, GridCommandEventArgs e)

{

if (e.CommandName == "hide")

{

int iId = (int)((GridDataItem)e.Item).GetDataKeyValue("Id");

ContactsManager dataContext = new ContactsManager();

Expertise expertise = dataContext.Expertises.FirstOrDefault(x => x.Id == iId);

expertise.IsVisible = !expertise.IsVisible;

dataContext.SaveChanges();

GvExpertise.DataSource = new ContactsManager().Expertises;

this.GvExpertise.DataBind();

}

else if

(e.CommandName == RadGrid.ExportToCsvCommandName || e.CommandName == RadGrid.ExportToExcelCommandName || e.CommandName == RadGrid.ExportToPdfCommandName)

{

GvExpertise.MasterTableView.Columns[3].Visible = false;

GvExpertise.MasterTableView.Columns[4].Visible = false;

}

Template:

<div class="sfWorkArea">

<div class="sfMessage sfGridViewMessage"><asp:Literal id="LblMessage" runat="server"></asp:Literal></div>

<div>

<div class="RadGrid RadGrid_Sitefinity rgTopOffset" tabindex="0">

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

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="RadGrid1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="GvExpertise" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<telerik:RadGrid ID="GvExpertise" runat="server" AllowPaging="True"

AllowSorting="True" AutoGenerateColumns="False" CellPadding="0" Width="100%"

DataKeyNames="Id"

GridLines="None" PageSize="30" EnableModelValidation="True" Skin="Sitefinity">

<ExportSettings ExportOnlyData="True" IgnorePaging="True" OpenInNewWindow="True" HideStructureColumns="true">

<Excel Format="Biff"></Excel>

<Csv ColumnDelimiter="Semicolon" RowDelimiter="NewLine" EncloseDataWithQuotes="true" FileExtension=".csv" />

</ExportSettings>

<MasterTableView DataKeyNames="Id" CommandItemDisplay="Top">

<CommandItemSettings ShowAddNewRecordButton="false" ShowExportToExcelButton="true" ShowExportToCsvButton="true"/>

<Columns>

<telerik:GridBoundColumn DataField="Id" HeaderText="Id" SortExpression="Id" />

<telerik:GridBoundColumn DataField="Description" HeaderText="Strokovno znanje" SortExpression="Description" />

<telerik:GridTemplateColumn DataField="Company,General" SortExpression="Company,General" UniqueName="Field"><ItemTemplate><asp:Literal runat="server" ID="LblField" /></ItemTemplate></telerik:GridTemplateColumn>

<telerik:GridHyperLinkColumn DataNavigateUrlFields="Id" />

<telerik:GridButtonColumn Text='' ButtonType="LinkButton" CommandName="hide" UniqueName="DeleteColumn2"><HeaderStyle Width="20px"></HeaderStyle></telerik:GridButtonColumn>

</Columns>

</MasterTableView>

</telerik:RadGrid>

</div>

ViewState is on, and radscriptmanager exists on page.

Grid

answered on 21 Dec 2012

1 answer

46 views

Radgrid Virtual scrolling - yahoo style

Hi Telerik team,

I tried the yahoo style scrolling with telerik RadGrid Scroll settings as AllowScroll=true,UseStaticHeaders=true like.

But it is not showing the Vertical scrollbar until i add EnableVerticalScrollPaging=true.\

why this is behaving differently.Can't we achieve the exactly same as Yahoostyle.

Srini

Grid

answered on 21 Dec 2012

3 answers

100 views

Problems adding to AjaxSettings under RadAjaxManagerProxy

Hey at Telerik

I have a problem with RadAjaxManagerProxy.

attached i have a project with the scenario with a page without masterpage reference and a RadAjaxManager.

http://kort2.lifa.dk/Examples/RadManagerProxyRadeditorIssue.rar

Included is also a page with masterpage reference and a RadAjaxManagerProxy.

I dynamically build a RadPanelBar from and xml source in both pages and hook a RadEditor to every editable element in the hierarchy.

In this way i can right click editable elements in the radpanelbar and edit, delete etc.

This works fine for the page without the masterpage reference but no click event is registered for the page with a masterpage reference.

In the default.aspx page try to leftclick the element 'Butikscenter i Birkelundsgade' and then the element 'Betemmelser'.
Then try to rightclick the text under the element '§ Hjemmel'. As you can see the contextmenu shows.

In the MasterTest.aspx
try to leftclick the the element 'Bestemmelser' on the left side of the splitterpanel. Then try to rightclick the text under the element
'§ Hjemmel' in the right side of the splitterpanel. No contextmenu is shown.

As far as i can see i hook the elements the same way. Only difference is that the one page has it's own RadAjaxManager and the one with the MasterPage uses a RadAjaxManagerProxy.

I hope you can help me with this since using a masterpage is essential for the project.

Sincerly

Jan

Ajax

answered on 21 Dec 2012

1 answer

126 views

Thumbnail View on mobile

Hi, while testing my RadFileExplorer (Q3 2012) on multiple mobile devices, Ive noted that in Thumbnail View, we cant open files (by double-tapping/long touch on them) and Folder navigation also doesnt work in that view. No problem at all however while in Grid View. Issue can be seen in the demo. Ive experienced the issue on the following device/browsers:

iPad (iOS 5.1.1) native browser
iPhone (iOS 6.0.1) native browser
Android 4.0.3 tablet (native browser, Firefox 17.0, Opera Mobile 12.10 (in this one, I managed to open files by long-touch them and select Open Image from popup))
Android 2.3.4 phone (native browser, Opera Mobile 12.10 (in this one, I managed to open files by long-touch them and select Open Image from popup))

It would be great to fix this since Thumbnail View is way better for mobile devices in terms of useability than Grid View.

TIA

Martin

FileExplorer

answered on 21 Dec 2012

1 answer

51 views

Lost NestedView On Data Rebind

I have a RADGrid (inherited) that I am manipulating using Server-Side code. When I first initialize the grid, I add a NestedViewTemplate that I designed to the grid. When the page loads, the grid appears perfectly fine. Inside the grid rows, I have an ImageButton that when pressed, updates the DataBoundItem, and then refreshs the grid with the new information. When the grid refreshes, the NestedViewTemplate vanishes.

I've tried RADGrid.DataBind() as well as RADGrid.Rebind(). In both cases I check if RADGrid.MasterTableView.NestedViewTemplate is empty...if it is, I re-add the NestedViewTemplate before the "DataBind". I see that the ItemCreated() method runs, and it does create a "GridNestedViewItem"...but when the process is complete, the NestedView doesn't appear. I have to completely re-load the page to get the NestedView to re-appear.

Any ideas?

Grid

answered on 21 Dec 2012

5 answers

1.7K+ views

Using RadEditor without a toolbar

I have been unable to find a satisfactory solution to using the RadEditor in preview mode without a toolbar. While I use the control on some pages for entering content, I have pages that also provide a read-only details view. I simply wish to provide the content for review, allow the user to scroll through the contents, but not show any toolbar. I have come close but a blank toolbar is always shown when the page renders.

Searching the forums and submitting support tickets has resulted in a few suggested solutions: including some style tags or using a ToolsFile.xml that has only <root></root> in it. Unfortunately these have not made any difference, I still get the exact same result. One suggestion is to disable the control which will cause RadEditor to display like a textbox. While this does work, it also eliminates the ability to scroll through the content.

My basic implementation consists of a ListView server control showing various data bound columns including the following:

                            <telerik:radeditor id="redBody" runat="server" Skin="Office2007"
                                editmodes="Preview" height="300px" ToolbarMode="ShowOnFocus"
                                Content='<%# Eval("Body") %>'
                                width="100%">
                                <Tools><telerik:EditorToolGroup></telerik:EditorToolGroup></Tools>
                                <Modules>
                                    <telerik:EditorModule />
                                </Modules>
                            </telerik:radeditor>

Again, I have tried adding a ToolsFile.xml with only <root></root>
I have tried several style suggestions found throughout the forums threads relating to hiding the toolbar. While no icons are shown in the toolbar, the empty toolbar is still visible.

It would make a lot of sense to me if there was a "None" or "Hidden" option available for the "ToolbarMode" attribute. If nothing else, I may have to create a custom Skin and try to fully hide the toolbar in that manner but I have not had time to try that yet.

Has anyone else ran into this or have any suggestions?

Thank you,
Jerry

Editor

answered on 21 Dec 2012

1 answer

234 views

Invalid JSON primitive in RadAsyncUpload

I am receiving an error message when trying to upload files via the RadAsyncUpload. It is strange because it doesn't seem to happen all the time, and I haven't been able to pinpoint exactly when it happens.

The way that I have this setup is that I have a user control called DocumentRepository. The control is in a RadWindow which is opened by clicking on a LinkButton in the aspx page. Inside that control, I can click on a button which opens another RadWindow allowing the user to browse for and upload a file. That uses RadAjaxUpload.

So to start, I have my aspx page:

<%@ Register Src="~/secured/IntakeRequest/ascx/DocumentRepository.ascx" TagName="DocumentRepository" TagPrefix="ADAAC" %>

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

<telerik:RadFormDecorator ID="radFormDecorator" runat="server" DecoratedControls="All" Skin="Office2010Silver" EnableRoundedCorners="false" />

<telerik:RadAjaxManager runat="server" ID="radAjaxManager1" OnAjaxRequest="radAjaxManager1_AjaxRequest">

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="radAjaxManager1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="adaacDocumentRepository" UpdatePanelRenderMode="Inline" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<telerik:RadScriptBlock runat="server">

<script type="text/javascript">

function windowCommunicationLog_OnClientBeforeShow(sender, args) {

var ajaxManager = $find("<%= radAjaxManager1.ClientID %>");

ajaxManager.ajaxRequest("windowCommunicationLog_OnClientBeforeShow");

}

</script>

</telerik:RadScriptBlock>

<telerik:RadWindow runat="server" ID="windowDocumentRepository" Title="Document Repository" Width="1024" Height="700" VisibleOnPageLoad="false" Behaviors="Close, Move" EnableShadow="true" Modal="true" DestroyOnClose="false" OnClientBeforeShow="windowDocumentRepository_OnClientBeforeShow">

<ContentTemplate>

<ADAAC:DocumentRepository runat="server" ID="adaacDocumentRepository" />

</ContentTemplate>

</telerik:RadWindow>

aspx.cs:


protected void Page_Load(object sender, EventArgs e)
 {
 if (!IsPostBack)
 {
    windowDocumentRepository.OpenerElementID = btnImportDocument.ClientID;
}



protected

void radAjaxManager1_AjaxRequest(object sender, AjaxRequestEventArgs e)

{

if (e.Argument == "windowDocumentRepository_OnClientBeforeShow")

{

// the only thing this does is bind a repeater with a list of documents already uploaded

adaacDocumentRepository.BindDocuments();

}

Inside the user control adaacDocumentRepository:

<telerik:RadAjaxLoadingPanel runat="server" ID="RadAjaxLoadingPanel2" Skin="Metro" BackgroundPosition="Center" Direction="LeftToRight" EnableSkinTransparency="false"></telerik:RadAjaxLoadingPanel>

<telerik:RadAjaxManagerProxy runat="server" ID="radAjaxManagerProxy1">

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="btnUploadFile">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="btnUploadFile" LoadingPanelID="RadAjaxLoadingPanel2" UpdatePanelRenderMode="Inline" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManagerProxy>

<telerik:RadWindow runat="server" ID="windowAddDocument" Title="Import a Document" Width="800" Height="250" VisibleOnPageLoad="false" Behaviors="Close, Move"

EnableShadow="true" Modal="true" IconUrl="/images/windowIcon.png">

<ContentTemplate>

<div><b>Select a document to upload</b></div>

<div>

File:

</div>

<div>

<telerik:RadAsyncUpload runat="server" MaxFileInputsCount="1" ID="fileUpload1" ControlObjectsVisibility="None" Width="375" />

</div>

<div>

<asp:Button runat="server" ID="btnUploadFile" OnClick="btnUploadFile_OnClick" Text="Upload File" />

</div>

<div>

Browse for a file and then hit the "Upload" button.

</div>

</ContentTemplate>

</telerik:RadWindow>

<div>

<asp:ImageButton ImageUrl="adddoc.jpg" AlternateText="Add a Document" runat="server" ID="btnUploadDoc" />

</div>

ascx.cs file:

protected void Page_Load(object sender, EventArgs e)

{

RadAjaxManager manager = RadAjaxManager.GetCurrent(Page);

manager.AjaxRequest += new RadAjaxControl.AjaxRequestDelegate(radAjaxManager1_AjaxRequest);

if (!IsPostBack)

{

windowAddDocument.OpenerElementID = btnUploadDoc.ClientID;

}

protected void btnUploadFile_OnClick(object o, EventArgs e)

{

if (fileUpload1.UploadedFiles.Count == 1)

{

string encFileName = Guid.NewGuid() + GetFileExtension(fileUpload1.UploadedFiles[0].FileName);

string uploadPath = Server.MapPath("/documents/" + encFileName);

fileUpload1.UploadedFiles[0].SaveAs(uploadPath);

BindDocuments(); // this just rebinds the uploaded documents

}

protected void radAjaxManager1_AjaxRequest(object sender, AjaxRequestEventArgs e)

{

// this is just here so I can use radconfirm to do file deletions from the grid

}

The json request that is being generated that is causing the error is:

{

'isEnabled':'true',

'uploadedFiles':[

{

"fileInfo":{

"FileName":"Footer Graphic.png",

"ContentType":"image/png",

"ContentLength":18389,

"Index":0

},

"metaData":"/wEFwwF7IlRlbXBGaWxlTmFtZSI6IjEzNTU4NzU4MzI1NjFGb290ZXIgR3JhcGhpYy5wbmciLCJBc3luY1VwbG9hZFR5cGVOYW1lIjoiVGVsZXJpay5XZWIuVUkuVXBsb2FkZWRGaWxlSW5mbywgVGVsZXJpay5XZWIuVUksIFZlcnNpb249MjAxMi4yLjkxMi4zNSwgQ3VsdHVyZT1uZXV0cmFsLCBQdWJsaWNLZXlUb2tlbj0xMjFmYWU3ODE2NWJhM2Q0In0NCNiTh2r8IZeBu1RIF0/Xu3qk/w=="

}

]

},

When I run it through a validator, it appears as though it is the first part that is causing the error, since isEnabled and uploadedFiles is in single quotes instead of double quotes, and the 'true' needs to be either a Boolean, or a string in double quotes....

Any ideas as to how I can fix this? I can't seem to find anybody else that is having this problem.....

I have not been able to recreate this, but it is definitely happening as I can see the error messages coming in pretty regularly. Why are those values coming in with single quotes? What is causing it? Do I need to hack it somehow or is there a fix?

It is definitely the posted value from the RadAsyncUpload control:

ctl00_ctl00_PageContent_PageContent2_windowDocumentRepository_C_adaacDocumentRepository_windowAddDocument_C_fileUpload1_ClientState:{'isEnabled':'true','uploadedFiles':[{"fileInfo":{"FileName":"Footer Graphic.png","ContentType":"image/png","ContentLength":18389,"Index":0},"metaData":"/wEFwwF7IlRlbXBGaWxlTmFtZSI6IjEzNTU4NzU4MzI1NjFGb290ZXIgR3JhcGhpYy5wbmciLCJBc3luY1VwbG9hZFR5cGVOYW1lIjoiVGVsZXJpay5XZWIuVUkuVXBsb2FkZWRGaWxlSW5mbywgVGVsZXJpay5XZWIuVUksIFZlcnNpb249MjAxMi4yLjkxMi4zNSwgQ3VsdHVyZT1uZXV0cmFsLCBQdWJsaWNLZXlUb2tlbj0xMjFmYWU3ODE2NWJhM2Q0In0NCNiTh2r8IZeBu1RIF0/Xu3qk/w=="}]},

Thanks in advance!!!

AsyncUpload

answered on 21 Dec 2012