Rank 1
I have a page with a command button and a Rad window that has a content template that contain a user control. The user control has a little JavaScript for custom validations. Everything works fine until I try to use an Ajax manager. When I hook the toolbar button to the Rad windows on the default page everything breaks. I have attached the code for what I am trying to do, if you disable the Ajax manager on the default page my little program works great, however if you enable and configure the Ajax and everything breaks. Currently the Ajax manager is enabled, try running it as it is and then disable Ajax and you will see what I mean. The first time you click the tool bar button it appears that everything is fine, however if you click cancel and then click the tool bar again the user control is rendered partly and is garbled. Additionally none of the JavaScript on the user control works.
This is not my entire project just a snipit there is a lot more going on and all the other Ajax works fine, I would like to use Ajax in this scenario to avoid post back on the tool bar button click that displays the rad window that has the user control to flow with therest of my project in terms of no post backs and everything else Ajaxified. Please see attached and help if you can. The data on the user control list box comes from the North wind data base Customers Company Name. Thanks Ken G.
Default.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ Register Src="Controls/CreateMessageRadListBox.ascx" TagName="CreateMessageRadListBox" TagPrefix="uc" %>
<%@ Register Assembly="Telerik.Web.UI, Version=2009.3.1208.35, Culture=neutral, PublicKeyToken=121fae78165ba3d4" 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></title>
</head>
<body>
<form id="form1" runat="server">
<telerik:RadToolBar ID="RadToolBar1" runat="server" OnButtonClick="RadToolBar1_ButtonClick" Width="100px">
<Items>
<telerik:RadToolBarButton runat="server" Text="UC RadListBox">
</telerik:RadToolBarButton>
</Items>
</telerik:RadToolBar>
<telerik:RadWindow ID="rwUserControlListBox" runat="server" Behaviors="Move" Height="630px" KeepInScreenBounds="True" Modal="true" Overlay="True" Skin="Office2007" Title="Create Message" Visible="false" VisibleOnPageLoad="true" VisibleStatusbar="false" Width="800px">
<ContentTemplate>
<uc:CreateMessageRadListBox ID="CreateMessageRadListBox" runat="server" OnCreatedMessage="ucCreateMessage_OnCreateMessage" OnCancel="ucCreateMessage_OnCancel" />
</ContentTemplate>
</telerik:RadWindow>
<telerik:RadScriptManager ID="RadScriptManager1" runat="server">
</telerik:RadScriptManager>
<br />
<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
<AjaxSettings>
<telerik:AjaxSetting AjaxControlID="RadToolBar1">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="rwUserControlListBox" />
</UpdatedControls>
</telerik:AjaxSetting>
</AjaxSettings>
</telerik:RadAjaxManager>
</form>
</body>
</html>
Default.aspx.cs
using System;
using Telerik.Web.UI;
public partial class _Default : System.Web.UI.Page {
protected void RadToolBar1_ButtonClick(object sender, Telerik.Web.UI.RadToolBarEventArgs e) {
switch (e.Item.Text) {
case "UC RadListBox":
rwUserControlListBox.Visible = true;
break;
}
}
protected void ucCreateMessage_OnCreateMessage(object sender, EventArgs e) {
rwUserControlListBox.Visible = false;
}
protected void ucCreateMessage_OnCancel(object sender, EventArgs e) {
rwUserControlListBox.Visible = false;
}
}
CreateMessageRadListBox.ascx
<%@ Control Language="C#" AutoEventWireup="true" CodeFile="CreateMessageRadListBox.ascx.cs" Inherits="Controls.CreateMessageRadListBox" %>
<%@ Register Assembly="Telerik.Web.UI, Version=2009.3.1208.35, Culture=neutral, PublicKeyToken=121fae78165ba3d4" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<body style="font-family: Calibri">
<telerik:RadCodeBlock runat="server" ID="rcbjs">
<script type="text/javascript">
function checkForDuplicateSelection(sender, args) {
var usedField = new Array();
var radUpload = $find('<%= ruFileUpload.ClientID %>');
var fileInputs = radUpload.getFileInputs();
var duplicateFieldFlag = false;
for (var i = 0; i < fileInputs.length; i++) {
var fileName = fileInputs[i].value.substring(fileInputs[i].value.lastIndexOf("\\") + 1, fileInputs[i].value.length);
for (var j = 0; j < usedField.length; j++) {
//If at least one duplicate field exists
//the emptyFieldFlag is being raised
if (fileName == usedField[j]) {
duplicateFieldFlag = true;
//The first invalid file input
//field receives focus
radUpload.clearFileInputAt(i);
fileInputs[i].focus();
break;
}
}
if (duplicateFieldFlag) {
args.IsValid = false;
return;
}
if (fileInputs[i].value.length != 0) {
usedField[usedField.length] = fileName;
}
}
args.IsValid = true;
}
function ValidationCriteria(source, args) {
var listbox = $find('<%= rlbRecipients.ClientID %>');
var check = 0;
var items = listbox.get_items();
for (var i = 0; i <= items.get_count() - 1; i++) {
var item = items.getItem(i);
if (item.get_checked()) {
check = 1;
}
}
if (check)
args.IsValid = true;
else
args.IsValid = false;
}
</script>
</telerik:RadCodeBlock>
<table style="width: 100%">
<tr valign="top">
<td style="width: 220px;">
<asp:Label ID="lblSentTo" runat="server" Font-Bold="True" Text="Send To :"></asp:Label>
<asp:CustomValidator ID="cvReciepients" runat="server" ClientValidationFunction="ValidationCriteria" ErrorMessage="Reciepient Required" Font-Bold="True"></asp:CustomValidator>
<telerik:RadListBox ID="rlbRecipients" runat="server" CheckBoxes="True" Width="100%" Height="570px" Skin="Office2007" DataKeyField="Company" DataSortField="Company" DataSourceID="SqlDataSource1" DataTextField="Company" Style="top: 0px; left: 0px">
</telerik:RadListBox>
</td>
<td>
<telerik:RadUpload ID="ruFileUpload" runat="server" Skin="Office2007" MaxFileInputsCount="5" BorderColor="White" BorderStyle="Solid" BorderWidth="1px">
</telerik:RadUpload>
<asp:CustomValidator ID="RadUploadDuplicateFieldsValidator" runat="server" ClientValidationFunction="checkForDuplicateSelection" Display="Dynamic" Font-Bold="True">
Duplicate File Removed! Only ONE Version of the Same File can be Attached!
</asp:CustomValidator>
<asp:Button ID="btnSendMessage" runat="server" OnClick="btnSendMessage_Click" Text="Send" />
<asp:Button ID="btnCancel" runat="server" Text="Cancel" OnClick="btnCancel_Click" CausesValidation="False" Height="26px" />
</td>
</tr>
</table>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:Northwind 20071SQLConnectionString %>" SelectCommand="SELECT [Company] FROM [Customers]"></asp:SqlDataSource>
<telerik:RadAjaxManagerProxy ID="RadAjaxManagerProxy1" runat="server">
<AjaxSettings>
<telerik:AjaxSetting AjaxControlID="chkPriorityMessage">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="chkReadReceipt" />
</UpdatedControls>
</telerik:AjaxSetting>
</AjaxSettings>
</telerik:RadAjaxManagerProxy>
</body>
CreateMessageRadListBox.ascx.cs
using System;
using System.Web.UI;
namespace Controls {
public partial class CreateMessageRadListBox : UserControl {
public event EventHandler CreatedMessage;
protected void OnCreatedMessage(EventArgs e) {
if (CreatedMessage != null)
CreatedMessage(this, e);
}
public event EventHandler Cancel;
protected void OnCancel(EventArgs e) {
if (Cancel != null)
Cancel(this, e);
}
protected void btnSendMessage_Click(object sender, EventArgs e) {
OnCreatedMessage(e);
}
protected void btnCancel_Click(object sender, EventArgs e) {
OnCancel(e);
}
}
}
2 Answers, 1 is accepted
Please find attached a sample project illustrating how you can overcoma the described issues. Give it a try and let me know if it works as expected.
Best wishes,
Iana
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
Rank 1