Questions on UI for ASP.NET AJAX Forum

1 answer

92 views

What is the recommended technique to filter out HTML paste when it contains <form> tag? It's conflicting with the way submit is working. The editor supports HTML paste.

http://www.telerik.com/help/aspnet-ajax/editor-onclientpastehtml.html

Editor

answered on 22 Aug 2011

5 answers

176 views

Suppressing command item in a self-referencing hierarchical radgrid

I have a self-referencing hierarchical grid set up. I need to have insert functionality available for any hierarchical level. When a row is expanded to show the children records I need to hide the non selected parent records and disable the selected parent. This is working correctly. The issue I need guideance on is that I also need to suppress the option to insert a row into the parent's hierarchical level if a child is open. Otherwise, at each level of hierarchy there is an option to insert a record which is confusing to the users since we are hiding the rows for that hierarchical level. I'm sure looking at the code could make this a little more clear . . .

This is a simple self-refrencing hierarchical grid with automatic inserts enabled:

<telerik:RadGrid ID="RadGrid1" runat="server" Skin="Web20"

OnItemCreated="RadGrid1_ItemCreated"

OnItemDataBound="RadGrid1_ItemDataBound" OnColumnCreated="RadGrid1_ColumnCreated"

AutoGenerateColumns="False" ShowStatusBar="True"

CellSpacing="0" GridLines="None" AllowAutomaticInserts="True">

<HeaderContextMenu CssClass="GridContextMenu GridContextMenu_Default"></HeaderContextMenu>

<MasterTableView DataKeyNames="CATEGORY_CDE, PARENT_CDE" ShowHeader="true"

HierarchyDefaultExpanded="false" AllowSorting="true"

CommandItemDisplay="Bottom" editmode="InPlace" InsertItemDisplay="Bottom">

<SelfHierarchySettings KeyName="CATEGORY_CDE" ParentKeyName="PARENT_CDE" />

<CommandItemSettings ExportToPdfText="Export to PDF"

AddNewRecordText="Add New Category"></CommandItemSettings>

<Columns>

<telerik:GridExpandColumn FilterControlAltText="Filter ExpandColumn column"

Visible="True">

</telerik:GridExpandColumn>

<telerik:GridEditCommandColumn UniqueName="UpdateColumn"

FilterControlAltText="Filter EditCommandColumn column" Visible="True"

EditText="" InsertText=""

CancelText="" ButtonType="ImageButton" EditImageUrl="../images/blank.gif">

</telerik:GridEditCommandColumn>

<telerik:GridBoundColumn DataField="Category_Cde" UniqueName="Category_Cde" Visible="true">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="Parent_cde" UniqueName="Parent_cde" Visible="true">

</telerik:GridBoundColumn>

</Columns>

<CommandItemSettings ExportToPdfText="Export to PDF"></CommandItemSettings>

<RowIndicatorColumn FilterControlAltText="Filter RowIndicator column">

<HeaderStyle Width="20px"></HeaderStyle>

</RowIndicatorColumn>

<ExpandCollapseColumn FilterControlAltText="Filter ExpandColumn column"

Visible="True">

<HeaderStyle Width="20px"></HeaderStyle>

</ExpandCollapseColumn>

<EditFormSettings>

<EditColumn FilterControlAltText="Filter EditCommandColumn column"></EditColumn>

</EditFormSettings>

</MasterTableView>

<ClientSettings AllowExpandCollapse="true" />

<FilterMenu EnableImageSprites="False"></FilterMenu>

</telerik:RadGrid>

Here is the ItemCommand which is suppressing the non selected hierarchical rows. There is a block of noted out code in the middle of this which shows a couple of things I have tried without success.

Protected Sub RadGrid1_ItemCommand(ByVal sender As Object, ByVal e As Telerik.Web.UI.GridCommandEventArgs) Handles RadGrid1.ItemCommand

Dim itemKey As String

'Inactivates non selected hierarchy levels

If (e.CommandName = RadGrid.ExpandCollapseCommandName) Then

Dim currentItem As GridDataItem = DirectCast(e.Item, GridDataItem)

Dim currentRowIndex As Integer = currentItem.ItemIndex

Dim currentCatKey As String = currentItem.GetDataKeyValue("CATEGORY_CDE").ToString()

Dim currentParentKey As String = currentItem.GetDataKeyValue("PARENT_CDE").ToString()

If (Not currentItem.Expanded) Then

'If an item is expanded then hide the other rows at that level

For Each ditem As GridDataItem In RadGrid1.Items

itemKey = ditem.GetDataKeyValue("PARENT_CDE").ToString()

If currentRowIndex <> ditem.ItemIndex And currentParentKey = ditem.GetDataKeyValue("PARENT_CDE").ToString() Then

'Trying to find the right way to suppress the option to add categories for unopened levels

'RadGrid1.MasterTableView.CommandItemSettings.ShowAddNewRecordButton = False

'RadGrid1.MasterTableView.CommandItemSettings.ShowRefreshButton = False

' RadGrid1.MasterTableView.CommandItemDisplay = GridCommandItemDisplay.None

'RadGrid1.AllowAutomaticInserts = False

'Enables the fields for the row

EnableDisableItem(ditem, True

)

                           ditem.Visible = False

Else

'Disables the fields for the row

EnableDisableItem(ditem, False)

End If

Next

Else

For Each ditem As GridDataItem In RadGrid1.Items

itemKey = ditem.GetDataKeyValue("PARENT_CDE").ToString()

If currentParentKey = ditem.GetDataKeyValue("PARENT_CDE").ToString() Then

ditem.Visible = True

'Enables fields for row

EnableDisableItem(ditem, True)

End If

Next

End If

If (e.CommandName = "PerformInsert") Then

e.Canceled = True

Dim dgi As GridDataInsertItem = TryCast(e.Item, GridDataInsertItem)

updateCategory("AddCat", dgi)

RadGrid1.EditIndexes.Clear()

RadGrid1.Rebind()

End If

rbtnSave.Visible = True

End Sub

Please let me know if there is a way to do this. My next step was going to be to throw out the self-referencing and add detail tables for each level of hierarchy, but that seems down right silly.

Thanks,
Casey

Grid

answered on 22 Aug 2011

1 answer

121 views

[Solved] Enabling AutoPostBackOnFilter causes loading panel to display non-modal

Hello. I'm noticing that when I set the AutoPostBackOnFilter=true for a column that filtering on that column by pressing the enter key causes display of a non-modal loading panel. The two cases I have observed are:

Case 1 - Incorrect modal behavior when ShowFilterIcon="false" and AutoPostBackOnFilter="true"
Case 2 - Correct modal behavior when ShowFilterIcon="true" and AutoPostBackOnFilter="true"

I am using ASP.NET AJAX controls version 2011.1.519.40 and observed this behavior on the following browsers:

IE 9
Firefox 5.0
Chrome 13.0.782.112 m
Safari 5.0.5

Below is markup, code-behind and a sample data item class that demonstrates the problem. Thank you.

Markup

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_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>When AutoPostBackOnFilter is on Loading Panel is not modal</title>

</head>

<body>

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

<telerik:RadScriptManager ID="scriptManager" runat="server">

</telerik:RadScriptManager>

<telerik:RadAjaxManager ID="ajaxManager" runat="server" DefaultLoadingPanelID="loading">

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="grid">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="grid" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<telerik:RadAjaxLoadingPanel ID="loading" runat="server" Skin="Windows7" Transparency="1">

</telerik:RadAjaxLoadingPanel>

<p>

The setting of ShowFilterIcon along with AutoPostBackOnFilter for grid columns causes inconsistent

behavior of the loading panel modality.

<ul>

<li>

Case 1 - Incorrect modal behavior when ShowFilterIcon="false" and AutoPostBackOnFilter="true"

</li>

<li>

Case 2 - Correct modal behavior when ShowFilterIcon="true" and AutoPostBackOnFilter="true"

</li>

</ul>

</p>

<p>

To have time to observe the behavior, long filter times are simulated by Thread.Sleep() - about 5 seconds - in

code behind.

<br />

<h4>Steps to reproduce the incorrect behavior:</h4>

<ol>

<li>

Enter filter text in the 'Case 1' column.

</li>

<li>

Press enter.

</li>

<li>

Using mouse, click anywhere on the grid. Note that the filter textbox will also recieve focus if clicked.

</li>

<li>

Observe the loading panel disappears, and after 5 or so seconds, the filter operation finishes successfully.

</li>

</ol>

<h4>Steps to observe the correct behavior:</h4>

<ol>

<li>

Enter filter text in the 'Case 2' column

</li>

<li>

Click the filter button.

</li>

<li>

Using mouse, click anywhere on the grid or the filter textbox.

</li>

<li>

Observe the loading panel is modal and does not disappear until completion of the filter process.

</li>

</ol>

</p>

<br />

<telerik:RadGrid ID="grid" runat="server" AllowFilteringByColumn="True" AutoGenerateColumns="False"

AllowPaging="True" Skin="Windows7" OnNeedDataSource="grid_NeedDataSource">

<MasterTableView>

<Columns>

<telerik:GridBoundColumn DataField="Id" UniqueName="Id" AllowFiltering="false" HeaderText="Id"/>

<telerik:GridBoundColumn DataField="Name" UniqueName="Name" ShowFilterIcon="false"

AutoPostBackOnFilter="true" CurrentFilterFunction="Contains"

HeaderText="Case 1 - Incorrect - Loading panel will not be modal when filtering on this column by pressing the enter key">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="Title" UniqueName="Title" ShowFilterIcon="true"

AutoPostBackOnFilter="true" CurrentFilterFunction="Contains"

HeaderText="Case 2 - Correct - Loading panel will still be modal when filtering on this column by clicking the filter button">

</telerik:GridBoundColumn>

</Columns>

</MasterTableView>

</telerik:RadGrid>

</form>

</body>

</html>

Code-behind

using System;

using System.Linq;

using System.Collections.Generic;

using System.Threading;

using Telerik.Web.UI;

public partial class _Default : System.Web.UI.Page

{

protected void Page_Load(object sender, EventArgs e)

{

Thread.Sleep(3000);

if (!this.IsPostBack)

{

this.BuildData();

}

protected void grid_NeedDataSource(object sender, GridNeedDataSourceEventArgs e)

{

this.grid.DataSource = this.Data;

}

private List<SampleDataItem> Data

{

get

{

return (List<SampleDataItem>)this.ViewState["Data"];

}

set

{

this.ViewState["Data"] = value;

}

private void BuildData()

{

var query =

from i

in Enumerable.Range(1, 10000)

select new SampleDataItem()

{

Id = i,

Name = Guid.NewGuid().ToString(),

Title = Guid.NewGuid().ToString()

};

this.Data = query.ToList();

}

App_Code sample data item class

using System;

[Serializable]

public class SampleDataItem

{

public SampleDataItem()

{

}

public long Id

{

get;

set;

}

public string Name

{

get;

set;

}

public string Title

{

get;

set;

}

Grid

answered on 22 Aug 2011

2 answers

170 views

External javascript file problem

Hello,

I have a problem in using a javascript function which is intended to close a radwindow control.
If I set the javascript directly into the page (see the following code), then the radwindow will be closed by clicking the Close button, but if I set the javascript code in into an external javascript file then I will get a web page error "Error: The value of the property 'Close' is null or undefined, not a Function object".

Here is my page code when the javascript is included into the head ContentPlaceHolder:

<%@ Page Title="<%$ Resources:RLResource, PagesRWForgottenPasswordTitle %>" Language="C#" MasterPageFile="~/Common/MasterPages/BaseMasterPage.master" AutoEventWireup="true" CodeFile="rwForgottenPassword.aspx.cs" Inherits="GeneralNS.RL_Pages_rwForgottenPassword" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">

<script type="text/javascript">

//Get RadWindow

function GetRadWindow() {

var oWindow = null;

if (window.radWindow)

oWindow = window.radWindow;

else if (window.frameElement.radWindow)

oWindow = window.frameElement.radWindow;

return oWindow;

}

//Close RadWindow

function Close() {

GetRadWindow().Close();

}

</script>

</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">

<asp:Panel ID="TopCloseLinkButtonPanel" runat="server" HorizontalAlign="<%$ Resources:RLResource, NoContentFloat %>" >

<asp:Label ID="excuteWindowClose" runat="server" Width="410px"></asp:Label>

<asp:LinkButton ID="TopCloseLinkButton" runat="server" Text="<%$ Resources:RLResource, PagesRWForgottenPasswordTopCloseLinkButton %>" OnClick="CloseLinkButton_Click" ></asp:LinkButton>

</asp:Panel>

</asp:Content>

c# code:

using System;

using System.Web.UI;

using System.Web.UI.WebControls;

using Telerik.Web.UI;

using System.Linq;

using System.Xml;

using System.Xml.Linq;

namespace GeneralNS

{

public partial class RL_Pages_rwForgottenPassword : BasePage

{

protected void Page_Load(object sender, EventArgs e)

{

}

//Close the forgotten password radwindow

protected void CloseLinkButton_Click(object sender, EventArgs e)

{

excuteWindowClose.Text = "<script type='text/javascript'>Close();</" + "script>";

}

Here is head ContentPlaceHolder content when the javascript is included into an external javascript file:

<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">

<script src="http://localhost:53965/abcde.com/Common/Design/Javascript/General.js" type="text/javascript"></script>

</asp:Content>

Note: the javascript code which is apears in the first code block (above) is exists in the General.js file.

Please, I need your help in order to solve the above problem and to able to set radwindow javascript code into an external file.
It is very appreciated to send me the modified code.

Regards,
Bader

Window

answered on 22 Aug 2011

1 answer

83 views

Disable drag on row by row basis

I have AllowRowsDragDrop enabled on my grid, but have the need to disable it on a row by row basis
in my Grid I have a GridCheckBoxColumn

<

telerik:GridCheckBoxColumn DataField="IsChildDictionary" Visible="false" UniqueName="IsChildDictionary" DataType="System.Boolean" AllowFiltering="false">

on the basis of this checkbox state I want to disable darg and drop feature of row please suggest me how can I check the state of this checkbox ?

I want to use this condition in below function to disable drag and drop feature on row

function OnRowDragStarted(sender, eventArgs)

{

}

Grid

answered on 22 Aug 2011

9 answers

747 views

RadWindow close on server side

I have a page with a RadWindow. The page that loads in the radwindow is a login form. Basically when teh Login button is pressed an integer is returned based on if the credentials are successfull or not. If the integer is 0, it simply lets them know they have the wrong password, this is already setup and works. However if the returned integer is 1, i want it to close the radwindow, run some serverside code based on a value passed from the RadWindow (ie the Users primary key) and redirect the parent page to another page. Here is my server side code for the login page:

    
            protected void submitbutton_Click(object sender, EventArgs e) 
        
                { 
        
                    //checks credentials, returns 1 or 0 
        
                    int authStatus = Authentication.AuthenticateEmployee(txtUsername.Text.Trim(), 
        
                        Encryption.encryptStringSHA256(txtPassword.Text.Trim())); 
        
                    switch (authStatus) 
        
                    { 
        
                        case 0: 
        
                            lblStatus.Text = "code0: Your user does not have access"; 
        
                            break; 
        
                        case 1: 
        
                            lblStatus.Text = "code1: Successfull"; 
        
                            //here i want it to close the radwindow and run some server side code. 
        
                            break; 
        
                    } 
        
                }

I know how to pass values from the radwindow to the parent page, but I'm not sure how to access those values server side.

Window

answered on 22 Aug 2011

1 answer

497 views

[Solved] Changing RadAlert icons based on success/failure alert.

Hi Telerik,

I have the following code:

function SaveDashboard(pane, eventArgs) {

loadingPanel = $find(radAjaxLoadingPanel1ID);

loadingPanel.show(baseSplitterID);

eventArgs.set_cancel(true);

window.PageMethods.SaveToDatabase(

function (result) {

if (result == true) {

window.radalert('Dashboard saved successfully.', 275, 100, "Save Successful");

}

else {

window.radalert('Dashboard NOT saved successfully.', 240, 100, "Save Unsuccessful");

}

loadingPanel.hide(baseSplitterID);

});

}

I would like to display icons indicative of success/failure. That is, changing the titlebar LHS icon and the LHS icon in the body of the window. Do I need to use a full radwindow to do this?

Window

answered on 22 Aug 2011

5 answers

111 views

AdvancedInsertTemplate not closing after button click

I am having problems closing AdvancedInsertTemplate after users click on Insert button. I can use a redirect but that would not be the best solution. Here is what happens:

Users go to Scheduler page
In code-behind I bind the scheduler to the dataset using BindScheduler() subroutine
When users double-click on the timeslot the AdvancedInsertTemplate opens up with our custom Insert Appointment form
The AdvancedInsertTemplate from as 2 buttons: Create (CommandName: Insert) and Cancel (CommandName: Cancel)
After users enter the appointment details and click Create button a radSchedule1_AppointmentCommand is fired and data is saved into the DB. After save I fire BindScheduler() again in order to bind the newly updated data.
At this point I need to close the modal AdvancedInsertTemplate but it does not close

What is the solution to this issue? thanks

Scheduler

answered on 22 Aug 2011

2 answers

261 views

forcing refresh of uploaded content

I am using the AsyncUpload control to upload an employee picture to a telerik AJAX Manager enabled website. The <ASP:IMAGE> tag that displays the picture is embedded in a Telerik Rad Ajax Loading Panel.

When I upload the picture (to the temporary folder) and then click the page submit button, the employee picture is correctly saved to the temporary folder and then moved to the target folder.

As people can potentially upload pictures with the same filename, they can clobber each other's previously uploaded files inside the target folder. I've added logic in the server side submit button handler to rename each uploaded targetfolder file so that it is always unique to a particular employee. Each employee will end up retaining this filename as it is based on a formula that uses an employee number, even for future subsequent uploads. At the end of the submit button handler, I repopulate the screen controls.

If I upload two different pictures for the same screen without leaving it, the first upload renders the picture. On the second upload, the picture doesn't change even though its content and timestamp HAS changed in the target folder. The reason it doesn't refresh on the second upload is that the <ASP:IMAGE> tag is using the same filename it had from the first upload. The ajax mechanism doing the background postback isn't telling something (internet explorer?) to reload the image from the targetfolder.

How do I get the uploaded file to be marked as being dirty so that a refresh on the <ASP:IMAGE> tag is forced?

protected void btnSave_Click(object sender, EventArgs e)

{

System.String result = "OK";

System.String strUploadedFileName = "";

System.String strUploadedFileExtension = "";

System.String strNewEmployeePhotoName = "";

System.String strEmployeePicturesPath = "";

try

{

System.String strCoordinatorID = lblCoordinatorID.Text.Trim();

if (strCoordinatorID != "")

{

EmployeeInfo coordinator = EmployeeInfo.GetEntity(strCoordinatorID);

if (upldPicture.UploadedFiles.Count>0)

{

strEmployeePicturesPath = getMappedFolderPathTo("EmployeePictures");

strUploadedFileName = upldPicture.UploadedFiles[0].FileName; //file is located in targetfolder at this point

strUploadedFileExtension = upldPicture.UploadedFiles[0].GetExtension();

strNewEmployeePhotoName = "COORDINATOR_" + strCoordinatorID + strUploadedFileExtension;

//rename the file so that it can't be clobbered by someone else uploading another file with same name

if (File.Exists(@strEmployeePicturesPath + strNewEmployeePhotoName) == true)

{

File.Delete(@strEmployeePicturesPath + strNewEmployeePhotoName); //delete any leftover picture

}

File.Move(@strEmployeePicturesPath + strUploadedFileName, @strEmployeePicturesPath + strNewEmployeePhotoName); //do a move incase the source is still open

File.Delete(@strEmployeePicturesPath + strUploadedFileName); //delete the original file that was uploaded

}

if (coordinator != null)

{ //update existing coordinator

if (strNewEmployeePhotoName!="")

{

coordinator.employeePhotoFileName = strNewEmployeePhotoName;

}

EmployeeInfo.Update(coordinator);

}

else

{

//its a new coordinator so add it

}

result = LoadCoordinator(ref coordinator, userpage.editor); //refresh the page

}//strCoordinatorID != ""

}

catch (Exception ex)

{

System.Object oe = (Object)ex;

result = "btnSave_Click: " + et.rptError(ref oe);

}//try

lblMsg.Text = result;

}//EOF btnSave_Click

AsyncUpload

answered on 22 Aug 2011

5 answers

151 views

rad window is still in memory while I close it using title bars close button.

Hi,
In my aspx page , I have more than 2 Rad windows.

1. we have a radWindow that opens as a popup window.
2. This popup radWindow has a close button in title bar.
3. Even after the user closes this window using titlebars close button & opens another popup radwindow from altogether different link, the popup opens earlier(First) radwindow instead of opening second radwindow.

This is causing lot of problems.
Please advise how to fix this issue.

Window

answered on 22 Aug 2011