Questions on UI for ASP.NET AJAX Forum

1 answer

118 views

[Solved] Transferring Item Template Problem

Hi all,

I am having issues transfering data from one list box to another. I am using Item Templates so I know that I need to use "AutoPostBackOnTransfer" and I am handerling the listbox_transferred event. However, my data still does not display in the second list box. Can anyone spot the bit I am missing or doing incorrectly.

default.aspx

<%@ Page Language="VB" AutoEventWireup="false" CodeBehind="Default.aspx.vb" Inherits="TestingListBoxTemplates._Default" %>
 
<!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>Testing List Boxes</title>
    <telerik:RadStyleSheetManager id="RadStyleSheetManager1" runat="server" />
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
        <Scripts>
            <%--Needed for JavaScript IntelliSense in VS2010--%>
            <%--For VS2008 replace RadScriptManager with ScriptManager--%>
            <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
            <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
            <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />
        </Scripts>
    </telerik:RadScriptManager>
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
    </telerik:RadAjaxManager>
    <div>
 
        <telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" height="800px" width="1242px">
            <telerik:RadComboBox ID="rcbContactName"  runat="server" EmptyMessage="Enter a contact name" HighlightTemplatedItems="true" EnableLoadOnDemand="true" AutoPostBack="true" />
 
            <telerik:RadListBox ID="RadListBox1" runat="server" AllowTransfer="True" height="600px" Width="400px" TransferToID="RadListBox2" AutoPostBackOnTransfer="true" OnTransferred="RadListBox1_Transferred">
                <ItemTemplate>
                   <table width="300px">
                        <tr>
                        <td width="100px"><span><%# DataBinder.Eval(Container.DataItem, "contactID")%></span></td>
                        <td colspan="3"><span><%# DataBinder.Eval(Container.DataItem, "FirstName")%> <%# DataBinder.Eval(Container.DataItem, "Surname")%></span></td >
                        </tr>
                        <tr><td><span>Company Name:</span></td><td><span><%# DataBinder.Eval(Container.DataItem, "CompanyName")%></span></td>
                        <td><span>Industries:</span></td><td><span><%# DataBinder.Eval(Container.DataItem, "Industries")%></span></td>
                        </tr>
                        <tr><td><span>Email Address:</span></td><td><span><a href="mailto:<%# DataBinder.Eval(Container.DataItem, "Email")%>"><%# DataBinder.Eval(Container.DataItem, "Email")%></a></span></td>
                        <td><span>Interests:</span></td><td><span><%# DataBinder.Eval(Container.DataItem, "Interests")%></span></td>
                        </tr>
                    </table>
                </ItemTemplate>
            </telerik:RadListBox>
            <telerik:RadListBox ID="RadListBox2" runat="server" Height = "600px" Width="400px">
                <ItemTemplate>
                <span><%# DataBinder.Eval(Container.DataItem, "contactID")%> - 
                <%# DataBinder.Eval(Container.DataItem, "FirstName")%> 
                <%# DataBinder.Eval(Container.DataItem, "Surname")%></span>
                </ItemTemplate>
            </telerik:RadListBox>
        </telerik:RadAjaxPanel>
    </div>
    <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" Runat="server"
        Skin="Default">
    </telerik:RadAjaxLoadingPanel>
    </form>
</body>
</html>

default.aspx.vb

Imports Telerik.Web.UI

Imports System.Data.SqlClient

Partial Class _Default

    Inherits System.Web.UI.Page

    Public sql_Connection As String = "Data Source=TestServer;Initial Catalog=Contacts;User ID=myself;password=password;Connect Timeout=200"

    Private Sub Page_Load(sender As Object, e As System.EventArgs) Handles Me.Load

        If Not IsPostBack Then

            getLBData()

            RadListBox1.DataBind()

            RadListBox2.DataBind()

        End If

    End Sub

    Private Sub rcbContactName_ItemsRequested(sender As Object, e As Telerik.Web.UI.RadComboBoxItemsRequestedEventArgs) Handles rcbContactName.ItemsRequested

        If e.Text.Length > 2 Then

            getNames(e.Text)

        End If

    End Sub

    Private Sub getNames(ByVal fragment As String)

        Dim cnSQL As New SqlConnection(sql_Connection)

        Dim cmdSQL As New SqlCommand

        cmdSQL.Connection = cnSQL

        cmdSQL.CommandType = Data.CommandType.StoredProcedure

        cmdSQL.CommandText = "usp_ContactSearch_prefix"

        cmdSQL.Parameters.AddWithValue("@Contact", fragment)

            'If Not String.IsNullOrEmpty(rcbPartialAddress.Text) Then cmdSQL.Parameters.AddWithValue("@Address", rcbPartialAddress.Text)

            'If Not String.IsNullOrEmpty(rcbEmailAddress.Text) Then cmdSQL.Parameters.AddWithValue("@Email", rcbEmailAddress.Text)

Try

                Dim daSQL As New SqlClient.SqlDataAdapter(cmdSQL)

                Dim dataTable As New DataTable()

                daSQL.Fill(dataTable)

                For Each dataRow As DataRow In dataTable.Rows

                    rcbContactName.Items.Add(New RadComboBoxItem(DirectCast(dataRow("contactName"), String), dataRow("contactid").ToString()))

                Next

                rcbContactName.DataBind()

            Catch

            Finally

                If cnSQL.State <> Data.ConnectionState.Closed Then

                    cnSQL.Close()

                End If

            End Try

    End Sub

    Private Sub rcbContactName_SelectedIndexChanged(sender As Object, e As Telerik.Web.UI.RadComboBoxSelectedIndexChangedEventArgs) Handles rcbContactName.SelectedIndexChanged

        RadListBox1.DataSource = getLBData()

        RadListBox1.DataBind()

    End Sub

    Public Sub RadListBox1_Transferred(sender As Object, e As Telerik.Web.UI.RadListBoxTransferredEventArgs) Handles RadListBox1.Transferred

        For Each item As RadListBoxItem In e.Items

            item.DataBind()

        Next

    End Sub

    Private Function getLBData()

        Dim cnSQL As New SqlConnection(sql_Connection)

        Dim cmdSQL As New SqlCommand

        cmdSQL.Connection = cnSQL

        cmdSQL.CommandType = Data.CommandType.StoredProcedure

        cmdSQL.CommandText = "usp_SearchLyrisContacts"

        cmdSQL.Parameters.Add("@ContactName", DbType.String).Value = rcbContactName.Text

        Dim dataTable As New DataTable()

Try

            Dim daSQL As New SqlClient.SqlDataAdapter(cmdSQL)

            daSQL.Fill(dataTable)

        Catch

        Finally

            If cnSQL.State <> Data.ConnectionState.Closed Then

                cnSQL.Close()

            End If

        End Try

        Return dataTable

    End Function

End Class

ListBox

answered on 02 Mar 2012

1 answer

90 views

Select Files then Upload with Button

I am using the RadAsyncUpload control, I have successfully implemented a custom handler to save the uploaded files into SharePoint, that is all work ok.

Prior to the control uploading the files I want to show the files that were selected, capture a description relating to all the selected files and then have an "Upload" button that sends them off to the server.

I did consider using the RadUpload control but that doesn't give the MultipleFileSelection like the silverlight/flash control within the RadAsyncUpload.

My main requirement is letting users select multiple files, display the chosen files and then allow the user to confirm the selection prior to upload.

AsyncUpload

answered on 02 Mar 2012

1 answer

123 views

Custom Control with RadComboBox postback issue

Hi,

Im very new to this.. So please bear with my ignorance..
I have a Custom control that Contains a RadComboBox and a script(I didnt write the code)..
Only some of the Client Side properties of the Radcombobox have been exposed so far.. I want to
add an event on RadComboBox that will populate a Textbox (placed inside a UpdatePanel) when the SelectedIndex is changed..
I enabled autopostback on the radcontrol and added an event handling mechanism..

However, Whenever I try to click on a value in Radcombobox, I get an error in the WebResource_2.axd error..

Microsoft JScript runtime error: Object doesn't support property or method 'indexOf'

The following line is highlighted
if(Sys.Browser.agent===Sys.Browser.InternetExplorer){var y=j.indexOf("#");if(y!==d)j=j.substr(0,y);

Can someone please guide me on how do I resolve this error?

Here is the relevant code






...

public event EventHandler click;
 
        public void RaisePostBackEvent(string eventArgument)
        {
            click1(this, EventArgs.Empty);
        }
 
        public virtual void click1(object sender, EventArgs e) {
            if (click != null)
                click(this, e);
        }
 

        private readonly RadComboBox radCombo = new RadComboBox
                                           {
                                               EnableVirtualScrolling = true,
                                               EnableLoadOnDemand = true,
                                               MaxHeight = 300,
                                               Width = Unit.Percentage(100),
                                               ShowMoreResultsBox = true,
                                               ItemsPerRequest = 25,
                                               OnClientItemsRequesting = "comboSetContext",
                                               AutoPostBack = true
                                           };
 
        protected override void CreateChildControls()
        {
            radCombo.ID = ID + "_cb";
            radCombo.ExpandAnimation.Duration = 200;
            radCombo.CollapseAnimation.Duration = 200;
            radCombo.WebServiceSettings.Path = "/combo.ashx";
            radCombo.WebServiceSettings.UseHttpGet = true;
            radCombo.WebServiceSettings.Method = ComboHandler;
            radCombo.OnClientItemDataBound = "catComboItemDataBound";
            radCombo.ToolTip = ToolTip;
            if (string.IsNullOrEmpty(ComboHandler))
            {
                throw new Exception("Must specify a ComboHandler for CatComboBox " + ID);
            }
            Controls.Add(radCombo);
            Controls.Add(new ScriptBlock { Script = "$('#" + ClientID + "_cb_Input').keydown(comboEnterPressed);" });
        }

ComboBox

answered on 02 Mar 2012

1 answer

134 views

[Solved] RadCombobox problem

We have telerik license of version 2009.3.1314.35.

At one page, we have used radcombobox with ondemand rendering as below,

<telerik:RadComboBox ID="ddlEmployee" runat="server" Width="250px" Height="100px"
EmptyMessage="Select employee " EnableLoadOnDemand="True" EnableVirtualScrolling="true"
OnItemsRequested="RadComboBox1_ItemsRequested" DataTextField="Name" DataValueField="EmpNo"
Skin="WindowsXP" OffsetX="2" AllowCustomText="True" EnableEmbeddedSkins="False"
EnableAjaxSkinRendering="False" EnableEmbeddedBaseStylesheet="False" EnableItemCaching="True"
ShowMoreResultsBox="True">
</telerik:RadComboBox>

My requirement is to enable on demand functionality for employee list. The objective is, at page load I should be able to set selectedvalue item to employee combbox and also to achieve on demand functionality in it

The above scenario works fine if I dont set selectedvalue item to combobox in page load.

My observation while debugging.
The problem with RadCombobox is that if we bind the RadCombobox on page load, and try to click in combobox text area RadComboBox1_ItemsRequested is not get fired. However, if start writing something in RadCombobox text area RadComboBox1_ItemsRequested is get fired.

Please help us to achieve this functionality in combobox.

Thanks in advance.

ComboBox

answered on 02 Mar 2012

1 answer

82 views

Editor Customization

We are evaluating Telerik HTML Editor for our application. One of the feature we are suppose to implement is to give a users a page construction capabilities where they will design their own page, but populate with data that are stored in database. We are going to provide a placeholder fields that will allow users to place database field in the page. In this way users will provide a user defined content and the database field will act as a place holder field that will populated dynamically when the page is executed.

We have few questions on how to best implement this kind of solution.

1. What is the best way to implement such solution ?
2. Is there any way we can dynamically inject our own HTML/Javascript to the editor as user places a database field ?
3. We need a data repeater kind of functionality, so users will need to ensure that they initiate this data repeater by placing a <start> place holder in the page and then place a <end> place holder.

Let me know if you need any more info.

Thanks in advance for your help.

Editor

answered on 02 Mar 2012

1 answer

282 views

[Solved] InsertCommand, UpdateCommand, and Deletecommand not firing

Hello everyone,

I have a telerik Grid and when I try to use insert, update or delete the events on in the code behind never fire. The popup does go away though and it looks like the grid is being updated. This is what I have for the code:

<telerik:RadGrid

ID="ClaimFormPartsGrid" runat="server"

GridLines="None" Skin="Simple"

AutoGenerateColumns="False"

AllowSorting="False"

AllowMultiRowSelection="False">

<MasterTableView

EditMode="PopUp" CommandItemDisplay="Top"

InsertItemDisplay="Top" CommandItemSettings-ShowRefreshButton="False"

CommandItemSettings-ShowAddNewRecordButton="True" AutoGenerateColumns="False" EnableViewState="True"

DataKeyNames="key">

<Columns>

<telerik:GridEditCommandColumn UniqueName="EditCommand"/>

<telerik:GridBoundColumn UniqueName="key" DataField="key" HeaderText="Name"/>

<telerik:GridBoundColumn UniqueName="value" DataField="value" HeaderText="Value"/>

<telerik:GridButtonColumn UniqueName="DeleteCommand" Text="Delete" CommandName="DeleteCommand" />

</Columns>

<EditFormSettings EditFormType="Template" InsertCaption="Adding new Claim Form Part"

CaptionFormatString="Editing Claim Form Part" PopUpSettings-Modal="True" PopUpSettings-ScrollBars="None">

<FormTemplate>

<div class="rust-form">

<fieldset class="no-bg">

<legend></legend>

<ul>

<li>

<asp:Label runat="server" ID="keyNameLabel" AssociatedControlID="KeyNameTextBox">Name: </asp:Label>

<asp:TextBox runat="server" ID="keyNameTextBox"></asp:TextBox>

</li>

<li>

<asp:Label runat="server" ID="keyValueLabel" AssociatedControlID="KeyValueTextBox">Value: </asp:Label>

<asp:TextBox runat="server" ID="keyValueTextBox"></asp:TextBox>

</li>

</ul>

</fieldset>

<ul class="rust-action-btns">

<li>

<asp:Button ID="InsertUpdateButton" runat="server"

Text="Save" CssClass="rust-primary-btn" TabIndex="1"

CommandName='<%# (Container is GridEditFormInsertItem) ? "PerformInsert" : "" %>' /> />

</li>

<li>

<asp:Button ID="ClaimCancelButton" runat="server" CausesValidation="False"

Text="Cancel" CssClass="rust-secondary-btn"

CommandName="Cancel" />

</li>

</ul>

</div>

</FormTemplate>

</EditFormSettings>

</MasterTableView>

</telerik:RadGrid>

protected override void OnInit(EventArgs e)

{

base.OnInit(e);

this.ClaimFormPartsGrid.NeedDataSource += this.ClaimFormPartsGrid_NeedData;

this.ClaimFormPartsGrid.ItemDataBound += this.ClaimFormPartsGrid_ItemDataBound;

this.ClaimFormPartsGrid.InsertCommand += this.ClaimFormPartsGrid_InsertCommand;

this.ClaimFormPartsGrid.UpdateCommand += this.ClaimFormPartsGrid_UpdateCommand;

this.ClaimFormPartsGrid.DeleteCommand += this.ClaimFormPartsGrid_DeleteCommand;

}

protected void ClaimFormPartsGrid_NeedData(object sender, GridNeedDataSourceEventArgs e)

{

var source = new List<KeyValuePair<string, string>>();

source.Add(new KeyValuePair<string, string>("1", "1"));

source.Add(new KeyValuePair<string, string>("2", "2"));

source.Add(new KeyValuePair<string, string>("3", "3"));

source.Add(new KeyValuePair<string, string>("4", "4"));

this.ClaimFormPartsGrid.DataSource = source;

}

protected void ClaimFormPartsGrid_ItemDataBound(object sender, GridItemEventArgs e)

{

if(e.Item.IsInEditMode)

{

var gei = e.Item as GridEditableItem;

if(gei == null)

{

return;

}

var nameTextbox = (TextBox)gei.FindControl("keyNameTextBox");

var valueTextbox = (TextBox) gei.FindControl("keyValueTextBox");

if(gei.OwnerTableView.IsItemInserted)

{

// Inserting.

nameTextbox.Text = string.Empty;

valueTextbox.Text = string.Empty;

}

else

{

// Editing.

var keyValue= (KeyValuePair<string, string>) gei.DataItem;

nameTextbox.Text = keyValue.Key.ToString();

valueTextbox.Text = keyValue.Value.ToString();

}

else

{

// displaying

var gdi = e.Item as GridDataItem;

if (gdi == null)

{

return;

}

var keyValue= (KeyValuePair<string,string>)gdi.DataItem;

var deleteButton = gdi["DeleteCommand"].Controls[0] as LinkButton;

if(deleteButton != null)

{

deleteButton.Attributes["onclick"] = "return confirm('Are you sure you want to delete " + keyValue.Key + "?')";

}

protected void ClaimFormPartsGrid_InsertCommand(object sender, GridCommandEventArgs e)

{

var gei = e.Item as GridEditableItem;

if (gei == null)

{

return;

}

var nameTextbox = (TextBox)gei.FindControl("keyNameTextBox");

var valueTextbox = (TextBox)gei.FindControl("keyValueTextBox");

}

protected void ClaimFormPartsGrid_UpdateCommand(object sender, GridCommandEventArgs e)

{

var gei = e.Item as GridEditableItem;

if (gei == null)

{

return;

}

var oldName = (KeyValuePair<string, string>)gei.DataItem;

var nameTextbox = (TextBox)gei.FindControl("keyNameTextBox");

var valueTextbox = (TextBox)gei.FindControl("keyValueTextBox");

}

protected void ClaimFormPartsGrid_DeleteCommand(object sender, GridCommandEventArgs e)

{

var gei = e.Item as GridEditableItem;

if (gei == null)

{

return;

}

Does anyone have an Idea?

Grid

answered on 02 Mar 2012

3 answers

429 views

Controlling RadWindow Autosize Scroll Bars Better

Hi,

I've searched the threads on this issue, and I've found that there does not seem to be a good, consistent global solution for really benefitting from the Autosize property.

Overall, it appears to me that if you page grows just a tiny bit after the PageLoad event, you get unsightly scroll bars. The only way that I've been able to avoid that is to set the MinWidth/Height properties, which results in a somewhat time consuming "hit and miss" guessing game on the best sizes.

It seems to me, that there should be a way to add a "Autosize" buffer, or something like, maybe utilizing a CSS. Has anybody found a good way to tackle this globally, with CSS on the RadWindow, or the page itself, or by some other technique. Or, does anyone know how to run the Autosize() function at a time later than the PageLoad, to help deal with the issue of the page grows a little but with some client side rendering or something?

Check out the screen shot for some perspective on my problem.

Thanks a ton.

Jim

Window

answered on 02 Mar 2012

2 answers

123 views

Datetime Control

Hi Telerik Team,

I need a DataTime control in which user can manually change mins as well like dateedit of Dev express.

Please suggest me same.

Thanks in advance.

General Discussions

answered on 02 Mar 2012

1 answer

176 views

Vertical Line on Radchart

Trying to draw a vertical line with x-axis as Datetime. How to set the X-axis a Constant Date using MarkedZones.

<MarkedZones>
<telerik:ChartMarkedZone Name="Marked zone 1" >
<Appearance>
<Border Width="2" Color="Pink" />
</Appearance>
</telerik:ChartMarkedZone>
</MarkedZones>

Chart (Obsolete)

answered on 02 Mar 2012

1 answer

91 views

Selecting Image Properties, Selecting new Image Src - Src value not changed

Hello,

I've just started experiencing this. I have an Editor on a page. I go to HTML view, paste in some HTML, which includes an image, then switch to DESIGN view, right click on the image, select Properties, and then for the Image Src, I browse to select a replacement image. When I select it and click OK, it does NOT replace the value in the Image Src field. To get this to work, I have to clear the Image Src value, then browse and select the image.

Any ideas? Need more information?

Thank you.

Editor

answered on 02 Mar 2012