Questions on UI for ASP.NET AJAX Forum

1 answer

124 views

Hi,

I'm trying to use the Editor to give my users the ability to write a custom message template for an application, that will send notification upon certain events.

To give the users the ability to customize the notification-message, I'd like to have replaceable codes in the editor. Something like {User}, that will be replaced in the actual message with the current users name. The Editors Content is saved with these Codes and my application replaces the tags, when the message is sent.

Is it possible to change the Preview-Mode of the Editor, so I can replace this codes with data, so the user sees how the message will look like?

To summarize: Is it possible to change the content shown in the preview mode?

Thanks for your help.

Editor

answered on 13 Oct 2015

8 answers

1.5K+ views

Sys.InvalidOperationException: A control is already associated with the element.

Hi,

I use telerik components and Ajax.Net. I have a strange error when I click on the grid : Sys.InvalidOperationException: A control is already associated with the element.

<

asp:Content ID="Content1" ContentPlaceHolderID="cl" runat="server">

<asp:UpdatePanel runat="server" ID="upd1"><ContentTemplate>
// RAD GRID used here, inside the FlashInfoGrid component.
</ContentTemplate></asp:UpdatePanel>

</

asp:Content>

<

asp:Content ID="Content2" ContentPlaceHolderID="cb" runat="server">

<

asp:UpdatePanel runat="server" ID="upd2"><ContentTemplate>
// Control to display when I click on the Edit button of the RadGridView.
</ContentTemplate></asp:UpdatePanel>

</

asp:Content>

Maybe, the UpdatePanel doesn't ork very well with the RadGrid of Telerik ? Or maybe, I don't use the UpdatePanel correctly ? Maybe I should use the RadAjaxManager of Telerik ?

Thank you in advance,

Ajax

answered on 13 Oct 2015

1 answer

67 views

Null Template when adding nodes in NodeExpand

I am adding nodes in the NodeExpand event to utilize LOD. However, the treeview uses a NodeTemplate which is added in the OnInit and Page_load events. But I cannot access the controls for the new node that I'm adding. Do I need to add the node to the treeview first and reiterate through it to access the control?

I need to access the controls to set a control to visible for the newly created node and to modify the node text.

TreeView

answered on 12 Oct 2015

6 answers

121 views

PauseOnMouseOver not working

Hi

i have the following issue, i have a very basic page with a rotator on it.

but PauseOnMouseOver doesnt seem to be working, it simply wont pause on mouse over.

i am using the latest version of telerik

fyi the cdn bits is because i use a local version of it, but again thats the latest version.

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="RotatorPage.aspx.cs" Inherits="EAP.popups.RotatorPage" %>

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

<link href="../site/css/Common.css" rel="stylesheet" type="text/css" />

<link href="../site/css/Header.css" rel="stylesheet" type="text/css" />

<script type="text/javascript">

function OnClientItemsRequestFailed(sender, eventArgs) {

var errorMessage = eventArgs.get_errorMessage();

eventArgs.set_cancelErrorAlert(true);

}

</script>

</head>

<body style="background-color:white !Important;">

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

<telerik:RadScriptManager ID="RadScriptManager1" runat="server" EnableEmbeddedjQuery="true">

<CdnSettings TelerikCdn="Enabled" BaseSecureUrl="https://host/cdn/Scripts" BaseUrl="https://host/cdn/Scripts" />

</telerik:RadScriptManager>

<telerik:RadStyleSheetManager ID="RadStyleSheetManager1" runat="server" EnableStyleSheetCombine="False">

<CdnSettings TelerikCdn="Enabled" BaseUrl="https://host/cdn/Skins" BaseSecureUrl="https://host/cdn/Skins" />

</telerik:RadStyleSheetManager>

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

</telerik:RadAjaxManager>

<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Skin="Bootstrap">

</telerik:RadAjaxLoadingPanel>

<telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" LoadingPanelID="RadAjaxLoadingPanel1" EnablePageHeadUpdate="true">

<div class="rotator-container">

<telerik:RadRotator ID="headlinesRotator" runat="server" ScrollDirection="Left" Width="500"

WrapFrames="true" FrameDuration="1" PauseOnMouseOver="true"

ScrollDuration="8000" Height="15" ItemHeight="15" ItemWidth="250"

CssClass="rotator">

<WebServiceSettings Path="../Services/EclipseService.asmx" Method="GetRotatorData" />

</telerik:RadRotator>

</div>

</telerik:RadAjaxPanel>

</form>

</body>

</html>

Rotator

answered on 12 Oct 2015

1 answer

124 views

RadGrid cause validation issue

<asp:Panel runat="server" ID="panelAddUser" class="panel panel-primary">

<div class="panel-heading">New User</div>

<div class="panel-body">

<div class="row">

<div class="col-xs-4">

<asp:TextBox runat="server" ID="txtUsername" CssClass="form-control input-lg" placeholder="Username" MaxLength="32" required="required" ValidationGroup="FormValidate" />

</div>

<div class="col-xs-4">

<asp:TextBox runat="server" ID="txtPassword" CssClass="form-control input-lg" placeholder="Password" TextMode="Password" MaxLength="32" required="required" ValidationGroup="FormValidate" />

</div>

<div class="col-xs-4">

<asp:TextBox runat="server" ID="txtConfirmPassword" CssClass="form-control input-lg" placeholder="Confirm Password" TextMode="Password" MaxLength="32" required="required" ValidationGroup="FormValidate" />

</div>

</div>

</div>

</asp:Panel>

I have this panel and then below it i have another panel containing RadGrid control :)

When i click e.g. Edit or Delete imagebuttons in the Grid, i get the HTML5 validation errors from the panel panelAddUser.

I tried CauseValidation but it didn't help at all (i kept getting those errors).

Thank you

Grid

answered on 12 Oct 2015

1 answer

100 views

RadGrid incorrect data when pagging

I have a textbox and a search button and a RadGrid which was already bound data to by OnNeedDataSource event. When I click search button, it will get the new data and I Rebind() that data on search button click event. But when I change page number on the grid, the datasource was not the datasource I've already Rebind().

Please help, it's urgent.

Thanks and Best regards.

Grid

answered on 12 Oct 2015

1 answer

125 views

option required

I have some asp text box in each of one i use a property call required like this

1.<asp:TextBox runat="server" ID="TxtCorreoVal" CssClass="form-control" required>

and in the css i use this, i upload an image of how it looks in a normal textbox i want use the same functionality on RadDatePicker and RadComboBox

how can i do this

01.input:required:invalid, input:focus:invalid {

02. background-image: url(../imagenes/required.png);

03. background-position: right top;

04. background-repeat: no-repeat;

05. -moz-box-shadow: none;

06. }

07. input:required:valid {

08. background-image: url(../imagenes/Ok.png);

09. background-position: right top;

10. background-repeat: no-repeat;

11. }

Thank for your time

DatePicker

answered on 12 Oct 2015

8 answers

102 views

Static headers not working with GroupByHeader

Hi

I am using GroupByHeaderFirstColumnSpan property in my Radgrid to group the columns.

I want to use static headers and frozen columns with the same but on adding this, grid is losing the data.

Please let me know if we can use static headers and frozen columns with GroupByHeaderFirstColumnSpan property set in Radgrid.

Ajax

answered on 12 Oct 2015

8 answers

140 views

[Solved] Chart with Stock Layout does not update series labels on navigation

On a chart with the layout set to stock I have noticed an odd behavior. When using the navigator, the chart will update as expected, but the original series labels will be stuck in place and not disappear.

Any idea what may cause this or what setting needs to be changed? We have noticed this in 2 separate projects on 2 different development machines.

I have included 2 screen shots to show.

Chart (HTML5)

answered on 12 Oct 2015

6 answers

397 views

RadGrid Detail Table only expands for one row in mastertableview

I have an autogenerated radgrid and detail table. I am resizeToFit() the columns in both the mastertableview, and the detailtable. (see javascript block). I am colorizing cell backcolors based upon the cell value.

When a user clicks a row, or clicks the expand/collapse image, the PartnerID is then stored in the Session Data, to retrieve the respective data from the db. The PartnerID's in the parent table, match those in the DetailTable.

Everything works as expected, however I am only able to expand one row when the page has finished loading. It does not matter which row it is. I can expand that row once, and then collapse that row once. After that I am unable to expand any other row in the parent table. Clicking on the other expand icons triggers a postback, but nothing is changed. I have tried expanding a row, and then attempting to expand a second row, but that does not work either.

I have verified that the datasource is retrieving new data based on the session variable. I have tried using the selected value for RadGrid1 on my datasource, and that works fine. But the behavior is the same.

The data to populate the parent table, looks like this. It comes from SqlDataSourcePartnerOverview

|PartnerID|PartnerName|num_patients|avg_answer|Q1|Q2|Q3|

|int|string|int|double|double|double|double|

The data to populate the detail table, looks like this. It comes from SqlDataSourcePartnerQuestionDetails

|int|int|string|int|int|double|

 I have a second radgrid that is populated based on the Session["PartnerID"], but that works fine, so I haven't included it's source.

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

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="RadGrid1">

<UpdatedControls>

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

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

</UpdatedControls>

</telerik:AjaxSetting>

<telerik:AjaxSetting AjaxControlID="RadGrid2">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="RadGrid2"></telerik:AjaxUpdatedControl>

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Skin="Metro" Transparency="75" />

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

<script type="text/javascript">

function gridCreated(sender, args) {

var columns = sender.get_masterTableView().get_columns();

for (var i = 0; i < columns.length; i++) {

columns[i].resizeToFit(false, true);

}

function detailCreated(sender, eventArgs) {

var detailTables = sender.get_detailTables();

//iterates over all detail tables in gridview

for (var i = 0; i < detailTables.length; i++) {

var detailColumns = detailTables[i].get_columns();

//iterates over each column in detail table

for (var j = 0; j < detailColumns.length; j++) {

detailColumns[j].resizeToFit(false, true);

}

</script>

</telerik:RadCodeBlock>

<br />

<h3>Partner Overview:</h3>

<div id="partnerGridDiv">

<telerik:RadGrid

runat="server"

ID="RadGrid1"

Skin="Metro"

BorderStyle="Solid"

AllowSorting="True"

DataSourceID="SqlDataSourcePartnerOverview"

OnItemCommand="RadGrid_ItemCommand"

AutoGenerateColumns="true"

OnColumnCreated="RadGrid_ColumnCreated"

OnItemDataBound="RadGrid_ItemDataBound"

EnableHeaderContextMenu="true"

ShowFooter="true"

ViewStateMode="Enabled"

MasterTableView-HierarchyLoadMode="ServerOnDemand">

<ClientSettings AllowKeyboardNavigation="true" EnablePostBackOnRowClick="true">

<Selecting AllowRowSelect="true"></Selecting>

<Resizing ResizeGridOnColumnResize="true" AllowColumnResize="true" AllowResizeToFit="True" />

<Scrolling AllowScroll="false" UseStaticHeaders="false" />

<ClientEvents OnGridCreated="gridCreated" OnTableCreated="detailCreated"/>

</ClientSettings>

<HeaderStyle BackColor="#42608D" ForeColor="White" HorizontalAlign="Left" />

<ItemStyle HorizontalAlign="Left" />

<MasterTableView TableLayout="fixed" NoMasterRecordsText="No records found" DataKeyNames="PartnerID" DataSourceID="SqlDataSourcePartnerOverview">

<DetailTables>

<telerik:GridTableView Width="75%" AutoGenerateColumns="true" Name="PartnerDetailTable" runat="server" DataSourceID="SqlDataSourcePartnerQuestionDetails" DataKeyNames="PartnerID" ShowFooter="true">

<ParentTableRelation>

<telerik:GridRelationFields DetailKeyField="PartnerID" MasterKeyField="PartnerID" />

</ParentTableRelation>

<Columns>

<%--<telerik:GridBoundColumn DataField="QuestionNumber" DataType="System.Int32" HeaderText="Question Number" SortExpression="QuestionNumber" UniqueName="QuestionNumber" HeaderStyle-Width="10%" />

<telerik:GridBoundColumn DataField="Question" Aggregate="Count" HeaderText="Question" FooterStyle-HorizontalAlign="Left" SortExpression="PartnerName" UniqueName="PartnerName" />

<telerik:GridBoundColumn DataField="num_patients" DataFormatString="{0:n0}" Aggregate="Sum" FooterAggregateFormatString="Total: {0:n0}" FooterStyle-HorizontalAlign="Left" HeaderStyle-Width="10%" DataType="System.Int32" HeaderText="# of Patients" ReadOnly="True" SortExpression="num_patients" UniqueName="num_patients" />

<telerik:GridBoundColumn DataField="num_responses" DataFormatString="{0:n0}" Aggregate="Sum" FooterAggregateFormatString="Total: {0:n0}" FooterStyle-HorizontalAlign="Left" HeaderStyle-Width="10%" DataType="System.Int32" HeaderText="# of Responses" ReadOnly="True" SortExpression="num_responses" UniqueName="num_responses" />

<telerik:GridBoundColumn DataField="avg_answer" DataFormatString="{0:P0}" DataType="System.Double" FilterControlAltText="Filter avg_answer column" HeaderText="Average Response" ReadOnly="True" SortExpression="avg_answer" UniqueName="avg_answer" />--%>

</Columns>

</telerik:GridTableView>

</DetailTables>

</MasterTableView>

</telerik:RadGrid>

</div>

<asp:SqlDataSource ID="SqlDataSourcePartnerOverview" runat="server"

ConnectionString="<%$ ConnectionStrings:mdpSupportServices %>" SelectCommand="rpt_SurveyData_Partner_Overview" SelectCommandType="StoredProcedure">

<SelectParameters>

<asp:ControlParameter ControlID="RadDatePickerStartDate" PropertyName="SelectedDate" Name="startDate" Type="DateTime"></asp:ControlParameter>

<asp:ControlParameter ControlID="RadDatePickerEndDate" PropertyName="SelectedDate" Name="endDate" Type="DateTime"></asp:ControlParameter>

</SelectParameters>

</asp:SqlDataSource>

<asp:SqlDataSource ID="SqlDataSourcePartnerQuestionDetails" runat="server"

ConnectionString="<%$ ConnectionStrings:mdpSupportServices %>" SelectCommand="rpt_SurveyData_Partner_Question_Details" SelectCommandType="StoredProcedure">

<SelectParameters>

<asp:SessionParameter Name="PartnerID" SessionField="PartnerID" Type="Int64" />

<asp:ControlParameter ControlID="RadDatePickerStartDate" Name="StartDate" PropertyName="SelectedDate" Type="DateTime" />

<asp:ControlParameter ControlID="RadDatePickerEndDate" Name="EndDate" PropertyName="SelectedDate" Type="DateTime" />

</SelectParameters>

</asp:SqlDataSource>

here is my code behind

protected void Page_Load(object sender, EventArgs e)

{

mdpBaseComponent.PageTitle = "Solution Reach Survey Report";

mdpBaseComponent.PageSubTitle = "mdpSupportServices/SolutionReach_SurveyReport";

if (!IsPostBack)

{

this.RadDatePickerStartDate.SelectedDate = DateTime.Now.AddMonths(-1);

this.RadDatePickerEndDate.SelectedDate = DateTime.Now;

Session.Clear();

}

else

{

//postback!!!

}

protected void RadGrid_ItemCommand(object sender, GridCommandEventArgs e)

{

if (e.Item is GridDataItem)

{

GridDataItem item = (GridDataItem)e.Item;

if (item.OwnerGridID == "RadGrid1")

{

Session["PartnerID"] = item["PartnerID"].Text;

}

if (e.CommandName == "RowClick")

{

//do nothing

}

else if (e.CommandName == Telerik.Web.UI.RadGrid.ExpandCollapseCommandName)

{

item.Selected = true;

}

protected void RadGrid_ColumnCreated(object sender, GridColumnCreatedEventArgs e)

{

if (e.Column is GridBoundColumn)

{

GridBoundColumn gbc = ((GridBoundColumn)e.Column);

int n;

if (gbc.HeaderText == "Partner ID")

{

gbc.Display = false;

}

else if (gbc.HeaderText == "Venue ID")

{

gbc.Display = false;

}

else if (gbc.HeaderText == "Partner Name")

{

gbc.HeaderText = "Partner";

}

else if (gbc.HeaderText == "Venue Name")

{

gbc.HeaderText = "Venue";

}

else if (gbc.HeaderText == "num_patients")

{

gbc.HeaderText = "Patients";

gbc.DataFormatString = "{0:n0}";

gbc.FooterStyle.HorizontalAlign = System.Web.UI.WebControls.HorizontalAlign.Left;

gbc.FooterAggregateFormatString = "{0:n0}";

gbc.FooterStyle.Wrap = false;

gbc.Aggregate = Telerik.Web.UI.GridAggregateFunction.Sum;

}

else if (gbc.HeaderText == "num_responses")

{

gbc.HeaderText = "Responses";

gbc.DataFormatString = "{0:n0}";

gbc.FooterStyle.HorizontalAlign = System.Web.UI.WebControls.HorizontalAlign.Left;

gbc.FooterAggregateFormatString = "{0:n0}";

gbc.FooterStyle.Wrap = false;

gbc.Aggregate = Telerik.Web.UI.GridAggregateFunction.Sum;

}

else if (gbc.HeaderText == "avg_answer")

{

gbc.HeaderText = "Avg";

gbc.FooterStyle.HorizontalAlign = System.Web.UI.WebControls.HorizontalAlign.Left;

gbc.DataType = typeof(double);

gbc.DataFormatString = "{0:P1}";

gbc.FooterAggregateFormatString = "{0:P1}";

gbc.FooterStyle.Wrap = false;

gbc.Aggregate = Telerik.Web.UI.GridAggregateFunction.Avg;

}

else if (gbc.HeaderText[0] == 'Q' && int.TryParse(gbc.HeaderText.Substring(1,gbc.HeaderText.Length-1), out n))

{

//if first letter is Q, and rest of string is integer

// Q1,Q2,Q3 etc...

gbc.FooterStyle.HorizontalAlign = System.Web.UI.WebControls.HorizontalAlign.Left;

gbc.DataType = typeof(double);

gbc.DataFormatString = "{0:P1}";

gbc.FooterAggregateFormatString = "{0:P1}";

gbc.FooterStyle.Wrap = false;

gbc.Aggregate = Telerik.Web.UI.GridAggregateFunction.Avg;

}

//colorize cells based on value

public Color cellColor(double val, Color currentColor)

{

Color red = ColorTranslator.FromHtml("#F26C72");

Color green = ColorTranslator.FromHtml("#64C23E");

Color yellow = ColorTranslator.FromHtml("#DFCA3F");

Color lightGreen = ColorTranslator.FromHtml("#BEFFBE");

if (val >= .85)

return currentColor;

else if (val >= .70)

return yellow;

else

return red;

}

protected void RadGrid_ItemDataBound(object sender, GridItemEventArgs e)

{

if (e.Item is GridDataItem)

{

GridDataItem item = (GridDataItem)e.Item;

foreach (GridColumn col in item.OwnerTableView.AutoGeneratedColumns)

{

if (col.DataType == typeof(double))

{

double value;

if (double.TryParse(DataBinder.Eval(item.DataItem, col.UniqueName).ToString(), out value))

{

item[col.UniqueName].BackColor = cellColor(value, item[col.UniqueName].BackColor);

}

Grid

answered on 12 Oct 2015