Questions on UI for ASP.NET AJAX Forum

3 answers

95 views

Hello All,

I am working on with the TextChanged property of RadCombo box, when I type something in the box and press tab key it works as expected, but when I delete few letters from the text and press tab key to proceed the textchanged property will not triggered. I also have the AllowCustomText="true" in the combobox and first character matching allowed by :
ddlVessel.Filter = (RadComboBoxFilter)Convert.ToInt32(2);

ComboBox

answered on 19 Dec 2011

3 answers

64 views

Related ComboBoxes - Second Combo Not Showing Values

I feel like I'm missing something here, but I can't seem to get a pair of related comboboxes working.

When I select something in the primary combo, I get the proper callback, and everything seems to flow correctly. I threw an alert in the javascript "ItemsLoaded", and the secondary combo has items. But when the secondary drop down opens, it is blank. Empty. Nada.

Grrrr. Here's the code:

From ucOffenseEdit.ascx (user control for a RadGrid edit/add), the ComboBoxes themselves:

<table cellpadding="0" cellspacing="4" class="InnerContents" width="100%">

<tr>

<td style="vertical-align: top" colspan="4">

<asp:Label ID="lblUCRCode"

runat="server"

CssClass="FieldLabel"

Text="UCR Code" />

<br />

<telerik:RadComboBox ID="fldUCRCode"

runat="server"

Width="400px"

Height="168px"

SkinID="NoSizing"

Filter="contains"

SelectedValue='<%# Eval("UCRCodeID") %>'

OnClientLoad="ComboSetFocus"

OnClientSelectedIndexChanging="loadOptionalUCRCodes"

OnItemsRequested="fldUCRCode_ItemsRequested" />

<br />

</td>

</tr>

<tr>

<td style="vertical-align: top" colspan="4">

<asp:Label ID="lblUCROptionalDetailCode"

runat="server"

CssClass="FieldLabel"

Text="Optional Detail Code" />

<br />

<telerik:RadComboBox ID="fldUCROptionalDetailCode"

runat="server"

EnableViewState="false"

Width="400px"

Height="168px"

SkinID="NoSizing"

Filter="contains"

SelectedValue='<%# Eval("UCRCodeID") %>'

OnClientItemsRequested="ItemsLoaded"

OnItemsRequested="fldUCROptionalDetailCode_ItemsRequested" />

</td>

</tr>

... etc.

</table>

Now the javascript. For simplicity sake, I'm putting it right in the page where the RadGrid lives. Eventually (when it works), I'll emit it from the user control's codebehind:

function loadOptionalUCRCodes(sender, eventArgs) {

var id = sender.get_id();

var optionalCombo = $find(id.substring(0, id.length - 10) + "fldUCROptionalDetailCode");

var item = eventArgs.get_item();

optionalCombo.set_text("Loading...");

// if a UCR Code is selected...

if (item.get_index() > 0) {

// ...load the optional combo

optionalCombo.requestItems(item.get_value(), false);

} else {

optionalCombo.set_text(" ");

optionalCombo.clearItems();

}

function ItemsLoaded(sender, eventArgs) {

if (sender.get_items().get_count() > 0) {

// pre-select the first item

sender.set_text(sender.get_items().getItem(0).get_text());

sender.get_items().getItem(0).highlight();

}

sender.showDropDown();

}

Finally, the codebehind from the user control:

protected void Page_Load(object sender, EventArgs e) {

LoadUCRCodes();

if (!Page.IsCallback) { LoadOptionalUCRCodes(fldUCRCode.SelectedValue); }

}

protected void fldUCRCode_ItemsRequested(object o, RadComboBoxItemsRequestedEventArgs e) {

LoadUCRCodes();

}

protected void fldUCROptionalDetailCode_ItemsRequested(object o, RadComboBoxItemsRequestedEventArgs e) {

//passes the value of the UCRCode

LoadOptionalUCRCodes(e.Text);

}

protected void LoadUCRCodes() {

if (fldUCRCode.Items.Count == 0) {

fldUCRCode.Items.Add(new Telerik.Web.UI.RadComboBoxItem(string.Empty, "-1"));

foreach (DAL.LookupClasses.INCUCRCodeLookupItem l in Lookups.INC.UCRCode.AllItems) {

if (!l.Parent.HasValue) {

fldUCRCode.Items.Add(new Telerik.Web.UI.RadComboBoxItem(l.DropDownText, l.ID.ToString()));

}

protected void LoadOptionalUCRCodes(string UCRCodeID) {

fldUCROptionalDetailCode.Items.Clear();

if (fldUCROptionalDetailCode.Items.Count == 0) {

fldUCROptionalDetailCode.Items.Add(new Telerik.Web.UI.RadComboBoxItem(string.Empty, "-1"));

foreach (DAL.LookupClasses.INCUCRCodeLookupItem l in Lookups.INC.UCRCode.AllItems) {

if (l.Parent.HasValue) {

if (l.Parent.ToString() == UCRCodeID) {

fldUCROptionalDetailCode.Items.Add(new Telerik.Web.UI.RadComboBoxItem(l.DropDownText, l.ID.ToString()));

}

ComboBox

answered on 19 Dec 2011

1 answer

71 views

RadComboBox dropdown will not display in a RadPanelBar

I have a RadComboBox that displays a grid filtered on user input. After 2 characters the grid is filtered and displayed for the user to select from.

The RadComboBox works fine until I place it in a RadPanelBar RadPanelItem. Then when the second character is typed the grid is filtered and displayed, but immediately closes.

I couldn't figure it out and finally replaced the RadComboBox with jQuery Autocomplete widget. The exact same thing happens. When the user types in the second character the dropdown appears but then is immediately closed. Clicking on the icon displays the list just fine.

Is there a setting for RadPanelBar that I am not getting?

PanelBar

answered on 19 Dec 2011

1 answer

85 views

HTML Text column Breaks Grid formatting

I have a table with several nvarchar(max) fields that have HTML in them. I want to show the first bit of the text in a column in a RadGrid so the user can filter on the column. But when I put the column in as the last column on the right, the right part of the text is cut off. It does not obey the HeaderStyle Width property or the Height property.

<telerik:GridBoundColumn DataField="interesting"

FilterControlAltText="Filter interesting column" HeaderText="interesting"

SortExpression="interesting" UniqueName="interesting" Visible="True">

<HeaderStyle Width="100px" />

</telerik:GridBoundColumn>

I tried changing the column to an HTMLEditor column, even though this grid is READ ONLY. Didn't change anything.

<telerik:GridHTMLEditorColumn DataField="interesting"

FilterControlAltText="Filter interesting column" HeaderText="interesting"

SortExpression="interesting" UniqueName="interesting" Visible="True">

<HeaderStyle Width="100px" />

</telerik:GridHTMLEditorColumn>

I tried using a separate column editor and it also didn't change anything.

<telerik:GridHTMLEditorColumnEditor ID="GridHTMLEditor" runat="server">

<Editor runat="server" Height="50px" Width="100px"><Content>

</Content>

</Editor>

</telerik:GridHTMLEditorColumnEditor>

Even worse, when this column is in the grid, it causes other regular text columns to NOT obey their width settings. i.e. If I have the code below, then the second column is NOT rendered at 300px. This is really messed up and I don't know what else to do.

<telerik:GridHTMLEditorColumn DataField="interesting"

FilterControlAltText="Filter interesting column" HeaderText="interesting"

SortExpression="interesting" UniqueName="interesting" Visible="True">

<HeaderStyle Width="100px" />

</telerik:GridHTMLEditorColumn>

<telerik:GridBoundColumn DataField="comname"

FilterControlAltText="Filter comname column" HeaderText="Common Name"

SortExpression="comname" UniqueName="comname">

<HeaderStyle Width="300px" />

</telerik:GridBoundColumn>

Grid

answered on 19 Dec 2011

3 answers

195 views

Format Code Block dialog

HI there,

I am using the RadEditor to allow my users to edit the content that they would like to post to their website. I just saw the new Format Code Block dialog and was hoping that I could use that to allow them to enter specific CSS styles or javascript that they wanted to use on a particular page. However, the code block just displays on their content page along with all the other rendered html.

Am I missing something or is this dialog only intended to be used for things like this forum where people can submit code snippets? The examples that I can find only show how to use the dialog within the editor, not how those code blocks can actually be used to render the html differently (i.e. assigning styles).

I hope that I am explaining myself clearly. Thanks in advance for your help.
Dan

Editor

answered on 19 Dec 2011

2 answers

176 views

GridTemplateColumn

How to write the telerik:GridTemplateColumn for edit button in code behind for a RadGrid ?

and

my code in design is below

<telerik:GridTemplateColumn>
                            <EditItemTemplate>
                                <asp:LinkButton ID="lnkUpdate" runat="server" CssClass="checkIcon" CommandName="Update" style="position:relative;float:left;"></asp:LinkButton>
                                <asp:LinkButton ID="lnkCancel" runat="server" CssClass="buttonClose1" CommandName="Cancel" style="position:relative;float:left;padding-left:5px;"></asp:LinkButton>
                            </EditItemTemplate>
                            <ItemTemplate>
                                <asp:LinkButton ID="lnkEdit" runat="server" CssClass="buttonEdit1" CommandName="Edit"></asp:LinkButton>
                            </ItemTemplate>
                        </telerik:GridTemplateColumn>

Now i want the above thing to be written in code behind?

Grid

answered on 19 Dec 2011

3 answers

463 views

Changing the Skin Codebehind

If I set ShowChooser="True", my selected skin is persisted.

Rather than having just the name of the skin, I wanted a sample image as well, so I pulled the skin images from
http://demos.telerik.com/aspnet-ajax/scheduler/examples/customization/defaultvb.aspx and put in a combo, but when I change the skin it's selected value isn't persisted.

I have two formdecorators, one for my page work area, and one for the area outside the working area of the page where I change the background.

When I change the skin, the standard controls aren't updated either.

Me.RadSkinManager1.Skin = Skin

'Attempt to update all controls on the page, which doesn't seem to do anything.

Me.RadSkinManager1.ApplyStyleSheetSkin(Me.Page)

Me.RadSkinManager1.ApplySkin(Me.Page.Form, Skin)

Me.RadFormDecorator1.Skin = Skin

Me.RadFormDecorator2.Skin = Skin

<telerik:RadSkinManager ID="RadSkinManager1" Enabled="True" PersistenceKey="TelerikSkin"

PersistenceMode="Cookie" ShowChooser="false" runat="server"

/>

SkinManager

answered on 19 Dec 2011

3 answers

93 views

RadEditors in Tabstrip Multipage bug

Already a long time we have the following setup

RadTabstrip with multipage and RadEditors in several tabs.

With this function we set the class of contentArea for each editor

function OnClientLoad(editor, args)

{

editor.get_contentArea().className = "Inhoud";

}

This class was always persisted when switching back and forth over the tabstrip.

Now in Q3-2011 the class on the contentArea is lost when I navigate back to a tab which was already opened before.

Please assist.

Marc

Editor

answered on 19 Dec 2011

1 answer

130 views

Set datapager index equal to dropdown index

I have a dropdown list in a pager template. I am attempting to set the page index of a listview using the dropdownlist in the datapager to allow the customer to jump to a record using more meaningful text than a page number. The page size will always be 1.

MARKUP

<telerik:RadListView ID="RadListView1" runat="server" AllowPaging="True" DataSourceID="sqlActPlus" ItemPlaceholderID="ActionContainer" PageSize="1">

<LayoutTemplate>

<asp:PlaceHolder ID="ActionContainer" runat="server" />

<telerik:RadDataPager ID="RadDataPager1" runat="server" PagedControlID="RadListView1" PageSize="1">

<Fields>

<telerik:RadDataPagerButtonField FieldType="FirstPrev" />

<telerik:RadDataPagerButtonField FieldType="Numeric" />

<telerik:RadDataPagerButtonField FieldType="NextLast" />

<telerik:RadDataPagerTemplatePageField>

<PagerTemplate>

<asp:DropDownList ID="drpActionList" DataSourceID="sqlActPlus" DataTextField="Action" DataValueField="Action" runat="server" AutoPostBack="true" OnSelectedIndexChanged="drpActionList_SelectedIndexChanged">

</asp:DropDownList>

</PagerTemplate>

</telerik:RadDataPagerTemplatePageField>

<telerik:RadDataPagerTemplatePageField>

<PagerTemplate>

<div style="float: right">

<b>Action

<asp:Label runat="server" ID="CurrentPageLabel" Text="<%# Container.Owner.StartRowIndex+1%>" />

to

<asp:Label runat="server" ID="TotalPagesLabel"

Text="<%# IIF(Container.Owner.TotalRowCount > (Container.Owner.StartRowIndex+Container.Owner.PageSize), Container.Owner.StartRowIndex+Container.Owner.PageSize, Container.Owner.TotalRowCount) %>" />

of

<asp:Label runat="server" ID="TotalItemsLabel" Text="<%# Container.Owner.TotalRowCount%>" />

<br />

</b>

</div>

</PagerTemplate>

</telerik:RadDataPagerTemplatePageField>

</Fields>

</telerik:RadDataPager>

</LayoutTemplate>

<ItemTemplate>

<fieldset>

<legend>Action</legend>

<table class="FullWidthTable">

<tbody>

<tr>

<th>

Action Number

</th>

<th>

Target Date

</th>

<th>

Type

</th>

</tr>

<tr>

<td class="ReadOnlyValue">

<%# Eval("ActionNo")%>

</td>

<td class="ReadOnlyValue">

<%# Eval("TargetMast", "{0:d}")%>

</td>

<td class="ReadOnlyValue">

<%# Eval("Type")%>

</td>

</tr>

</tbody>

</table>

</fieldset>

</ItemTemplate>

</telerik:RadListView>

VB

Protected Sub drpActionList_SelectedIndexChanged(ByVal sender As DropDownList, ByVal e As System.EventArgs)

Dim dataPager As Telerik.Web.UI.RadDataPager = DirectCast(RadListView1.FindControl("RadDataPager1"), Telerik.Web.UI.RadDataPager)

If dataPager IsNot Nothing Then

dataPager.PageIndex = sender.SelectedIndex ' I realize this line doesn't work

End If

End Sub

The text value of the dropdown list is similar to "XXB123" and "IMO45687" and isn't always sequential. That is why I want to use the selected index.

DataPager

answered on 19 Dec 2011

1 answer

87 views

Add images to rotator programatically

I'm trying to follow your example but I don't know what I'm messing up. Essentially, I just want to be able to add images to a rotator so it displays something like a powerpoint. Here's my aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<%@ Register Assembly="Telerik.Web.UI" 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">

<div>

<telerik:RadScriptManager ID="ScriptManager1" runat="server">

</telerik:RadScriptManager>

<telerik:RadRotator ID="RadRotator1" runat="server"

RotatorType="SlideShowButtons" SlideShowAnimation-Type="Fade"

Width="400" ItemWidth="400" Height="200" ItemHeight="200" CssClass="rotator"

ScrollDirection="Left,Right">

<ControlButtons LeftButtonID="prevButton" RightButtonID="nextButton" />

</telerik:RadRotator>

</div>

</form>

</body>

</html>

And here's my c#

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using Microsoft.Office.Core;

using Microsoft.Office.Interop.PowerPoint;

using Telerik.Web.UI;

using System.Data;

using System.Collections;

public partial class _Default : System.Web.UI.Page

{

MyFunctions obj = new MyFunctions();

String webPath = System.Configuration.ConfigurationManager.AppSettings["websitePath"];

protected void Page_Load(object sender, EventArgs e)

{

if (obj.convertPpt("myfile.pptx") == "true")

{

RadRotator rr = RadRotator1;

rr.DataSource = CreateRotatorData();

rr.DataBind();

this.Controls.Add(rr);

}//if obj.convertPpt

else

{

Response.Write("We couldn't convert the power point");

}//else

}//page_load

private ArrayList CreateRotatorData()

{

ArrayList al = new ArrayList();

al.Add(ResolveUrl(webPath + "powerPointImages\\Slide1.jpg" ));

al.Add(ResolveUrl(webPath + "powerPointImages\\Slide2.jpg" ));

return al;

}//CreateRotatorData

}// _Defautl

Rotator

answered on 19 Dec 2011