Questions on UI for ASP.NET AJAX Forum

1 answer

186 views

Hello all,

I am trying to implement a rad editor. In it there is an Image Manager and inside the image manager there is an Image editor. So far its fine(the image is being shown perfectly).

As in every story there is a villain, here it is.
Now the problem arises when i click on any of the tool buttons in the image editor window. The popup screen is shown, but there is nothing inside it. Like when i click on the Crop button the popup heading is just "Tool Dialog" and there is not content in it. A preview can be seen here.

This issue arises only when i use it in a RadEditor. When i am use an Image Editor alone then there is no issue. I am stuck here..

Thanks ,
Roshil

ImageEditor

answered on 21 Sep 2011

1 answer

95 views

Need Help ASAP with Binding Sublevel Items

I'm using RadMenu skin object in DNN.

For page that are level 3, I want to insert them under their level 2 parent as an undordered, bulleted list. (Please see attachment.)

How do I accomplish this dynamically?

I've tried using an itemTemplate, but that doesn't seem to be doing anything. Perhaps, I'm going about this the wrong way. Any immediate insight would be appreciated.

protected void Page_Load(object sender, EventArgs e)

{

UnorderedListTemplate template = new UnorderedListTemplate();

RadMenu menu = dnnMenu.FindControl("RadMenu1") as RadMenu;

foreach (RadMenuItem item in menu.Items)

template.InstantiateIn(item);

}

class UnorderedListTemplate : ITemplate

{

public void InstantiateIn(Control container)

{

RadSiteMap rsMap = new RadSiteMap();

rsMap.ID = "radSiteMap";

rsMap.DataBinding += new EventHandler(MenuItem_DataBinding);

container.Controls.Add(rsMap);

}

private void MenuItem_DataBinding(object sender, EventArgs e)

{

RadSiteMap target = (RadSiteMap)sender;

RadMenuItem item = (RadMenuItem)target.BindingContainer;

target.DataSource = (RadMenuItemCollection)DataBinder.Eval(item, "Items");

}

Menu

answered on 21 Sep 2011

5 answers

324 views

PanelBar and Expanding textbox

Hello,
I have a problem with a expandable textbox and RadPanelBar.
I'm using jQuery () and an elastic library to make the expanded effect in the textbox:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script src="Scripts/jquery.elastic.source.js" type="text/javascript"></script>

Elastic source is: http://unwrongest.com/projects/elastic/

Everything is fine until I move the textbox inside an PanelItem content and start writing, everytime I press enter to move to a new line in the text box my cursor is gone, it seems to go to the default button of the form and the component loses focus.
Have to click in text fields to continue typing.
It's happening with IE 8 or inferior versions. (not with IE 9)
Looks like there is an internal event when RadPanelItem growth his vertical size that makes the cursor move from his actual position to other place, I can see the cursor position after texbox growth but then just go to somewhere else.
As you will see, the textbox outside panel item works fine and the one inside the collapsed panel item doesn't work.
Do you have any suggestion or workaround to fix this in IE 8 or bellow?
Thanks so much in advanced for your help.

Here is the code of my test web page:

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="testcontrol.aspx.vb" Inherits="mytestproject.testcontrol" %>

<!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>Test</title>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>

<script src="Scripts/jquery.elastic.source.js" type="text/javascript"></script>

</head>

<body>

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

<telerik:RadScriptBlock runat="server" ID="RadScriptBlock1">

<script type="text/javascript">

function OnClientLoad(sender, args) {

var txt1 = '<%=txtExtDesc.ClientID %>';

var txt2 = '<%=txtNotes.ClientID %>';

$('#' + txt1).elastic();

$('#' + txt2).elastic();

}

</script>

</telerik:RadScriptBlock>

<telerik:RadScriptManager CdnSettings-TelerikCdn="Enabled" EnablePageMethods="true"

ID="RadScriptManager1" runat="server">

</telerik:RadScriptManager>

<div style="margin-left: 25px; margin-right: 25px; margin-top: 10px; margin-bottom: 10px;width:100%;text-align: center;">

<div style="width:925px;">

<fieldset style="margin: 10px 25% 10px 25%; position: relative; width: 50%; padding-bottom: 10px;">

<legend>Options:</legend>

<span style="text-align: center">

<asp:Button ID="btnUpdateItem" runat="server" CommandName="Update" CssClass="rgPagerButton" Text="Update" CausesValidation="true" ValidationGroup="basicValidation" />

<asp:Button ID="btnInsertItem" runat="server" CommandName="Insert" CssClass="rgPagerButton" Text="Insert" CausesValidation="true" ValidationGroup="basicValidation" />

</span>

</fieldset>

<div style="width: 100%; vertical-align: middle; text-align: left">

<asp:ValidationSummary runat="server" ID="validationSummary" ShowMessageBox="True" ValidationGroup="basicValidation" />

</div>

<telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" Width="100%">

<telerik:RadPanelBar ID="RadPanelBar1" runat="server" Width="100%" Skin="Web20" OnClientLoad="OnClientLoad">

<Items>

<telerik:RadPanelItem runat="server" Selected="True" Expanded="True" Text=" .- Basic Information" ToolTip="Basic information about the item">

<Items>

<telerik:RadPanelItem Value="basicInfo" runat="server">

<ContentTemplate>

<div class="text" style="background-color: #edf9fe; padding-left: 50px;">

<ul class="formList" id="basicInfo">

<li>

Some controls

</li>

<li class="lastListItem">

Some controls

</li>

</ul>

</div>

</ContentTemplate>

</telerik:RadPanelItem>

</Items>

</telerik:RadPanelItem>

<telerik:RadPanelItem runat="server" Selected="false" Expanded="false" Text=" .- Other Details" ToolTip="Other details about the item">

<Items>

<telerik:RadPanelItem Value="otherdetInfo" runat="server">

<ContentTemplate>

<div class="text" style="background-color: #edf9fe; padding-left: 50px;">

<ul class="formList" id="otherdetInfo" >

<li>

<asp:Label CssClass="labelField" runat="server" ID="lblExtDesc" AssociatedControlID="txtExtDesc">Inside doesn't work:</asp:Label>

<asp:TextBox ID="txtExtDesc" runat="server" Rows="3" Columns="50" MaxLength="4999" TextMode="MultiLine" Text=""></asp:TextBox>

</li>

</ul>

</div>

</ContentTemplate>

</telerik:RadPanelItem>

</Items>

</telerik:RadPanelItem>

</Items>

</telerik:RadPanelBar>

<asp:Label CssClass="labelField" runat="server" ID="lblIntNote" AssociatedControlID="txtNotes">This one works:</asp:Label>

<asp:TextBox ID="txtNotes" runat="server" Rows="3" Columns="50" MaxLength="255" TextMode="MultiLine" Text=""></asp:TextBox>

</telerik:RadAjaxPanel>

</div>

</form>

</body>

</html>

PanelBar

answered on 21 Sep 2011

11 answers

924 views

how to handle check box check change when using GridClientSelectColumn

Hi,
I am using the following code to get the first column of the grid as a check box column .

<telerik:radgrid ID="RadGrid2" DataSourceID="SqlDataSource1" AllowMultiRowSelection="true"

runat="server" AllowSorting="True" GridLines="None"

onneeddatasource="RadGrid2_NeedDataSource" OnItemCreated="RadGrid1_ItemCreated" EnablePostBackOnRowClickproperty ="true" OnItemCommand="RadGrid1_ItemCommand" >

<MasterTableView>

<Columns>

<telerik:GridClientSelectColumn UniqueName="ClientSelectColumn" />

</Columns>

</MasterTableView>

<ClientSettings EnableRowHoverStyle="true">

<Selecting AllowRowSelect="True" />

</ClientSettings>

</telerik:radgrid>

Here i need to do some logic like on clicking particular check box add one id field to viewstate/session.And remove that id on uncheck of that checkbox.
If i use GridClientSelectColumn , how can i handle the check box check changed event ?is there any grid events similar to this ?

I tried

EnablePostBackOnRowClickproperty

="True"

But then also postback is not happening on row click .

Any help is appreciated!!

Regards,
Soumya

Grid

answered on 21 Sep 2011

3 answers

102 views

Cursor position when changing from design to html view

I've noticed that when I switch from design view to HTML view, my cursor does not maintain my position in the html view. Meaning when i'm halfway down a piece of text, and wish to inspect the underlying HTML, i'm not taken to that same place in the HTML - i'm taken back to the top of the content. This can make it quite time consuming to go back and find my location. Is there a way to maintain cursor position while switching views?

Editor

answered on 21 Sep 2011

2 answers

128 views

Customize CSS for RadGrid

Hi,

I have a SharePoint 2010 visual webpart created using RadGrid control. Now I wish to apply custom css such that it forces the "theme" colors for Header background, border color, Row background and Alternate Row background. (I tried for an aspx page using custom skin and it was working fine). I would appreciate if the steps be provided on how can this functionality be achieved for SharePoint.

Sharepoint Integration

answered on 21 Sep 2011

3 answers

107 views

RadGrid and RowClick

Hi,
I have a RadGrid that I want to load other user controls when clicking on a row. How to accomplish this?

I have set ClientSetting EnablePostBackOnRowClick to true and enabled Ajax (EnableAJAX="true").

I have tried to create a method in code behind as below but this will not add the text "Postback" to Label1.

protected void gvShipments_ItemCommand(object source, GridCommandEventArgs e)

{

if (e.CommandName == "RowClick")

{

e.Item.Selected = true;

Label1.Text += "Postback";

}

Pls advice.

Br,
Jesper

Grid

answered on 21 Sep 2011

2 answers

182 views

[Solved] PerformInsert __EVENTTARGET

Hi,
I need to intercept the __EVENTTARGET during the PageLoad when I rise the PerformInsert action into RadGrid.
If I use ButtonType = Image my Request["__EVENTTARGET"] is blank, if I use ButtonType = LinkButton my Request["__EVENTTARGET"] has the correct value.

I don't wanna use LinkButton, so, why my button with ImageButton don't have the tipically __doPostBack("...........$PerformInsertButton", ''); and why I can find it into my Reques["__EVENTTARGET"] ?

Thanks

Best regards

Grid

answered on 21 Sep 2011

6 answers

74 views

Stacked Area - extending all the way to the left

Hello,

I am using Stacked Area to make a shaded background for certain Y-values. The issue I'm having is I want the Stacked Area to extend all the way to the left. Currently it starts at the same place the first chart value starts.

I have attached a screenshot where the stacked area is the green section but as you can see it extends all the way to the right but not the left. Note: the gray line does extend the full width of the graph but I also set an X value that is less than any of the displayed X values. I tried something similar with the Stacked Area but could not get it to work.

Thanks for any help.

Chart (Obsolete)

answered on 21 Sep 2011

1 answer

229 views

Disable telerik styling for Tooltip close button

I would like to know how to disable the telerik styling for the tooltip close button.

I have set the EnableEmbeddedBaseStylesheet="false" EnableEmbeddedSkins="false" Skin="4Cast" but it still renders the telerik styling and because the styling is so specific it supersedes my syles.
This is the tooltip source...

<telerik:RadToolTip runat="server" ID="RadToolTip3" HideEvent="FromCode"

Position="BottomCenter" Animation="slide" CssClass="freeTrialWindow"

ShowEvent="OnClick" ShowDelay="0" RelativeTo="Element" TargetControlID="freeTrialHL"

EnableShadow="true" ManualClose="true" Width="200" Height="200"

EnableEmbeddedBaseStylesheet="false" EnableEmbeddedSkins="false" Skin="4Cast"

RenderInPageRoot="true" ShowCallout="true" Title="Sign up for a free trial" >

The css for the tooltip is...

.RadToolTip_4Cast a.rtCloseButton,

.RadToolTip_4Cast a.rtCloseButton:hover {

background: url("button/tooltipClose.png") no-repeat center center transparent;

}

div.RadToolTip_4Cast table.rtShadow a.rtCloseButton {

margin: -10px -10px 0 0;

position: absolute;

right: 0;

top: 0;

background-position: 0 0;

width: 19px;

height: 19px;

}

.RadToolTip_4Cast a.rtCloseButton:hover {

background-position: 0 -20px;

}

The main part of the css that i want rendered is the negative margin. This will then display the button in the top right corner slightly out of the box.
The css that gets rendered is this...

div.RadToolTip a.rtCloseButton {

background-position: 0 0;

background-repeat: no-repeat;

display: block;

float: right;

font-size: 1px;

height: 12px;

line-height: 1px;

margin-right: 3px;

margin-top: 3px;

outline: medium none;

position: absolute;

right: 1px;

text-indent: -9999px;

width: 12px;

}

And that is the telerik css that is superseding my css.
I dont want to use the !important class modifier and i dont want to make my css so specific that i will never be able to supersede it for something else.

I would just like to disable the predefined styles that telerik puts in. I thought thats what the EnableEmbeddedBaseStylesheet="false" EnableEmbeddedSkins="false" Skin="4Cast"
functions were meant to do?

Thanks in advance for your help.

ToolTip

answered on 21 Sep 2011