Questions on UI for ASP.NET AJAX Forum

1 answer

80 views

Hello,

I am facing some issues with the FileExplorer control in IE8. I have a page where I have placed a FileExplorer control inside a pageview. Please note that the page contains RAD Ajaxmanager. I see the FileExplorer control with full functionality in Chrome, Firefox and Safari. However in IE8 it fails. Most of the buttons in the FileExplorer is not visible. Also the splitter is messed up.

Please suggest how to resolve the above issue.

Regards,
Asok

FileExplorer

answered on 11 Jul 2011

1 answer

72 views

HideEvent Suggestion

I looked around for quite some time and couldn't find a direct solution, however, I did find a workaround for my instance. Essentially, I feel like there is a need to add another option to the HideEvent attribute. There is a pretty common business requirement where users expect a tooltip to go away when they click outside the tooltip. If the tooltip could act the way HideEvent="ManualClose" does plus adding functionality where it hides when you click outside the tooltip on the body of the page, it would be great. I realize you could use LeaveTargetAndToolTip or LeaveToolTip with a delay to prevent it disappearing once you leave it but I am just presenting another case that could add value to the control.

Thanks,

Patrick Mallahan

ToolTip

answered on 11 Jul 2011

2 answers

172 views

Update code-behind controls in tooltip from RadToolTipManager

Hello,

I have a problem with the RadToolTipManager and ASP.NET Server Controls. The control which is loaded in the tooltip doesn’t update its label after the button click. I tested the same setup with an aspx page and a ascx user control, in this case everything works as expected.

Do you have any idea where I did something wrong? I used this example as a reference http://demos.telerik.com/aspnet-ajax/tooltip/examples/loadondemand/defaultcs.aspx. In the end, I would like to update the control on which the tooltip originated, but because the events in the tooltip itself don’t work, I haven’t tried that yet.

Thanks

Setup:

The Default.aspx file is nested within a master-page with a RadScriptManager, I used the Telerik.Web.UI.dll version 2011.1.519.35

Codes:
Default.aspx

<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"

CodeBehind="Default.aspx.cs" Inherits="AjaxTooltipRad._Default" %>

<%@ Register TagPrefix="tt" Assembly="AjaxTooltipRad" Namespace="AjaxTooltipRad.src" %>

<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">

<h2>

Tooltip Test

</h2>

<p><tt:GalleryControl runat="server" /></p>

</asp:Content>

GalleryControl.cs

using System;

using System.Web.UI;

using System.Web.UI.WebControls;

using Telerik.Web.UI;

namespace AjaxTooltipRad.src {

public class GalleryControl : Control, INamingContainer {

public const string RTTMID = "rttmid";

public const string IMGID = "imgid";

private RadToolTipManager rttm;

private Image img;

public GalleryControl() : base() {

rttm = new RadToolTipManager();

rttm.ID = RTTMID;

rttm.Position = ToolTipPosition.BottomCenter;

rttm.RelativeTo = ToolTipRelativeDisplay.Element;

rttm.Width = new Unit("300px");

rttm.Height = new Unit("200px");

rttm.HideEvent = ToolTipHideEvent.LeaveTargetAndToolTip;

rttm.AjaxUpdate += new ToolTipUpdateEventHandler(rttm_AjaxUpdate);

rttm.Skin = "Default";

rttm.RenderInPageRoot = true;

img = new Image();

img.ID = IMGID;

img.ImageUrl = "http://demos.telerik.com/aspnet-ajax/Img/Northwind/Products/Thumbs/25.jpg";

rttm.TargetControls.Add(img.ClientID,false);

}

private void rttm_AjaxUpdate(object sender, ToolTipUpdateEventArgs e) {

UpdateToolTip(e.UpdatePanel);

}

private void UpdateToolTip( UpdatePanel panel) {

ServerControlToolTip sctt = new ServerControlToolTip();

panel.ContentTemplateContainer.Controls.Add(sctt);

}

protected override void OnLoad(EventArgs e) {

base.OnLoad(e);

this.Controls.Add(rttm);

this.Controls.Add(img);

}

ServerControlToolTip.cs

using System;

using System.Web.UI;

using System.Web.UI.WebControls;

namespace AjaxTooltipRad.src {

public class ServerControlToolTip : Control, INamingContainer {

private const string textboxId = "textboxid";

private const string buttonId = "buttonid";

private const string labelId = "labelid";

private TextBox textBox;

private Button button;

private Label label;

public ServerControlToolTip() {

textBox = new TextBox();

textBox.ID = textboxId;

button = new Button();

button.Text = "click";

button.ID = buttonId;

button.Click += new EventHandler(button_Click);

label = new Label();

label.ID = labelId;

}

private void button_Click(object sender, EventArgs e) {

label.Text = textBox.Text;

}

protected override void OnLoad(EventArgs e) {

base.OnLoad(e);

this.Controls.Add(textBox);

this.Controls.Add(button);

this.Controls.Add(label);

}

ToolTip

answered on 11 Jul 2011

3 answers

56 views

Can you make the selected item of a TimeView object scrollIntoView

I have a RadTimePicker and I'm trying to get the SelectedDate to ScorllIntoView when the TimeView Popup is displayed.

Is this possible?

Here is a code snippet of what I'm working with:

<style type="text/css">

#<%= StartTime.ClientID %>_timeView_wrapper {

overflow:auto;

width:83px;

height:200px;

}

</style>

<telerik:RadTimePicker runat="server" ID="StartTime" CssClass="rsAdvTimePicker" Width="78px">

<dateinput id="DateInput3" runat="server" emptymessagestyle-cssclass="riError"

emptymessage=" " />

<timepopupbutton visible="false" />

<timeview id="TimeView1" runat="server" columns="1" showheader="false" starttime="00:00"

endtime="23:59" interval="00:30" />

</telerik:RadTimePicker>

Calendar

answered on 11 Jul 2011

13 answers

337 views

Bind controls in EditItemTemplate

I have controls in an HTML Table inside an EditItemTemplate of a RADGRID parent control that I need to bind to. I have attempted to bind to the grid and to individual controls unsuccessfully.

Grid

answered on 11 Jul 2011

2 answers

63 views

How could you replace the Column Headers with a Simple Caption?

I have a RadGrid with 2 columns, ID and Name. My MasterDetailTable shows Countries. and there is a nested table with exactly the same structure (ID and Name) and it shows the Cities.

The current behaviour is that I have all the columns appearing again for the nested table whereas I'd like to replace those columns with just a simple caption e.g. "Cities". The reason is that the ID and Name are already header texts of the MasterDetailTable.

I saw how to hide the header: http://demos.telerik.com/aspnet-ajax/grid/examples/client/scrolling/defaultcs.aspx

but how could I replace it with a simple caption?

TreeList: http://demos.telerik.com/aspnet-ajax/treelist/examples/firstlook/defaultcs.aspx also looks interesting and I may be able to use it but again I'd need a way to add Caption to the detail tables.

any help?

Thanks

Grid

answered on 11 Jul 2011

2 answers

166 views

DataItem in Databound Treeview

Hi,
Is there a way to retrieve the dataitem of the clicked node in a databound treeview? In the NodeClick event the e.Node.DataItem is null. I can only get the text.
Thanks for any ideas!
v

TreeView

answered on 11 Jul 2011

4 answers

129 views

Problem with exporting grid in loop

I have a sql-view which contains some simple data and also an column with an emailadres. When i click a button i want to send a mail to every distinct emailadres with an export of the view containing only the rows with that specific emailadres.

Everthing is going well except that the mails always get the same attachment! I guess it has something to do with the way I subcribe to the grid exporting event?

This is my code:

protected void rbTestMailVersturen_Click(object sender, EventArgs e) {

string query = "";

teller = 0;

SaveMailingForm();

RadGrid emailgrid = new RadGrid();

PlaceHolder1.Controls.Add(emailgrid);

//Fill a list with emailadresses

FillEmailadressen();

for (int i = 0; i < emailadressen.Count; i++) {

{

using (conn = new SqlConnection(ConnectionString)) {

conn.Open();

emailgrid.DataSource = null;

emailgrid.Rebind();

string ID = Request.QueryString["id"].PadLeft(2, '0');

query = "SELECT * FROM A_MAN_" + ID + " WHERE EMAILCOLUMN ='" + emailadressen[i] + "'";

SqlDataAdapter da = new SqlDataAdapter(query, conn);

DataTable dt = new DataTable();

da.Fill(dt);

emailgrid.DataSource = dt;

emailgrid.Rebind();

emailgrid.GridExporting += new OnGridExportingEventHandler(emailgrid_GridExporting);

switch (rcbExportType.SelectedItem.Text) {

case "CSV":

emailgrid.MasterTableView.ExportToCSV();

break;

case "Excel":

emailgrid.MasterTableView.ExportToExcel();

break;

case "PDF":

emailgrid.MasterTableView.ExportToPdf();

break;

case "Word":

emailgrid.MasterTableView.ExportToWord();

break;

}

protected void emailgrid_GridExporting(object source, GridExportingArgs e) {

string filename = DateTime.Now.Year + "-" + DateTime.Now.Month + "-" + DateTime.Now.Day + rtbOnderwerp.Text + teller + ".";

switch (rcbExportType.SelectedItem.Text) {

case "CSV":

filename += "csv";

break;

case "Excel":

filename += "xls";

break;

case "PDF":

filename += "pdf";

break;

case "Word":

filename += "doc";

break;

}

string path = Server.MapPath("~/" + filename);

using (FileStream fs = File.Create(path)) {

Byte[] info = System.Text.Encoding.Default.GetBytes(e.ExportOutput);

fs.Write(info, 0, info.Length);

}

MailMessage msg = new MailMessage();

MailAddress From = new MailAddress("info@xxxxxxxxxxxx.nl", "info@xxxxxxxxxxxx.nl");

msg.From = From;

msg.Subject = rtbOnderwerp.Text;

msg.Body = rtbMailtekst.Text;

msg.To.Add(new MailAddress(emailadressen[teller]));

teller++;

Attachment at = new Attachment(Server.MapPath("~/" + filename));

msg.Attachments.Add(at);

SmtpClient client = new SmtpClient("localhost");

client.Send(msg);

msg.Dispose();

FileInfo fi = new FileInfo(Server.MapPath("~/" + filename));

fi.Delete();

if (teller == emailadressen.Count)

Response.Redirect(Request.Url.ToString());

}

Hopefully anyone can help, that would be a lifesaver!

Thanks

Grid

answered on 11 Jul 2011

3 answers

475 views

Change width of Select button

Hi,

I am trying to change width of AsyncUpload select button but no solution works for me :-/

I have this code in my view Default.aspx

<telerik:RadAsyncUpload ID="RadAsyncUpload1" runat="server" Skin="Black"

CssClass="button">

<Localization Select="Almost 50 chars long text" />

</telerik:RadAsyncUpload>

On attached image, you can see my bad solution. If I disable .RadUpload .ruBrowse (red box) automaticly will be used .RadUpload .ruButton (green box) and this style resize button area but not the whole button (blue box) :-/

Please can you help me to solve this?

AsyncUpload

answered on 11 Jul 2011

1 answer

102 views

Calculating pane dimensions properly

Hi all,

I am currently attempting to solve a small bug in my web project. The bug is that, in certain scenarios, the width is too large of a RadPane I have created programatically.

So, first off, the code that is causing the issue:

/// <summary>

/// Creates a RadSplitter and places the two panes it will hold onto it.

/// In addition, sets those panes dimensions such that they are appropriate for

/// the orientation of the RadSplitter.

///

/// I divide height and width in half because there are two panes.

/// </summary>

/// <returns> The rad splitter. </returns>

public static CormantRadSplitter CreateNewContent(Orientation orientation, RadPane parent)

{

Logger.InfoFormat("Creating new content to be placed upon: {0}", parent.ID);

CormantRadSplitter splitter = new CormantRadSplitter(orientation);

CormantRadPane firstPane = new CormantRadPane();

CormantRadDockZone firstDockZone = new CormantRadDockZone();

firstPane.Controls.Add(firstDockZone);

splitter.Controls.Add(firstPane);

CormantRadPane secondPane = new CormantRadPane();

splitter.Controls.Add(new CormantRadSplitBar(orientation, firstPane.ID, secondPane.ID));

CormantRadDockZone secondDockZone = new CormantRadDockZone();

secondPane.Controls.Add(secondDockZone);

splitter.Controls.Add(secondPane);

switch (orientation)

{

case Orientation.Horizontal:

firstPane.PanePosition = PanePositions.Top;

secondPane.PanePosition = PanePositions.Bottom;

//firstPane.Height = secondPane.Height = new Unit(parent.Height.Value / 2, UnitType.Pixel);

//firstPane.Width = secondPane.Width = parent.Width;

break;

case Orientation.Vertical:

firstPane.PanePosition = PanePositions.Left;

secondPane.PanePosition = PanePositions.Right;

//firstPane.Height = secondPane.Height = parent.Height;

//firstPane.Width = secondPane.Width = new Unit(parent.Width.Value / 2, UnitType.Pixel);

break;

}

return splitter;

}

The lines which are commented out are the culprits.

I believe the issue arises from 'fighting' with what Telerik/WebControls is trying to do. These panes are created with the intent of filling all the space they are given, but no more. The panes will do that by default -- their height and width properties are unset -- which causes them to use height/width: auto.

So, why do I have code which sets their height and width, then? My reasoning is that it is impossible to properly save the state of my page without explicitly defining the dimensions. If I execute the above code, with lines commented out, and then perform a hard refresh on the page -- the controls expect dimensions to regenerate with. If I leave them unset here, they will indeed figure out how to adjust themselves (they figure it out even if I DO tell them dimensions!) Unfortunately, the panes are resizable by the end user. If I do not save/load the dimensions of each pane then it is impossible to support persisting resized panes. (Not saving dimensions will cause each pane to take up half of its parents space assuming 2 panes regardless of how they were sized before refresh).

So, I am trying to setup each panes dimensions properly. I thought the above code did just that, but I am experiencing a little quirk! If I place a RadSplitter with vertical orientation on the page, then place a RadDock in the RHS pane, the RadDock spills out of the RadPane.

Here's an example image: http://i.imgur.com/4T8tu.png

In this image you will see a few things: An example where the RadDock is spilling out of the pane on the RHS, as well as an example where the RadDock stays contained inside of a horizontal-oriented splitter's pane. I am not sure why the horizontal one always seems to be fine.

Nevertheless, the issue seems to be pretty easy to see -- I just want to make the right decision. When I create that vertical splitter seen in the image -- the width of each pane (for example) is 502px. After a hard refresh and inspecting the pane elements on the page, I see that their widths have been changed to 499 and 500. These post-hardrefresh widths are appropriate, my calculated widths are not.

Is this just as simple as taking into account the width of the RadSplitBar being put onto the RadSplitter -- and subtracting that from the widths of each of the panes? If so, I wonder why the same issue does not occur with horizontal-oriented splitters? Also, the width of a splitBar isn't known at creation -- so I'd just be using a hardcoded width here.. a little scary.

Anyway, like I said.. I could probably force this solution pretty easily. I am just trying to understand -why- this is happening and what I can do to fix it properly in a way that's understandable to future developers -- not just a hardcoded number.

Thanks for your time

Sean

Splitter

answered on 11 Jul 2011