Questions on UI for ASP.NET AJAX Forum

6 answers

227 views

Hi.

I have a problem entering custom html tags into the editor.
for example (paste only this html into the editor):

    
            <h1>Test template</h1> 
        
            Content starts here: <br /> 
        
            <placeholder name="Content" /> 
        
            <br /> 
        
            Content ends here!

will be replaced to (after a roundtrip to the server for saving):

    
            <h1>Test template</h1> 
        
            Content starts here: <br /> 
        
            <p name="Content">Content ends here!</p>

So my custom <placeholder> tag is getting merged with the last <br /> and replaced by <p>.
How do I get around this? I have set StripFormattingOptions="None" and AllowScripts="true" on the editor.

If I encapsulate my custom tag inside a <div> tag, everything works fine:

    
            <h1>Test template</h1> 
        
            Content starts here: <br /> 
        
            <div><placeholder name="Content" /></div>  
        
            <br /> 
        
            Content ends here!

(will be preserved after roundtrip to the server).

Thanks,
JJ

Editor

answered on 20 Apr 2010

1 answer

129 views

Problem loading an image instead of a page

HI

I am trying to use the RadWindow to show a larger version of an image on the page.
However I am getting different results in IE8 and Firefox3.

(I am using skin Black):

1 ) Title
In Firefox, the title bar displays the image filename, not the Title specified in RadWindow
settings (and there is no page to load where I could specify the page title.)
IE displays it correctly

2 ) Window backgound
In IE, the window background is white so I get a white border round the image, but Firefox does it correctly as Black

How can I fix these anomalies?

Thanks for any help!

Clive

Thanks

Clive

Window

answered on 20 Apr 2010

3 answers

170 views

Limit Contents of Combobox in RadGrid

Hi all

Having a bit of a dilemma, does anyone know how to do the following:

I've bound an SqlDataSource to a RadGrid which displays various data but typically an AreaID and an InterviewerID amongst many. When in EditMode, the only thing that I want to edit is the InterviewerID, so I have added a ComboBox in the EditItemTemplate and a label in the ItemTemplate.

My ComboBox is populated by another SqlDataSource containing ALL Interviewers but also holds a value for the AreaID (such as InterviewerID, Interviewer, AreaID).

What I would like to do is pick up the AreaID from the row currently being edited and limit the contents of the Combo to only Interviewers in that Area.

There must be a simple way of doing it but I'ts not making itself obvious to me - can anyone help please?

Thanks in anticipation.

Steve :o)

Grid

answered on 20 Apr 2010

4 answers

184 views

Can't get the radinputmanager in javascript.

Hi,
I have develop 2 screen which is quite similiar.
These screen allow user to enter some value in the textboxes given and and a RadInputManager to validate the data inputed.
1 screen is working fine but 1 screen are not.
The screen which is not working, is because of the javascript not able to get the RadInputManager instance.
This screen has 1 textbox only, this textbox will have different validation depends on the different parameter passed in.
Each parameter will use different validation for the textbox.

Below are my codes, please advice.

    
            <%@ Page Language="C#" AutoEventWireup="true" CodeFile="~/Transaction/TransactionUpdate.aspx.cs" 
        
                Inherits="Transaction.TransactionUpdate" %> 
        
            <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %> 
        
            <!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 id="Head1" runat="server">  
        
                <title></title>  
        
                <style type="text/css" media="all">  
        
                    @import "/css/standard.css";  
        
                </style> 
        
            <meta name="ROBOTS" content="NOINDEX, NOFOLLOW" /><meta http-equiv="PRAGMA" content="NO-CACHE" /><meta http-equiv="CACHE-CONTROL" content="NO-CACHE" /><meta http-equiv="EXPIRES" content="-1" /> 
        
                <script src="/js/jquery-1.2.6.min.js" type="text/javascript"></script> 
        
                <script src="/js/common.js" type="text/javascript"></script> 
        
            </head> 
        
            <body> 
        
                <form id="form1" runat="server" autocomplete="off">  
        
                    <telerik:RadFormDecorator ID="RadFormDecorator1" runat="server" DecoratedControls="Default, Label" /> 
        
                    <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server">  
        
                    </telerik:RadAjaxLoadingPanel> 
        
                    <telerik:RadWindowManager ID="radWindowManager" runat="server">  
        
                    </telerik:RadWindowManager> 
        
                    <asp:ScriptManager ID="ScriptManager1" runat="server">  
        
                    </asp:ScriptManager> 
        
                    <script language="javascript" type="text/javascript">  
        
                        Telerik.Web.UI.RadWindowUtils.Localization =  
        
                        {  
        
                            "Close": '<asp:Literal ID="radClose" runat="server" Text="<%$Resources:Button, btnClose%>" />',  
        
                            "OK": '<asp:Literal ID="radOk" runat="server" Text="<%$Resources:Button, btnOk%>" />',  
        
                            "Cancel": '<asp:Literal ID="radCancel" runat="server" Text="<%$Resources:Button, btnCancel%>" />',  
        
                            "Yes": '<asp:Literal ID="radYes" runat="server" Text="<%$Resources:Common, rbtnYes%>" />',  
        
                            "No": '<asp:Literal ID="radNo" runat="server" Text="<%$Resources:Common, rbtnNo%>" />'  
        
                        };  
        
                    </script> 
        
                    <telerik:RadInputManager ID="radMgr" runat="server">  
        
                        <telerik:TextBoxSetting BehaviorID="text">  
        
                            <Validation IsRequired="true" /> 
        
                            <TargetControls> 
        
                                <telerik:TargetInput ControlID="txtNewValue" /> 
        
                            </TargetControls> 
        
                        </telerik:TextBoxSetting> 
        
                        <telerik:NumericTextBoxSetting BehaviorID="numeric" MinValue="0" MaxValue="999999">  
        
                            <Validation IsRequired="true" /> 
        
                            <TargetControls> 
        
                                <telerik:TargetInput ControlID="txtNewValue" /> 
        
                            </TargetControls> 
        
                        </telerik:NumericTextBoxSetting> 
        
                    </telerik:RadInputManager> 
        
                    <telerik:RadScriptBlock ID="scriptBlock1" runat="server">  
        
                        <script language="javascript" type="text/javascript">  
        
                            function GetRadWindow()  
        
                            {  
        
                                var oWindow = null;  
        
                                if (window.radWindow) oWindow = window.radWindow;  
        
                                else if (window.frameElement.radWindow) oWindow = window.frameElement.radWindow;  
        
                                return oWindow;  
        
                            }  
        
                            function PopulateData()  
        
                            {  
        
                                var oObject = GetRadWindow().argument;  
        
                                document.getElementById('hdnTransactionId').value = oObject.TransactionId;  
        
                                document.getElementById('hdnValueType').value = oObject.ValueType;  
        
                                document.getElementById('hdnOldValue').value = oObject.OldValue;  
        
                                document.getElementById('hdnOriginalValue').value = oObject.OriginalValue;  
        
                                $("#spanOriginalValue").text(oObject.OldValue);  
        
                                $("#spanTitle").text('<asp:Literal ID="ltrlUpdateTransaction" runat="server" Text="<%$ Resources:ltrlUpdateTransaction%>"></asp:Literal>');  
        
                                $("#spanOriginal").text('<asp:Literal ID="ltrlOriginal" runat="server" Text="<%$ Resources:ltrlOriginal%>"></asp:Literal>');  
        
                                $("#spanNewVaue").text('<asp:Literal ID="ltrlUpdated" runat="server" Text="<%$ Resources:ltrlUpdated%>"></asp:Literal>');  
        
                                if (oObject.ValueType == 'ValueType1')  
        
                                {  
        
                                    document.getElementById('txtNewValue').setAttribute('maxLength', "6");  
        
                                }  
        
                                else if (oObject.ValueType == 'ValueType2')  
        
                                {  
        
                                    document.getElementById('txtNewValue').setAttribute('maxLength', "10");  
        
                                }  
        
                                SetMandatory(oObject.ValueType);  
        
                            }  
        
                            function Close(valueType, newValue)  
        
                            {  
        
                                var arg = new Object();  
        
                                arg.ValueType = valueType;  
        
                                arg.NewValue = newValue;  
        
                                var oWnd = GetRadWindow();  
        
                                oWnd.close(arg);  
        
                            }  
        
                            function SetMandatory(valueType)  
        
                            {  
        
                                if (IsInputManagerValid("<%=radMgr.ClientID %>"))   
        
                                {  
        
                                    var im = $find("<%=radMgr.ClientID %>");  
        
                                    var text = im.get_inputSettings('text');  
        
                                    var numeric = im.get_inputSettings('numeric');  
        
                                    if (valueType == 'ValueType1')  
        
                                    {  
        
                                        text.set_isRequired(false);  
        
                                        numeric.set_isRequired(true);  
        
                                    }  
        
                                    else if (valueType == 'ValueType2')  
        
                                    {  
        
                                        text.set_isRequired(true);  
        
                                        numeric.set_isRequired(false);  
        
                                    }  
        
                                }  
        
                            }  
        
                            $(document).ready(function()   
        
                            {  
        
                                PopulateData();  
        
                            });  
        
                        </script> 
        
                    </telerik:RadScriptBlock>   
        
                    <telerik:RadAjaxPanel ID="ajaxPnlTransactionUpdate" runat="server" EnableEmbeddedScripts="true" LoadingPanelID="RadAjaxLoadingPanel1">    
        
                        <div id="divUpdateTransaction" runat="server">  
        
                            <table width="98%" cellpadding="5px">  
        
                                <tr> 
        
                                    <td> 
        
                                        <div> 
        
                                            <h2> 
        
                                                <span id="spanTitle"><asp:Literal ID="ltrlTitle" runat="server" Text="Update Transaction"></asp:Literal></span>  
        
                                            </h2> 
        
                                            <div> 
        
                                                <table width="98%">  
        
                                                    <tr> 
        
                                                        <td style="width: 70%">  
        
                                                            <span id="spanOriginal"><asp:Literal ID="ltrlOriginal" runat="server"></asp:Literal></span>  
        
                                                        </td> 
        
                                                        <td style="width: 30%">  
        
                                                            <span id="spanOriginalValue"><asp:Literal ID="ltrlOriginalValue" runat="server" Text=""></asp:Literal></span>  
        
                                                        </td> 
        
                                                    </tr> 
        
                                                    <tr> 
        
                                                        <td style="width: 70%">  
        
                                                            <span id="spanNewVaue"><asp:Literal ID="ltrlNewVaue" runat="server"></asp:Literal></span>  
        
                                                        </td> 
        
                                                        <td style="width: 30%">  
        
                                                            <asp:TextBox ID="txtNewValue" runat="server" Width="80px" MaxLength="10"></asp:TextBox> 
        
                                                        </td> 
        
                                                    </tr> 
        
                                                </table> 
        
                                            </div> 
        
                                            <div class="clear">  
        
                                                &nbsp;  
        
                                            </div> 
        
                                            <div id="divButton" runat="server" style="width:90%">  
        
                                                <p class="buttons">  
        
                                                    <asp:Button ID="btnSave" runat="server" Text="<%$ Resources:Button, btnSave %>" OnClick="btnSave_OnClick" /> 
        
                                                    <asp:Button ID="btnCancel" runat="server" Text="<%$ Resources:Button, btnCancel %>" OnClientClick="GetRadWindow().close()" /> 
        
                                                </p> 
        
                                            </div> 
        
                                            <div id="hdnHidden">  
        
                                                <asp:HiddenField ID="hdnTransactionId" runat="server" /> 
        
                                                <asp:HiddenField ID="hdnValueType" runat="server" /> 
        
                                                <asp:HiddenField ID="hdnOldValue" runat="server" /> 
        
                                                <asp:HiddenField ID="hdnOriginalValue" runat="server" /> 
        
                                                <asp:HiddenField ID="hdnTimeStampId" runat="server" /> 
        
                                            </div> 
        
                                        </div> 
        
                                    </td> 
        
                                </tr> 
        
                            </table> 
        
                        </div> 
        
                    </telerik:RadAjaxPanel> 
        
                </form> 
        
            </body> 
        
            </html>

    
            using System;  
        
            using System.Collections;  
        
            using System.Collections.Generic;  
        
            using System.Configuration;  
        
            using System.Data;  
        
            using System.Web;  
        
            using System.Web.Security;  
        
            using System.Web.UI;  
        
            using System.Web.UI.HtmlControls;  
        
            using System.Web.UI.WebControls;  
        
            using System.Web.UI.WebControls.WebParts;  
        
            using System.Xml.Linq;  
        
            using Telerik.Web.UI;  
        
            namespace Transaction  
        
            {  
        
                public partial class TransactionUpdate : BasePage  
        
                { 
        
                    #region Variables  
        
                    string TransactionDetailsLastUserId = "TransactionDetailsLastUserId";  
        
                    string TransactionDetailsTimeStampId = "TransactionDetailsTimeStampId"; 
        
                    #endregion  
        
                    #region Event Handlers  
        
                    protected void Page_Load(object sender, EventArgs e)  
        
                    {  
        
                    }  
        
                    protected void btnSave_OnClick(object sender, EventArgs e)  
        
                    {  
        
                        try 
        
                        {  
        
                            string transactionID = hdnTransactionId.Value.ToString().Trim();  
        
                            long? customerId = SessionManager.UserSettings.DataContext.CustomerID;  
        
                            string valueType = hdnValueType.Value.ToString().Trim();  
        
                            string oldValue = hdnOldValue.Value.ToString().Trim();  
        
                            string newValue = txtNewValue.Text.ToString().Trim();  
        
                            long userId = SessionManager.UserSettings.AppUserID;                  
        
                            //call to DB to fetch the corresponding TimestampId and Last User ID  
        
                            CommonFacade commonFacade = new CommonFacade();  
        
                            DataSet dsValues = (DataSet)commonFacade.GetTimestampFromTransactionId(transactionID);  
        
                            long lastUserId = string.IsNullOrEmpty(dsValues.Tables[0].Rows[0]["Last_UserId"].ToString()) ? 0 : Convert.ToInt64(dsValues.Tables[0].Rows[0]["Last_UserId"]);  
        
                            byte[] oldTimeStampId = (byte[])dsValues.Tables[0].Rows[0]["Timestamp_Id"];  
        
                            byte[] newTimeStampId = null;  
        
                            if (!object.Equals(oldValue.ToString().Trim(), newValue.ToString().Trim()))  
        
                            {  
        
                                ReportBiz report = new ReportBiz();  
        
                                newTimeStampId = report.TransactionValueUpdate(transactionID, valueType, newValue, userId, oldTimeStampId);  
        
                                Session[TransactionDetailsTimeStampId] = newTimeStampId;  
        
                                if (string.IsNullOrEmpty(newValue)) newValue = hdnOriginalValue.Value;  
        
                            }  
        
                            ScriptManager.RegisterStartupScript(Page, typeof(Page), "CloseWindow", "<script type=\"text/javascript\">Close('" + valueType + "', '" + newValue + "');</script>", false);  
        
                        }  
        
                        catch (BusinessException ex)  
        
                        {  
        
                            this.ShowRadErrorAlert(ex.Key);  
        
                        }  
        
                    } 
        
                    #endregion  
        
                }  
        
            }

Input

answered on 20 Apr 2010

2 answers

140 views

DatePicker and Validation

I am attempting to implement a number of RadDatePickers throughout an application. I am stuck, though, on performing validation the way I want it to work. The desired behavior would be to have a Validator attached to the DatePicker that prevents the page from posting back if the text in the DateInput is not a valid date, but does allow a post if the DateInput is empty. None of the standard ASP.NET validators seem to do the job because the DateInput appears empty to them whenever it has an invalid text. This behavior would be necessary on a number of different pages throughout the application, so individually handling each DatePicker with a CustomValidator would not be a desirable solution. Is there some solution that would work using the available validation tools, or would implementing a new validator type be the best way to accomplish this?

Input

answered on 20 Apr 2010

7 answers

291 views

f.getItem(...) is null or not an object

I'm trying to manually transfer list items on the client side and received the script error 'f.getItem(...)' is null or not an object when the following method is called:

sender.transferItem(item, e.get_sourceListBox(), e.get_destinationListBox());

Basically, the aspx page has a source and destination listbox. The source listbox is pre-populated in the code behind with a list of approximately 10 items. The error occurs when a transfer is performed from the source to the destination listbox or from the destination to the source listbox.

The code for the JavaScript function that is called by the source listbox for the OnCLientTransferring event is as follows:

    
            function RadListBoxColumnSource_OnClientTransferring(sender, e)  
        
                        {  
        
                            // Cancel the transfer so that can validate which items can be transferred.  
        
                            e.set_cancel(true);  
        
                            // Manually transfer items that are not formula items.  
        
                            var items = e.get_items();  
        
                            for (var i = 0; i < items.length; i++)  
        
                            {  
        
                                var item = items[i];  
        
                                // If the tooltip information is available then the item is a formula.  
        
                                var toolTip = item.get_toolTip();  
        
                                if ((toolTip == null) || (toolTip.length() == 0))  
        
                                {  
        
                                    sender.transferItem(item, e.get_sourceListBox(), e.get_destinationListBox());  
        
                                }  
        
                            }  
        
                            return;  
        
                        }

The code snippet for the listboxes in the aspx page is as follows:

    
            <table style="font-size: 0.7em; font-family: Verdana" width="500px">  
        
                        <tr> 
        
                            <td> 
        
                                <asp:Panel ID="PanelSource" runat="server" GroupingText="Data Columns" Width="100%">  
        
                                    <telerik:RadListBox ID="RadListBoxColumnSource" runat="server" AllowReorder="false" AllowTransfer="true" EnableDragAndDrop="true" SelectionMode="Multiple" TransferToID="RadListBoxColumnTarget" Width="220px" Height="400px" OnClientTransferring="RadListBoxColumnSource_OnClientTransferring" > 
        
                                        <ButtonSettings ShowTransferAll="true" /> 
        
                                    </telerik:RadListBox> 
        
                                </asp:Panel> 
        
                            </td> 
        
                            <td> 
        
                                <asp:Panel ID="PanelTarget" runat="server" GroupingText="Selected Data Columns" Width="100%">  
        
                                    <telerik:RadListBox ID="RadListBoxColumnTarget" runat="server" AllowReorder="true" EnableDragAndDrop="true" SelectionMode="Multiple" Width="220px" Height="400px" > 
        
                                        <ButtonSettings ShowReorder="true" />                          
        
                                    </telerik:RadListBox> 
        
                                </asp:Panel> 
        
                            </td> 
        
                        </tr> 
        
                    </table>

The browser version is Internet Explorer 8.0.6001.18702 and the version of the Telerik controls are 2009.2.826.

Any help in resolving this issue is appreciated.

Thanks,

Tony

ListBox

answered on 20 Apr 2010

3 answers

130 views

Losing User Authentication

I have a page on my site that appears to cause a loss of user authentication when I use the controls. I'm not sure the problem is related the specific control (RagGrid), and it seems to get a little better if I turn off the AJAX manager, but in general I can't seem to solve the problem.

When I perform functions like inserting or editing data using the grid, the attempted functions appears not to work. Anything that I try to do afterwards (causeing a postback) will respond as if I am not logged in, whcih is in fact the case.

My httpRuntime timeout in config.sys is set pretty high (1200 seconds), but that doesn't matter as the problem occurs within a few seconds. This only happens on the production server (naturally) and doesn't happen in my debugging environment.

Any ideas what might cause this, or where I can look for a solution?

TIA

General Discussions

answered on 20 Apr 2010

2 answers

179 views

Sliding Panelbar in Master page

Hi,
I want a sliding panelbar on my master page. How do I do this?

I've looked at your threads on this issue particularly "MasterPage Affect?" posted last year. I can can get the sliding affect in the content pages but I want the sliding affect on the panel which resides on the master page. I'm not a great javascript expert so I'm having problems migrating the example
http://demos.telerik.com/aspnet-ajax/panelbar/examples/applicationscenarios/slidingpanelbar/defaultcs.aspx

I'd be grateful for assistance.

PanelBar

answered on 20 Apr 2010

10 answers

289 views

MOSS RadEditor Image manager custom settings

Hi everyone
Is it possible to filter the images list to only approved images? By default the image manager shows all the images in the

images document library in MOSS 2007. Can we limit this list by using some query for example " select only the approved items from

the images list ". I am using the MossRadEditor in code behind in a web part.

Regards
Sohail

WebParts for SharePoint

answered on 20 Apr 2010

1 answer

130 views

Treeview update problem

Hi,

I have this setup:

A page containing a RadToolBar and a user control containing a RadTreeView:

    
            <abc:TreeView ID="tvEmner" runat="server" /><!-- User control containing a telerik:RadTreeView control -->

In the usercontrol, the radtreeview is declared like this:

    
            <asp:Panel ID="pnlEmner" runat="server"> 
        
            <tel:RadTreeView ID="tvEmner" EnableDragAndDrop="true" Width="300px" Height="250px" 
        
                                             OnNodeDrop="OnEmneDropped" OnNodeClick="OnEmneClicked" OnNodeExpand="OnEmneExpanded" 
        
                                             OnClientNodeClicking="onEmneNodeClicking" 
        
                                             OnClientContextMenuItemClicking="onEmneContextMenuItemClicking" OnClientContextMenuShowing="onEmneContextMenuShowing" 
        
                                             runat="server"> 
        
                <ContextMenus> 
        
                    <tel:RadTreeViewContextMenu ID="cmRoot" runat="server"> 
        
                  <Items> 
        
                    <tel:RadMenuItem Value="Create" PostBack="false" Text="Opret emne"> 
        
                    </tel:RadMenuItem> 
        
                  </Items> 
        
                  <CollapseAnimation Type="none" /> 
        
                    </tel:RadTreeViewContextMenu> 
        
                </ContextMenus> 
        
                <DataBindings> 
        
                    <tel:RadTreeNodeBinding Expanded="True" /> 
        
              </DataBindings> 
        
            </tel:RadTreeView> 
        
            </asp:Panel>

I have the following scenario:
1. The user selects a node in the treeview
2. The user clicks a "Add node" button in the toolbar.
3. The toolbar client side-opens a modal window (radwindow) , in which the name of the new node is entered.
4. When the modal window closes, the treeview should be reloaded to reflect that the new node has been added

To do this, the page calls this JavaScript in the usercontrol containing the treeview:

    
            var node = Al.EmneTreeView.getSelectedNode(); // function that gets the selected node 
        
            node.collapse(); 
        
            node.get_treeView().trackChanges(); 
        
            node.get_nodes().clear(); 
        
            node.set_expandMode(Telerik.Web.UI.TreeNodeExpandMode.ServerSideCallBack); 
        
            node.get_treeView().commitChanges(); 
        
            node.expand();

I know that the node is added to the datasource for the tree view and I can see that the JavaScript code is executed. However, the list of nodes is not reloaded in the GUI.

I have also implemented the option to add nodes through a right-click context menu. In this scenario, everything works fine.
I have tried to add the user control to the radajaxmanager proxy, with no success, like this:

    
            <tel:RadAjaxManagerProxy ID="PageAjaxManager" runat="server"> 
        
                    <AjaxSettings> 
        
                        <tel:AjaxSetting AjaxControlID="tbButtons"> 
        
                            <UpdatedControls> 
        
                                <tel:AjaxUpdatedControl ControlID="tbButtons" /> 
        
                                <tel:AjaxUpdatedControl ControlID="tvEmner" LoadingPanelID="AjaxLoadingPanel" /> 
        
                            </UpdatedControls> 
        
                        </tel:AjaxSetting> 
        
                    </AjaxSettings> 
        
                </tel:RadAjaxManagerProxy>

Since it works in the context menu scenario, I assume it has something to do with the toolbar not having "access" to update the radtreeview in the user control.

I hope someone can help me with this. Any help will be appreciated.

/Henrik

TreeView

answered on 20 Apr 2010

	function RadListBoxColumnSource_OnClientTransferring(sender, e)
	{

	// Cancel the transfer so that can validate which items can be transferred.
	e.set_cancel(true);

	// Manually transfer items that are not formula items.
	var items = e.get_items();

	for (var i = 0; i < items.length; i++)
	{
	var item = items[i];

	// If the tooltip information is available then the item is a formula.
	var toolTip = item.get_toolTip();
	if ((toolTip == null) \|\| (toolTip.length() == 0))
	{
	sender.transferItem(item, e.get_sourceListBox(), e.get_destinationListBox());
	}
	}

	return;
	}

	<table style="font-size: 0.7em; font-family: Verdana" width="500px">
	<tr>
	<td>
	<asp:Panel ID="PanelSource" runat="server" GroupingText="Data Columns" Width="100%">
	<telerik:RadListBox ID="RadListBoxColumnSource" runat="server" AllowReorder="false" AllowTransfer="true" EnableDragAndDrop="true" SelectionMode="Multiple" TransferToID="RadListBoxColumnTarget" Width="220px" Height="400px" OnClientTransferring="RadListBoxColumnSource_OnClientTransferring" >
	<ButtonSettings ShowTransferAll="true" />
	</telerik:RadListBox>
	</asp:Panel>
	</td>
	<td>
	<asp:Panel ID="PanelTarget" runat="server" GroupingText="Selected Data Columns" Width="100%">
	<telerik:RadListBox ID="RadListBoxColumnTarget" runat="server" AllowReorder="true" EnableDragAndDrop="true" SelectionMode="Multiple" Width="220px" Height="400px" >
	<ButtonSettings ShowReorder="true" />
	</telerik:RadListBox>
	</asp:Panel>
	</td>
	</tr>
	</table>