Questions on UI for ASP.NET AJAX Forum

11 answers

1.0K+ views

Hi,

Having got so far with my master page and individual RadAjaxManager controls on my content pages, I am now trying to put in the RadAjaxManagerProxy to tidy up the pages and have come across an issue.

I add the RadAjaxManager to the master page with no settings, but add on the AjaxRequest event handler. On the individual content pages, I add a RadAjaxManagerProxy. On the content pages, I need to instantiate client-side ajax requests which will call an AjaxRequest handler on the content page. With the current solution, the AjaxRequest handler on the master page is called.

How can I achieve this?

Thanks.

Ajax

answered on 27 Apr 2009

2 answers

138 views

[Solved] DateTimePicker Theme problem

Hi All,

I've got a form with some RadDateTimePicker controls. None of them respect the page's Theme (Set in Page PreInit) as Theme = "Black" - they all end up looking like the default theme, this affects the text box and the icons. Everything else on the page works fine.

I've replicated with the code shown below. Note that with the code below you need Theme = "Black" in the PreInit as I am not setting controls manually. Also note that the DatePicker works properly but the TimePicker fails as per the DateTimePicker.

I assume that this is being caused by a bug - is it due for a fix anytime soon. I'd prefer not to have a workaround put in place if it will be fixed in an upcoming release.

Regards,

Jon

    
                <telerik:RadDateTimePicker ID="RadDateTimePicker1" Runat="server" Culture="English (United Kingdom)">  
        
                    <TimePopupButton ImageUrl="" HoverImageUrl=""></TimePopupButton> 
        
                    <TimeView CellSpacing="-1" Culture="English (United Kingdom)"></TimeView> 
        
                    <Calendar UseRowHeadersAsSelectors="False" UseColumnHeadersAsSelectors="False" ViewSelectorText="x"></Calendar> 
        
                    <DatePopupButton ImageUrl="" HoverImageUrl=""></DatePopupButton> 
        
                </telerik:RadDateTimePicker> 
        
                <telerik:RadTextBox ID="RadTextBox1" Runat="server">  
        
                </telerik:RadTextBox> 
        
                <telerik:RadTimePicker ID="RadTimePicker1" Runat="server">  
        
                </telerik:RadTimePicker> 
        
                <telerik:RadDatePicker ID="RadDatePicker1" Runat="server">  
        
                </telerik:RadDatePicker> 
        
                <telerik:RadFormDecorator ID="RadFormDecorator1" Runat="server" DecoratedControls="All" />

Calendar

answered on 27 Apr 2009

1 answer

122 views

[Solved] Printing the contents of a panel

Hello All:

I have a menu that has the menu item of File | Print ... how do I invoke the windows print dialog so that I can print the contents of a RadPane? I searched the site and it appears that all of the example links that I found are broken.

I'm using the .NET Framework 3.5 and controls 2009.1.402.35.

Any help would be greatly appreciated.

Regards,

Ryan Kirby

General Discussions

answered on 27 Apr 2009

1 answer

95 views

grouping content

Hi,

I have been working with TabStrip 2008 Q3 till few days ago. Now we are implementing our application for 2009 Q1.

Previously I was grouping content of each tab inside a table created by me. I give a static value to the height of this table, depending of the maximum height it may take.

Is it possible or does tabstrip 2009 make possible to group the content of each tab automatically?

Thank you.

TabStrip

answered on 27 Apr 2009

3 answers

368 views

RadGrid row selected parameters passed to a RadWindow

I allow my users to select one or more rows from my grid and drag them to an html element. The html element recognizes the drag and drop of rows, but I an not able to figure out how to determine which rows were selected to pass the row identifiers to the radwindwow for processing. Thoughts?

function

onRowDropping(sender, args) {

var node = args.get_destinationHtmlElement();

if (isChildOf('outSend', node)) {

if (confirm("Would you like to proof your message and send out these ...?")) {

args.set_destinationHtmlElement($get(

'outSend'));var CRS = args.get_owner().get_gridDataItem().get_dataItem()["CrsID"]

var oManager = GetRadWindowManager();

var CrsID = 7499; // I am passing an ID to radwindow and this works fine, but actually need to collect this from the radgrid

oManager.open(

"../user/outsend.aspx?IDS=" + CrsID, "RadW1");

}

else

args.set_cancel(

true);

}

<telerik:RadGrid ID="courseContent" runat="server" Width="273" ItemStyle-Wrap="true"

Height="300" AllowMultiRowSelection="true" AllowMultiRowEdit="true" gridlines="None"

Skin="WebBlue" OnNeedDataSource="courseContent_NeedDataSource" AllowAutomaticDeletes="true" OnDeleteCommand="courseContent_DeleteCommand">

<MasterTableView DataKeyNames="CrsID" CommandItemDisplay="None" HorizontalAlign="Center"

HeaderStyle-BorderWidth="0" ItemStyle-BorderWidth="0" FooterStyle-BorderWidth="0"

AutoGenerateColumns="False" Width="100%" BorderWidth="0">

<telerik:GridBoundColumn UniqueName="crsid" datafield="crsid" Visible="false"></telerik:GridBoundColumn>

<telerik:GridTemplateColumn HeaderStyle-Font-Size="8" HeaderText="Current Student Profile Contents" UniqueName="crsNumber">

<asp:Label ID="lblCourseNumber" ForeColor="#333333" Font-Names="arial" Font-Size="9" Text='<%# Databinder.Eval(Container.DataItem,"crsnumber")%>'

Width="225px" runat="server" BorderWidth="0">

</asp:Label>

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridButtonColumn ButtonType="ImageButton" ImageUrl="../skins/webblue/grid/cancel.gif"

CommandName="Delete" ConfirmText="Are you sure you want to delete the selected row?">

</telerik:GridButtonColumn>

</Columns>

</MasterTableView>

</ClientSettings>

</telerik:RadGrid>

Grid

answered on 27 Apr 2009

1 answer

102 views

Exporting to PDF - Page Orientation per Master and Detail table

Hi All,

Going thru the forums has yielded a lot of help..thanks!

I have a 2 pager to export,
Page one is portrait, (Master Table View)
Page 2 (detail table) has to be landscape, because of the number of cols in it

the code i have gotten so far is

RadGrid1.ExportSettings.Pdf.PageHeight =

Unit.Parse( "162mm" );

RadGrid1.ExportSettings.Pdf.PageWidth =

Unit.Parse( "600mm" );

which of course exports the lot in Landscape.
How (if possible) do I do so??

TIA
Neal

Grid

answered on 27 Apr 2009

3 answers

258 views

RadGrid - Fileupload in using Popup

Hi,

I have attached the sample application which display icons from the database on RadGrid

I have attached the sample web pages to simulate the functionality.

Approach 1
--------------

I use the asp:FileUpload placed in the <EditItemTemplate>
This approach works fine, i.e. when I upload the new Image the grid is displays the new image

Approach 2
--------------
I have the asp:ImageButton placed in telerik:GridTemplateColumn when the button is clicked it opens a popup, you can then select the file you wish to upload. I close the popup and refresh the grid, but it does not show the new uploaded image.

When I refresh the page, I can see the new uploaded Icon in the Grid.

Can you look in the code and find out why the RadGrid would not show the proper icon image, when I upload the new image via the popup functionaliy?

Sample Code
------------------

Default.aspx

<%@ 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">

<title>Untitled Page</title>

<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">

function refreshGrid(arg)

{

var ajaxManager = $find("<%= RadAjaxManager.GetCurrent(Page).ClientID %>");

if(arg== 'false')

{

ajaxManager.ajaxRequest("RebindAndNavigate");

}

else

{

ajaxManager.ajaxRequest("Rebind");

}

function openUpdateIconWindow(rowId)

{

oWnd= radopen('<%=Page.ResolveUrl(@"~/UploadTest/UploadIcon.aspx?ParentUrl=RadWindow&UploadIconTo=AuditRatingConfig")%>&IconID=' + rowId ,"AttachWindow");

oWnd.SetSize(350,307);

}

</script>

</telerik:RadCodeBlock>

</head>

<body>

<div>

<asp:ScriptManager runat="server" ID="scriptManager1"> </asp:ScriptManager>

 <telerik:RadGrid DataSourceID="SqlDataSource1" ID="RadGrid1" runat="server" OnItemDataBound="RadGrid1_ItemDataBound" OnItemCommand="RadGrid1_ItemCommand">

<telerik:GridEditCommandColumn>

</telerik:GridEditCommandColumn>

<telerik:GridBoundColumn

ReadOnly="true"

DataField="ConfigId"

HeaderText="ConfigId"

UniqueName="ConfigId">

</telerik:GridBoundColumn>

<telerik:GridTemplateColumn

HeaderText="Image"

UniqueName="Image">

<asp:Image ID="Image1" runat="server" />

</ItemTemplate>

<asp:FileUpload ID="FileUpload1" runat="server" />

</EditItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn UniqueName="UploadIcon" CurrentFilterFunction="NoFilter"

FilterListOptions="VaryByDataType" ForceExtractValue="None">

<asp:ImageButton ID="imgUploadIcon" runat="server"

ImageUrl="~/images/btn_attach.gif" ToolTip="Upload Icon"

CommandArgument='<%# Eval("ConfigId") %>' />

</ItemTemplate>

</telerik:GridTemplateColumn>

</Columns>

</MasterTableView>

</telerik:RadGrid>

<asp:SqlDataSource

ID="SqlDataSource1"

runat="server"

ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"

SelectCommand="SELECT [ConfigId], [Icon] FROM [TBL_AuditRatingConfig]">

</asp:SqlDataSource>

</div>

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

<telerik:AjaxSetting AjaxControlID="gridScoring">

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

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Height="75px" Width="75px" Transparency="25">

<asp:Image ID="Image1" runat="server" AlternateText="Loading..." ImageUrl="~/RadControls/Ajax/Skins/Default/Loading.gif" />

</telerik:RadAjaxLoadingPanel>

<telerik:RadWindowManager ID="windowManager" runat="server" Skin="Vista"

Behaviors="Close, Move" Height = "700px" Width="900px" >

<telerik:RadWindow ID="RadWindow1"

Skin="Vista"

VisibleOnPageLoad = "false"

Height="517px" Width="650px" VisibleStatusBar="false"

Title="Emex"

runat="server"></telerik:RadWindow>

</Windows>

{1}

</div>

<div>

<a onclick="$find('{0}').callBack('false');"

class="radwindowbutton" href="javascript:void(0);"><span class="outerspan"><span

class="innerspan">No</span></span></a>

</div>

</ConfirmTemplate>

</telerik:RadWindowManager>

</form>

</body>

</html>

Default.aspx.cs

using System;

using System.Data;

using System.Configuration;

using System.Web;

using System.Web.Security;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Web.UI.WebControls.WebParts;

using System.Web.UI.HtmlControls;

using System.Data.SqlClient;

using Telerik.Web.UI;

using System.IO;

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

{

protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e)

{

if (e.Item is GridDataItem)

{

GridDataItem gridDataItem = (GridDataItem)e.Item;

System.Web.UI.WebControls.Image image =

(System.Web.UI.WebControls.Image)gridDataItem["Image"].FindControl("Image1");

image.ImageUrl = "Image.aspx?EmployeeID=" + gridDataItem["ConfigId"].Text;

ImageButton imgUploadIcon = (ImageButton)gridDataItem["UploadIcon"].FindControl("imgUploadIcon");

imgUploadIcon.OnClientClick = "openUpdateIconWindow('" + imgUploadIcon.CommandArgument + "'); return false;";

}

protected void RadGrid1_ItemCommand(object source, GridCommandEventArgs e)

{

SqlConnection connection = new

SqlConnection(ConfigurationManager.ConnectionStrings["NorthwindConnectionString"].ConnectionString);

SqlCommand cmd = new SqlCommand();

if (e.CommandName == "Update")

{

String employeeID =

RadGrid1.MasterTableView.DataKeyValues[e.Item.ItemIndex]["ConfigId"].ToString();

cmd.CommandText =

String.Format("UPDATE TBL_AuditRatingConfig SET Icon=@Photo WHERE ConfigId='{0}'", employeeID);

}

else if (e.CommandName == "PerformInsert")

{

cmd.CommandText =

"INSERT INTO [Employees] ([LastName], [FirstName], [Title], [HireDate], [Address], [Photo]) VALUES (@LastName, @FirstName, @Title, @HireDate, @Address, @Photo)";

cmd.Parameters.AddWithValue("@LastName", "tLN");

cmd.Parameters.AddWithValue("@FirstName", "tFN");

cmd.Parameters.AddWithValue("@Title", "tT");

cmd.Parameters.AddWithValue("@HireDate", DateTime.Now);

cmd.Parameters.AddWithValue("@Address", "tA");

}

else

{

return;

}

cmd.Connection = connection;

GridEditFormItem gridEditFormItem = (GridEditFormItem)e.Item;

FileUpload FileUpload1 = (FileUpload)gridEditFormItem["Image"].FindControl("FileUpload1");

if (FileUpload1.HasFile)

{

int _imageSize;

string _imageType;

int len = FileUpload1.PostedFile.ContentLength;

byte[] pic = new byte[len + 78];

FileUpload1.PostedFile.InputStream.Read(pic, 78, len);

try

{

connection.Open();

cmd.Parameters.AddWithValue("@Photo", pic);

cmd.ExecuteNonQuery();

}

finally

{

connection.Close();

}

else

{

e.Canceled = true;

}

protected void RadAjaxManager1_OnAjaxRequest(object sender, AjaxRequestEventArgs e)

{

if (e.Argument == "Rebind" || e.Argument == "RebindAndNavigate")

{

RadGrid1.Rebind();

}

Image.aspx

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

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<title>Untitled Page</title>

</head>

<body>

<div>

</div>

</form>

</body>

</html>

Image.aspx.cs

using System;

using System.Data;

using System.Configuration;

using System.Collections;

using System.Web;

using System.Web.Security;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Web.UI.WebControls.WebParts;

using System.Web.UI.HtmlControls;

using System.IO;

using System.Data.SqlClient;

using System.Drawing;

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

{

protected void Page_Load(object sender, EventArgs e)

{

if (this.Page.Request.QueryString["EmployeeID"] != null)

{

String employeeID = (String)this.Page.Request.QueryString["EmployeeID"];

MemoryStream stream = new MemoryStream();

SqlConnection connection = new

SqlConnection(ConfigurationManager.ConnectionStrings["NorthwindConnectionString"].ConnectionString);

try

{

connection.Open();

SqlCommand command = new

SqlCommand("SELECT Icon FROM TBL_AuditRatingConfig WHERE (ConfigId='" + employeeID + "')", connection);

byte[] img = (byte[])command.ExecuteScalar();

MemoryStream ms = new MemoryStream();

int offset = 78;

ms.Write(img, offset, img.Length - offset);

Bitmap bmp = new Bitmap(ms);

Response.ContentType = "image/gif";

bmp.Save(Response.OutputStream, System.Drawing.Imaging.ImageFormat.Gif);

ms.Close();

}

finally

{

connection.Close();

stream.Close();

}

UploadIcon.aspx

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

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

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

<title>Untitled Page</title>

<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">

function CloseAndRebind(args)

{

GetRadWindow().Close();

GetRadWindow().BrowserWindow.refreshGrid(args);

}

function GetRadWindow()

{

var oWindow = null;

if (window.radWindow) oWindow = window.radWindow; //Will work in Moz in all cases, including clasic dialog

else if (window.frameElement.radWindow) oWindow = window.frameElement.radWindow;//IE (and Moz as well)

return oWindow;

}

function CancelUpload()

{

GetRadWindow().Close();

}

</script>

</telerik:RadCodeBlock>

</head>

<body>

<div>

<asp:Label Font-Size="8" runat="server" ID="fileLabel" Text="Icon : "></asp:Label>

</div>

<asp:FileUpload runat="server" ID="iconUpload" /> 

<br />

</div>

<asp:LinkButton ID="buttonCancel" CssClass="form_btn_sml btn_cancel" CommandName="Close" Text="<span><b>close</b></span>" runat="server" OnClick="buttonCancel_Click" />

<asp:LinkButton ID="buttonSave" CssClass="form_btn_sml btn_add" CommandName="Upload" Text="<span><b>upload</b></span>" runat="server" OnClick="buttonSave_Click" />

</div>

</form>

</body>

</html>

UploadIcon.aspx.cs

using System;

using System.Data;

using System.Configuration;

using System.Collections;

using System.Web;

using System.Web.Security;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Web.UI.WebControls.WebParts;

using System.Web.UI.HtmlControls;

using System.Data.SqlClient;

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

{

Guid? _iconId = null;

public Guid? IconID

{

get

{

if (Request.QueryString["IconID"] != null)

{

return new Guid(Request.QueryString["IconID"].ToString());

}

return null;

}

set

{

_iconId = value;

}

protected void Page_Load(object sender, EventArgs e)

{

}

protected void buttonCancel_Click(object sender, EventArgs e)

{

Page.ClientScript.RegisterStartupScript

(Page.GetType(), "mykeyCancelUpload", "CancelUpload();", true);

}

protected void buttonSave_Click(object sender, EventArgs e)

{

SqlConnection connection = new

SqlConnection(ConfigurationManager.ConnectionStrings["NorthwindConnectionString"].ConnectionString);

SqlCommand cmd = new SqlCommand();

cmd.Connection = connection;

cmd.CommandText =

String.Format("UPDATE TBL_AuditRatingConfig SET Icon=@Photo WHERE ConfigId='{0}'", IconID);

if (iconUpload.HasFile)

{

int _imageSize;

string _imageType;

int len = iconUpload.PostedFile.ContentLength;

byte[] pic = new byte[len + 78];

iconUpload.PostedFile.InputStream.Read(pic, 78, len);

try

{

connection.Open();

cmd.Parameters.AddWithValue("@Photo", pic);

cmd.ExecuteNonQuery();

}

finally

{

connection.Close();

Page.ClientScript.RegisterStartupScript

(Page.GetType(), "mykeyCloseAndRebind", "CloseAndRebind();", true);

}

Grid

answered on 27 Apr 2009

1 answer

64 views

DynamicData Error

Hi

I am trying to get the latest Telerik ASP.Net controls to work with a 3.5 SP1 dynamicdata site.

I am using the zip file DynamicData 2008 2 813 to add to the VS dynamicdata site.

I have this error Warning 17 Element 'DynamicFilter' is not a known element. This can occur if there is a compilation error in the Web site, or the web.config file is missing. C:\...\WebContent\DynamicData\PageTemplates\ListDetails.aspx 25 26 WebContent

This happens for the DynamicRadGrid as well.

Is there a version that I should be using that better matches the current Telerik controls?

Or am I just doing something wrong?

Thanks Paul

Grid

answered on 27 Apr 2009

3 answers

88 views

Can't insert second record

I set up a RedGrid to update existing and insert new records. I can insert the first new record but if I try to insert the second I don't even get to the form template. It just hangs on the 'Loading' image. The same thing happens if I edit a record and then try to insert a record. However I can edit one record after another without any issues. Any idea what I might be doing wrong?

Thanks

Grid

answered on 27 Apr 2009

1 answer

97 views

Two colour bar chart

Can you create a bar chart where the bar is coloured a different colour if it exceeds a specified value. e.g. The bars might normally be green but if the value is more than 10 the section above 10 is shown in red.

I can see that I could create two data series and then use a stacked bar chart but this requires a little manipulation of the data.

Andrew

Chart (Obsolete)

answered on 27 Apr 2009