Questions on UI for ASP.NET AJAX Forum

1 answer

105 views

Multi-Column RadComboBox Not Populating Correctly in RadWindow

Using the RadComboBox for the first time, I first implemented it on a test page to ensure I figured out how to implement it properly. After a little trial & error, I got it working, displaying 2 columns of a DataTable as is shown in the first attachment.

Now I'm trying to implement it for real, which happens to be in a RadWindow dialog box. Yet, as the 2nd attachment shows, it's not populating in the same way. Not only does it only have just one column, but even the basic appearance of the collapsed RadComboBox is different:

In the test case it appeared grey in colour
In the RadWindow it appears white in colour, indistinguishable from the standard DropDown ListBox

What do I need to do with the RadWindow implementation to get it to populate correctly?

Robert

ComboBox

answered on 15 Dec 2012

2 answers

190 views

[Solved] Erroneous Value Property Upon SelectedIndexChanged

To test out the RadComboBox I constructed a simple web page that has just this one control on it. A small datatable (see attachment) is used to populate the control with this code:

radList.DataSource = CurrentPasses;

radList.DataTextField = "Description";

radList.DataValueField = "Master_Idx";

radList.DataBind();

My initial testing has revealed something strange: When I click on any item, the SelectedIndexChanged event is fired.

protected void radList_SelectedIndexChanged(object sender, RadComboBoxSelectedIndexChangedEventArgs e)

When I check "e.Text" the correct string is shown. But when I check "e.Value" it always displays -1. Why isn't it showing the correct "Master_Idx" value for that row?

Am I missing something or is this a known bug in the RadComboBox?

Robert

ComboBox

answered on 14 Dec 2012

6 answers

138 views

No client validation on Enter Key

HI,

I have keybordnavigation enabled on a RadGrid with a FormTemplate for edition and inserting. I have several radtextbox with requiredfieldvalidators like :

<telerik:RadTextBox ID="edDescription" runat="server" Text='<%# Bind("PPSO_DESCRIPTION") %>'

DataType="System.String" Width="277" MaxLength="50"     SelectionOnFocus="SelectAll">                           </

telerik:RadTextBox>

<asp:RequiredFieldValidator ID="RequiredFieldValidator1" ControlToValidate="edDescription"

ErrorMessage='<%# GetMessageEx(1744).Texte%>' runat="server" Display="Dynamic" ValidationGroup="freqValid" />

If I click my save button inside the template, the update command is not fired if edDescription is emptym but if I press ENTER key, the server event is fired. My save button looks like :

<asp:Button ID="btnUpdate"

Text='<%# IIf((TypeOf(Container) is GridEditFormInsertItem), "Add", "Save") %>'     CausesValidation="true" ="server"

CommandName='<%# IIf((TypeOf(Container) is GridEditFormInsertItem), "PerformInsert", "Update") %>' ValidationGroup="freqValid">

Is there something to perform validation on Enter key press?

Tom

Update : ok I achived make the validators to work by putting KeyboardNavigationSettings.ValidationGroup = "freqValid", but this only work in update mode, not in insert mode !?!?!

Grid

answered on 14 Dec 2012

2 answers

200 views

Setting initial value to multicolumn combobox with webservice load-on-demand

I have been searching for the solution to the above scenario but couldn't find one. The details of what I need to do is as below:-

I have a RadComboBox which loads items on demand. The items are supplied by a webservice. The dropdownlist items are displayed in 2-column: the ID and Name, using ClientItemTemplate:

<telerik:RadComboBox ID="cboVendor" runat="server" EnableLoadOnDemand="true" ShowMoreResultsBox="true"

EnableVirtualScrolling="true" Width="474px" HighlightTemplatedItems="True" EnableItemCaching="true">

<WebServiceSettings Method="GetVendors" Path="~/services/Vendors.asmx" />

<HeaderTemplate>

<ul class="vendorlist">

<li>Vendor Code</li>

<li>Vendor Name</li>

</ul>

</HeaderTemplate>

<ClientItemTemplate>

<ul class="vendorlist">

<li>#= Value #</li>

<li>#= Text #</li>

</ul>

</ClientItemTemplate>

</telerik:RadComboBox>

While this works pretty flawless when the page is opened for inserting records (where the combobox is blank initially), I found that it is a hassle when in editing mode, where I need to set it's value initially along with all other fields on the page.

However, I have got it to work after hours of pulling hair. Not pretty but works. This is what I did :-

Set ViewState values of the item's value and text in code behind:

ViewState("VendorName") = dt.Rows(0)!vendor_name.ToString()

ViewState("VendorCode") = dt.Rows(0)!vendor.ToString()

Javascript to add the item to the ComboBox:

var vendorSet;

function pageLoad() {

if (!vendorSet) {

var text = '<%=ViewState("VendorName")%>';

var value = '<%=ViewState("VendorCode")%>';

if (value != '') addItem(text, value);

vendorSet = true;

}

function addItem(itemText, itemValue) {

var item = new Telerik.Web.UI.RadComboBoxItem();

item.set_text(itemText);

item.set_value(itemValue);

var combo = $find('<%=cboVendor.ClientID%>');

var items = combo.get_items();

items.add(item);

item.select();

item.bindTemplate();

}

The reason I need the vendorSet flag is because the addItem needs to be called from pageLoad() event, and I found out that the pageLoad() event is triggered everytime during AJAX called anywhere on the page!

The reason I call the addItem() func from pageLoad() event is because there is the only point where $find('<%=cboVendor.ClientID%>') will work.

So my question is, Is there prettier and simpler ways of doing this?

I hope I have explained the situation clear enough for you guys to reproduce and test and hopefully come up with better way of doing this. Thanks a bunch in advance!

ComboBox

answered on 14 Dec 2012

1 answer

40 views

Newbie In Need of Help

Hi folks,

Brand new to the Chart control and way out of my depth. I'm not even sure that the chart can do what I want but here goes. I've attached an image showing the ideal chart. (Okay, the shadow's a frill. <grin>)

I need a chart with two series that displays the XValue (an OADate) as a formatted string and the YValues as a line. The two series will have similar Y data but dissimilar dates. Only the dates that are given should appear - not ranges.

I've pasted in some sample markup to show what the data looks like. Nothing is working so far so any tips, code, warning or solutions are most welcome.

Ken

<telerik:RadChart runat="server" ID="RadChart2" Skin="LightBrown">

<Series>

<telerik:ChartSeries Name="Vendor One" Type="Line">

<Items>

<telerik:ChartSeriesItem YValue="6000" XValue="41245.211">

</telerik:ChartSeriesItem>

<telerik:ChartSeriesItem YValue="8000" XValue="41251.44">

</telerik:ChartSeriesItem>

</Items>

</telerik:ChartSeries>

<telerik:ChartSeries Name="Vendor Two" Type="Line">

<Items>

<telerik:ChartSeriesItem YValue="5000" XValue="41253.345">

</telerik:ChartSeriesItem>

<telerik:ChartSeriesItem YValue="9000" XValue="41254.72315">

</telerik:ChartSeriesItem>

</Items>

</telerik:ChartSeries>

</Series>

<PlotArea>

<XAxis >

<Appearance>

<LabelAppearance RotationAngle="70"></LabelAppearance>

</Appearance>

</XAxis>

<YAxis AxisMode="Extended">

</YAxis>

</PlotArea>

<ChartTitle>

<TextBlock Text="Chart Problem">

</TextBlock>

</ChartTitle>

</telerik:RadChart>

Chart (Obsolete)

answered on 14 Dec 2012

2 answers

139 views

Rad Async Upload Problem

Uploading ".doc" files seems to cause an issue. They get stuck on yellow
for the upload process even though it shows 100%. If you try to continue-
click save... It does not save the file.

AsyncUpload

answered on 14 Dec 2012

2 answers

84 views

Problem with TargetFolder

Hello,
use the object radupload to send images to a remote server ... I have a problem with the TargetFolder. If I set the object properties of the folder, the transfer on the server is ok, but if you pass the path to the folder using vb net, transferring the image is not there. Why? Here is the code I use.

Upload (Obsolete)

answered on 14 Dec 2012

7 answers

340 views

How to create a new dock dynamically without Postback

Hello,

Here is my situation. I am developing a portal page using Raddocks. On top of the page I will have a rad grid which will have a linkbutton with an onclick event on server side. When the user clicks on a linkbutton of a specific row of a radgrid, a new widget/dock should be created and added to the Layout.

Every dock has a usercontrol in it which is loaded via a webservice. I am saving the state in the database from client side. My issue here is that whenever I am creating a new dock, all the existing docks are getting recreated and all the usercontrols are getting loaded again. I just want the user selected dock to be loaded.

I know that I can use AsyncPostBackTrigger, but I am getting an error that it is not able to find the control that I am clicking(btnAddWidget) which is inside a RadGrid. I was wondering if there is any other way to handle this without having to re-create all the docks again. I have the flexibility to replace the RadGrid with any other control like a listview or something.

The following is my code:

Default.aspx:

   function OnClientDockPositionChanged(dock, args) {
   SaveState();
   }
   function OnClientResizeEnd(dock, args) {
   SaveState();
   }
       function OnClientCommand(dock, args) {
   SaveState();
   }
   function SaveState() {
   var i;
   var state = "";
   var zone1 = $find("RadDockZone1");
   var zone2 = $find("RadDockZone2");
   var array1Docks = zone1.get_docks();
   var array2Docks = zone2.get_docks();
   for (i = 0; i < array1Docks.length; i++) {
   var dock = array1Docks[i];
   var dockID = dock.get_id();
   var tag = $get(dockID).attributes["tag"].value;
   state = state + tag + "#" + array1Docks[i].saveClientState() + "|";
      }
   for (i = 0; i < array2Docks.length; i++) {
   var dock = array2Docks[i];
   var dockID = dock.get_id();
   var tag = $get(dockID).attributes["tag"].value;
   state = state + tag + "#" + array2Docks[i].saveClientState() + "|";
   }
   SOLEWebService.VerifyUserSessionAndUpdateUserSettings(state, success, onFail);
      }
   function success(result) {
   alert("success");
      }
   function onFail(result) {
   alert(result.d);
   }
   function OnClientInitialize(dock, args) {
       var dockID = dock.get_id();
   var tag = $get(dockID).attributes["tag"].value;
   var UserControl = $get(dockID).attributes["UserControl"].value;
       if ($get(dockID).attributes["NewDock"] != null && $get(dockID).attributes["NewDock"].value != null) {
   var newDock = $get(dockID).attributes["NewDock"].value;
   var state = "";
   state = tag + "#" + dock.saveClientState() + "|";
   SOLEWebService.VerifyUserSessionAndSaveUserSettings(state, success, onFail);
   }
       UserControlService.GetUserWidgetData(UserControl, tag, function (result) {
   $get(dockID + "_C").innerHTML = result;
   });
   }
    <script src="/Scripts/JQuery/Scripts/JQuery-1.4.1-vsdoc.js" type="text/javascript"></script>
   </head>
<body>
   <form id="form1" runat="server">
   <telerik:RadScriptManager runat="server" ID="RadScriptManager1" EnablePageMethods = "true" EnableScriptCombine="true">
   <Services>
   <asp:ServiceReference Path = "~/UserControlService.asmx" />
   <asp:ServiceReference Path = "~/SOLEWebService.asmx" />
   </Services>
   </telerik:RadScriptManager>
  <telerik:RadStyleSheetManager ID="RadStyleSheetManager1" runat="server" EnableStyleSheetCombine="true">
   </telerik:RadStyleSheetManager>
   <telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" ClientEvents-OnResponseEnd = "RecallJquery">
        <asp:UpdatePanel runat="server" ID="UpdatePanel1">
   <ContentTemplate>
   <table>
   <tr>
   <td>
   <div id = "gridViewPanel" class = "ContainerPanel">
   <div id="gridViewHeader" class="collapsePanelHeader">
   <div id="Div2" class="HeaderContent">Add Stuff</div>
   <div id="Div3" class="ArrowClose"></div>
   </div>
   <div id = "gridContent" class = "Content" style="display:none">
   <telerik:RadGrid runat="server" ID="grdWidgets" OnNeedDataSource="grdWidgets_NeedDataSource"
   AllowPaging="True" Width="400px" >
   <MasterTableView DataKeyNames="Widgets" Width="100%" TableLayout="Fixed">
   <Columns>
   <telerik:GridTemplateColumn UniqueName="TemplateColumn" HeaderText="" ItemStyle-Width = "50px">
   <ItemTemplate>
   <asp:Panel ID="Panel1" runat="server">
   <asp:LinkButton ID="btnAddWidget" runat="server" Text = "Add" OnClick = "btnAddWidget_Click" />
   </asp:Panel>
   </ItemTemplate>
   </telerik:GridTemplateColumn>
   </Columns>
   </MasterTableView>
   <ClientSettings AllowRowsDragDrop="True">
   <Selecting AllowRowSelect="True" EnableDragToSelectRows="false" />
   <Scrolling AllowScroll="true" UseStaticHeaders="true" ScrollHeight="320px" />
   </ClientSettings>
   <PagerStyle Mode="NumericPages" PageButtonCount="4" />
   </telerik:RadGrid>
   </div>
   </div>
   </td>
   </tr>
   </table>
   <telerik:RadDockLayout runat="server" ID="RadDockLayout1" OnLoadDockLayout="RadDockLayout1_LoadDockLayout">
   <table>
   <tr>
   <td style="vertical-align: top">
   <telerik:RadDockZone ID="RadDockZone1" runat="server" Orientation="Vertical" Width="250px"
   MinHeight="400px">
   </telerik:RadDockZone>
   </td>
   <td style="vertical-align: top">
   <telerik:RadDockZone ID="RadDockZone2" runat="server" Orientation="Vertical" Width="560px"
   MinHeight="400px">
   </telerik:RadDockZone>
   </td>
   </tr>
   </table>
   </telerik:RadDockLayout>
   </ContentTemplate>
   <%-- <Triggers>
   <asp:AsyncPostBackTrigger ControlID="btnAddWidget" EventName="Click" />
   </Triggers>--%>
   </asp:UpdatePanel>
        </telerik:RadAjaxPanel>

Code-Behind:
Protected Sub grdWidgets_NeedDataSource(ByVal source As Object, ByVal e As GridNeedDataSourceEventArgs)
   grdWidgets.DataSource = PortalDataManager.GetDefaultWidgets()
   End Sub

   Private ReadOnly Property CurrentDockStates() As List(Of DockState)
   Get
   'Get saved state string from the database - set it to dockState variable for example
   Dim dockStatesFromDB As String = String.Empty
   dockStatesFromDB = PortalDataManager.GetUserWidgetSettings(33357)
     Dim _currentDockStates As New List(Of DockState)()
   If dockStatesFromDB Is Nothing Then
   Return _currentDockStates
   End If
   If dockStatesFromDB Is String.Empty Then
   Return _currentDockStates
   End If
       Dim stringStates As String() = dockStatesFromDB.Split("|"c)
   For i As Integer = 0 To stringStates.Length - 2
   Dim currentState As String() = stringStates(i).Split("#"c)
   Dim uniqueName As String = currentState(0)
   Dim state As String = currentState(1)
   If state.Trim() <> String.Empty Then
   Dim ds As DockState = DockState.Deserialize(state)
   ds.Tag = uniqueName
   ds.UniqueName = uniqueName
   _currentDockStates.Add(ds)
   End If
   Next
   Return _currentDockStates
   End Get
   End Property

Protected Sub RadDockLayout1_LoadDockLayout(ByVal sender As Object, ByVal e As DockLayoutEventArgs)
   Dim states As List(Of DockState) = CurrentDockStates
   For Each state As DockState In states
   e.Positions(state.UniqueName) = state.DockZoneID
   e.Indices(state.UniqueName) = state.Index
   Next
   End Sub

   Private Function CreateRadDockFromState(ByVal state As DockState) As RadDock
   Dim dock As New RadDock()
   dock.DockMode = DockMode.Docked
   dock.ID = String.Format("RadDock{0}", state.UniqueName)
   dock.ApplyState(state)
   SetDockProperties(dock)
   AddClientEventsToDock(dock)
   Return dock
   End Function

   Private Sub SetDockProperties(ByRef dock As RadDock)
   dock.AutoPostBack = False
   dock.CommandsAutoPostBack = False
   dock.Commands.Add(New DockCloseCommand())
   dock.Commands.Add(New DockExpandCollapseCommand())
   dock.EnableEmbeddedScripts = True
   dock.EnableRoundedCorners = True
   dock.EnableAnimation = True
   End Sub

   Private Sub AddClientEventsToDock(ByRef dock As RadDock)
   dock.OnClientInitialize = "OnClientInitialize"
   dock.OnClientResizeEnd = "OnClientResizeEnd"
   dock.OnClientDragEnd = "OnClientDragEnd"
   dock.OnClientDockPositionChanged = "OnClientDockPositionChanged"
   dock.OnClientCommand = "OnClientCommand"
   End Sub

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
   If (Not Page.IsPostBack) Then
   Dim dockCount As Integer = CurrentDockStates.Count
   For i As Integer = 0 To dockCount - 1
   If CurrentDockStates(i).Closed = False Then
   Dim dock As RadDock = CreateRadDockFromState(CurrentDockStates(i))
   RadDockLayout1.Controls.Add(dock)
   LoadUserControl(dock)
   End If
   Next
   End If
   End Sub

   Protected Sub btnAddWidget_Click(ByVal sender As Object, ByVal e As System.EventArgs)
   Dim btnAdd As LinkButton = CType(sender, LinkButton)
   Dim myPanel As Panel = CType(btnAdd.Parent, Panel)
   Dim dataItem As GridDataItem = CType(myPanel.NamingContainer, GridDataItem)
   Dim widgetType As String = dataItem("Widgets").Text
   Dim widgetTag As String = dataItem("WidgetTag").Text
   Dim userControl As String = dataItem("WidgetUserControl").Text
   Dim dock As RadDock = CreateRadDock(widgetTag)
   dock.Attributes("NewDock") = "True"
   dock.Attributes("UserControl") = userControl
   dock.Attributes("tag") = dock.Tag
   RadDockZone1.Controls.Add(dock)
   btnAdd.Text = "Added"
   btnAdd.Enabled = False
   End Sub

Private Function CreateRadDock(ByVal tag As String) As RadDock
   Dim dock As New RadDock()
   dock.DockMode = DockMode.Docked
   dock.UniqueName = tag
   dock.Tag = tag
   dock.ID = String.Format("RadDock{0}", dock.UniqueName)
   dock.Title = "New Dock"
   SetDockProperties(dock)
   AddClientEventsToDock(dock)
   Dim img As New Image()
   img.ImageUrl = "Reload.gif"
   dock.ContentContainer.Controls.Add(img)
   Return dock
   End Function

   Protected Sub grdWidgets_ItemCreated(ByVal sender As Object, ByVal e As Telerik.Web.UI.GridItemEventArgs) Handles grdWidgets.ItemCreated
   If TypeOf e.Item Is GridDataItem Then
   Dim dataItem As GridDataItem = CType(e.Item, GridDataItem)
   dataItem.ToolTip = dataItem("Widgets").Text
   End If
   End Sub

    Public Sub LoadUserControl(ByRef dock As RadDock)
   If dock.Tag Is Nothing Then
   Return
   End If
   Dim img As New Image()
   img.ImageUrl = "Reload.gif"
   dock.ContentContainer.Controls.Add(img)
   dock.Attributes("UserID") = 33357
   dock.Attributes("UserControl") = PortalDataManager.GetUserControlForWidget(dock.Tag)
   dock.Attributes("tag") = dock.Tag
   End Sub

Thanks so much for your time on this,

Uday.

Dock

answered on 14 Dec 2012

1 answer

76 views

RadDateTimePicker & RadDatePicker Not Responding in SP2010 Web Parts

Hello Team!

We are developing a web part which make use of RadDateTimePicker & RadDatePicker. It works perfectly in our development environment. However, the controls are not responding when we deployed the solutions to UAT environment. The calendar icon is still showing but there is no response when we clicked on the icon. The JavaScript error below was thrown. Can anyone please advise what are the things that we should check when deploying the solution in a web part in SP2010?

Message: Object expected
Line: 5
Char: 32749
Code: 0
URI: http://test.mycompany.com/ScriptResource.axd?d=-MjrHJBff7jU9KF-pPP1Rni4KJhM1xhvUGHZPgnsV_4PX0zXBVRzYnzACX1YwxtYxGGb8ewfPZLoI5-lRHFijYA4VpfrgsAp0h09g8-1EZ7SrcwnEK2U-HIy4nTK5wOuuZPkDQ_UBlj4HM9U87AAQWVujuc1&t=ffffffffb868b5f4

Thanks in advance!

Calendar

answered on 14 Dec 2012

4 answers

114 views

AutoCompleteBox nested in MultiPage

When I nest an AutoCompleteBox on a page other than the first page in a MultiPage the 

text entered in the AutoCompletBox is hidden to the left of the cursor. Please see code 

and screen shots.



<

div>

<telerik:RadTabStrip ID="RadTabStrip1" runat="server" MultiPageID="RadMultiPage1">

<Tabs>

<telerik:RadTab Text="TAB 1" PageViewID="RadPageView1" />

<telerik:RadTab Text="TAB 2" PageViewID="RadPageView2" />

</Tabs>

</telerik:RadTabStrip>

<telerik:RadMultiPage ID="RadMultiPage1" runat="server" SelectedIndex="0">

<telerik:RadPageView ID="RadPageView1" runat="server">

<telerik:RadAutoCompleteBox ID="RadAutoCompleteBox1" runat="server" DataSourceID="ds" DataTextField="Name" DataValueField="Id" />

</telerik:RadPageView>

<telerik:RadPageView ID="RadPageView2" runat="server">

ABC

</telerik:RadPageView>

</telerik:RadMultiPage>

</div>

<div>

<telerik:RadTabStrip ID="RadTabStrip2" runat="server" MultiPageID="RadMultiPage2">

<Tabs>

<telerik:RadTab Text="TAB 3" PageViewID="RadPageView3" />

<telerik:RadTab Text="TAB 4" PageViewID="RadPageView4" />

</Tabs>

</telerik:RadTabStrip>

<telerik:RadMultiPage ID="RadMultiPage2" runat="server" SelectedIndex="0">

<telerik:RadPageView ID="RadPageView3" runat="server">

ABC

</telerik:RadPageView>

<telerik:RadPageView ID="RadPageView4" runat="server">

<telerik:RadAutoCompleteBox ID="RadAutoCompleteBox2" runat="server" DataSourceID="ds" DataTextField="Name" DataValueField="Id" />

</telerik:RadPageView>

</telerik:RadMultiPage>

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

ConnectionString="<%$ ConnectionStrings:ConnectionStringDB %>" DataSourceMode="DataSet" SelectCommand="SELECT Id, Name FROM Table;" />

</div>

AutoCompleteBox

answered on 14 Dec 2012