Questions on UI for ASP.NET AJAX Forum

2 answers

162 views

Ajaxified multicolumn Combobox with checkbox fires a full refresh on checkbox click

Hi,

I am currently using the Q3 2010 NET40 version of the ajax controls, and I am trying ot have a multi column combobox with checkboxes fire off an ajax request to refresh a grid on the same page. But no matter what I do, when I click on the checkbox, a full page refresh is fired, making it impossible for the user to click on multiple checkboxes. I already did everything that was recommended by the below support link - although am not sure if its still applicable to this version.

http://www.telerik.com/help/aspnet-ajax/troubleshooting-ajaxified-control-item-template-full-postback.html

I built a separate page with almost no code behind just to simulate the issue, with a datasource that brings data from my database. The code is as below

I am currently developing for one of your clients, and I can get the support details if need be. Please advise how I can ajaxify the checkbox, multi column combobox. Your early response would be highly appreciated.

Thank you.

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ManageData.aspx.cs" Inherits="MasterDataManagementSystem.ManageData" %>

<!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>

<style type="text/css">

.rcbHeader ul,

.rcbFooter ul,

.rcbItem ul, .rcbHovered ul, .rcbDisabled ul

{

width: 100%;

display: inline-block;

margin: 1;

padding: 0;

list-style-type: none;

font-family : Verdana;

font-size:8pt;

}

.rcbColumn

{

font-family:Verdana;

font-size:8pt;

float: left;

margin: 1;

line-height: 14px;

padding: 2px 5px 2px 0;

}

.rcbColumn li

{

vertical-align:middle;

}

</style>

</head>

<body>

<telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">

<script type="text/javascript">

<!--

function stopPropogation(e) {

e.cancelBubble = true;

if (e.stopPropagation) {

e.stopPropagation();

}

function callAttachDropDown() {

var combo = $find("<%= rcbSourceElement.ClientID %>");

combo.attachDropDown();

}

-->

</script>

</telerik:RadScriptBlock>

<form id="form1" runat="server">

<div>

<asp:ScriptManager ID="ScriptManager1" runat="server">

</asp:ScriptManager>

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="RadComboBox1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="RadGrid1" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" Runat="server"

Skin="Default">

</telerik:RadAjaxLoadingPanel>

<telerik:RadComboBox ID="rcbSourceElement" runat="server"

HighlightTemplatedItems="True" DataTextField="PrimaryFieldValue" AutoPostBack="true"

Width="400px" Height="200px" DataValueField="ELEMENT_VALUE_KEY" DataSourceID="odsSourceElement"

AllowCustomText="True" EmptyMessage="Choose an option here...">

<ItemTemplate>

<div onclick="stopPropagation(event)">

<asp:CheckBox ID="chkSourceElementValue" runat="server" AutoPostBack="true" onclick="callAttachDropDown()" Text='<%# Eval("PrimaryFieldValue") %>'

oncheckedchanged="chkSourceElementValue_CheckedChanged"/>

</div>

</ItemTemplate>

</telerik:RadComboBox>

<asp:ObjectDataSource ID="odsSourceElement" runat="server"

SelectMethod="GetSourceElementValuesForDisplayInSubjectTab"

TypeName="MasterDataMgmt.BL.Helper">

<SelectParameters>

<asp:Parameter Name="TargetSubjectKey" DefaultValue="1" Type="Int32" />

</SelectParameters>

</asp:ObjectDataSource>

<telerik:RadGrid ID="RadGrid1" runat="server">

</telerik:RadGrid>

</div>

</form>

</body>

</html>

Thank you.

ComboBox

answered on 16 Mar 2011

2 answers

103 views

Getting JS error while selecting number fields for displaying in Rad Grid with Filter option to true.

Hi @

I am using Rad Grid with Auto Generate Columns to true.

I am getting the following error when I select a Numeric field to be displayed. I have set the Allow Filter option to true.

Since I am getting this JS error my UI disrupts completely.

Microsoft JScript runtime error: Sys.ArgumentException: Value must not be null for Controls and Behaviors.

If I set this Allow Filter option to false then I don't get this error.

Please let me know how to get rid of this error.

Grid

answered on 16 Mar 2011

1 answer

223 views

Expand/collapse server side

I have the following RadPanelBar in my page with individual the items bound programatically server-side to their respective datasources.

<telerik:RadPanelBar ID="rpbHomePanel" runat="server" ExpandMode="MultipleExpandedItems"

Height="100%" PersistStateInCookie="true">

<items>

<telerik:RadPanelItem runat="server" Text="My People" Expanded="true" ChildGroupHeight="250px" Value="MyPeople"

PostBack="true">

<ContentTemplate>

<asp:UpdatePanel ID="updMyPeople" UpdateMode="Conditional" runat="server">

<ContentTemplate>

<uc1:ucMyPeople ID="ucMyPeople" runat="server" />

</ContentTemplate>

</asp:UpdatePanel>

</ContentTemplate>

</telerik:RadPanelItem>

<telerik:RadPanelItem runat="server" Text="My Dealers" ChildGroupHeight="250px" Value="MyDealers">

<ContentTemplate>

<asp:UpdatePanel ID="updMyDealers" UpdateMode="Conditional" runat="server">

<ContentTemplate>

<uc2:ucMyDealers ID="ucMyDealers" runat="server" />

</ContentTemplate>

</asp:UpdatePanel>

</ContentTemplate>

</telerik:RadPanelItem>

<telerik:RadPanelItem runat="server" Text="My Alerts" ChildGroupHeight="250px" Value="MyAlerts">

<ContentTemplate>

<asp:UpdatePanel ID="UpdatePanel2" UpdateMode="Conditional" runat="server">

<ContentTemplate>

<uc1:ucMyAlerts ID="ucMyAlerts" runat="server" />

</ContentTemplate>

</asp:UpdatePanel>

</ContentTemplate>

</telerik:RadPanelItem>

</items>

</telerik:RadPanelBar>

I also have the following code in an event handler to iterate through the items to expand/collapse the items based on certain conditions

protected void ucMyPeople_OnDataChanged(String name)

{

foreach (RadPanelItem rpi in rpbHomePanel.Items)

{

if (name == "D")

{

if (rpi.Value == "MyPeople")

{

rpi.Expanded = false;

}

if (rpi.Value == "MyDealers")

{

rpi.Expanded = true;

}

if (rpi.Value == "MyAlerts")

{

rpi.Expanded = false;

}

if (name == "P")

{

if (rpi.Value == "MyPeople")

{

rpi.Expanded = true;

}

if (rpi.Value == "MyDealers")

{

rpi.Expanded = false;

}

if (rpi.Value == "MyAlerts")

{

rpi.Expanded = false;

}

if (name == "A")

{

if (rpi.Value == "MyPeople")

{

rpi.Expanded = false;

}

if (rpi.Value == "MyDealers")

{

rpi.Expanded = false;

}

if (rpi.Value == "MyAlerts")

{

rpi.Expanded = true;

}

None of this is working. Only the top item is ever expanded – the others remain collapsed no matter whether I set expand to true or not. I have even tried setting the second item up with Expanded=”true” in the page declaration. Still no joy.

Can you suggest what I might be dong wrong please?

PanelBar

answered on 16 Mar 2011

0 answers

64 views

Want to edit series of appointment on drag dropp

I want to edit the series of appointment on drag drop....

I want if i want to drag the one appoint then automatically edit the series of whole that appointment ( automatically update the recurrence rule)

AppointmentsBL objAppointmentNew = new AppointmentsBL();
                            objAppointmentNew.ClinicId = -1;
                            objAppointmentNew.InstructorId = intInstructorId;
                            objAppointmentNew.Start = e.ModifiedAppointment.Start;
                            objAppointmentNew.End = e.ModifiedAppointment.End;
                            objAppointmentNew.RecurrenceParentID = Convert.ToInt32(e.Appointment.RecurrenceParentID);
                            objAppointmentNew.RecurrenceRule = e.ModifiedAppointment.RecurrenceRule;

                            objAppointmentNew.Annotations = string.Empty;
                            objAppointmentNew.Reminder = string.Empty;
                            objAppointmentNew.Subject = e.ModifiedAppointment.Subject;
                            objAppointmentNew.Description = e.ModifiedAppointment.Description;
                            objAppointmentNew.UserId = intInstructorId;
                            objAppointmentNew.Save();

the above code is used. It's updated start date and end date proper but not update recurrence rule.. ?

how to do this. Please help it's urgent. Please reply me within 24 hour

thanks

Scheduler

asked on 16 Mar 2011

5 answers

222 views

Opacity issue with ie (background is white)

So I followed the instructions from this forum to remove the borders from the window.
.rwCorner,
.rwTopResize,
.rwFooterCenter,
.rwTitebar
{
display: none !important;
}
.rwTitlebar
{
background-attachment:fixed;
background-position: 0 -6px !important;
}

In the I set the opacity property for the window to 90
<telerik:RadWindow ID="xxx" runat="server" NavigateUrl="xxx" Opacity="90" Behaviors="Close" Modal="true" Height="200px" Width="245px" OnClientClose="pBakc"/>

Everything works fine in firefox and Chrome. The window displays with no borders and it's background is see-through. In ie, the borders are gone, but the background is white.

What am I doing wrong? Why is the background white for ie?

Help please.

Window

answered on 16 Mar 2011

3 answers

145 views

Show/Hide Tool Tip

I have a tool tip that I want to show after a form submit to say record inserted. I created the tool tip and then tried to show it in the server code but it's not working what am I missing. Here is the tool tip code

   <telerik:RadToolTip runat="server" ID="success" Height="60px" Width="250px"
   Position="Center" RelativeTo="BrowserWindow" AutoCloseDelay="5000">
   </telerik:RadToolTip>

Here is what i tried in my vb code behind
   success.Text = "The customer was added"
   success.Visible = True

ToolTip

answered on 16 Mar 2011

4 answers

122 views

[Solved] Unexplained variation in client side row selection behaviour between mouse click and cursor keys

I am working on a project whereby we need keyboard command accessibility with the RadGrid for a rapid data review process. Unfortunately I appear to be running into an unexplained variation between row selection behaviours on the client side. I have currently extended the default behaviour of the RadGrid using external classes and supporting javascript to perform the following features (all using AJAX where necessary):

To ensure the RadGrid retains the keyboard focus after a postback that performs an insert/update, so that the user may continue to navigate along the rows using the cursor keys
To ensure that the last edited row index is added to the server side grid instance's SelectedIndexes property before prerender, so that the user can continue to navigate along the rows using the cursor keys from the last row that they edited
To ensure the first editor control contained within a cell of an edited row acquires the keyboard focus on an initinsert / edit, initiated by pressing the enter key
To ensure that the editor control within a cell captures the keyboard focus when that cell is double clicked on by the user

Implementing all of this has been thus far pretty painless. I would first of all like to express that I couldn't be happier with the server-side documentation and examples for the control, however the the client side API documentation is severely lacking and I see that in some circumstances other users are left with little choice other than to come to the forums for help (although I can sympathise with the documentation challenges that Javascript development represents). Hence why I am here. Sad face.

I would like to draw your attention to your following RadGrid keyboard support example, where the problem I am about to describe manifests itself: http://demos.telerik.com/aspnet-ajax/grid/examples/client/keyboardnavigation/defaultcs.aspx

I would recommend switching to the Office2007 skin which makes the unexplained variation in selection behaviour more apparent.

The problem is thus:

Select a row using the mouse. The selected row turns orange.
Select another row using the mouse. The previous row is deselected, the newly selected row now turns orange. Lets call this behaviour "A".
Using the up or down cursor arrow on the keyboard, the selection behaviour changes. The appearance of the selected row is now light blue.
Navigate across as many rows as you like with the cursor keys, the selected row remains light blue. Lets call this behaviour "B".
Now using the mouse, repeat steps 1 and 2. The selection behaviour has transitioned permanently from behaviour "A" to behaviour "B".

On the pre-render behaviour described for 2nd implemented feature, I perform the following:

    
            _grid.SelectedIndexes.Add(_editedItem.ItemIndex)

When the grid appears in the browser, the row is selected with the appearance of selection behaviour "A". When the grid is in this mode, the Enter key does not initiate editing as I would expect. However, transitioning to behaviour "B" as described above, and Enter will initiate editing.

What is the difference between behaviours "A" and "B"? Why is the selection behaviour transition permanent? How would I initialise the grid after an AJAX response into behaviour "B" by default?

Many thanks

TLK

Grid

answered on 16 Mar 2011

1 answer

88 views

Sorting of Derived column

I am currently displaying a derived column to show true/false if one date field in my data source is greater than the other using rad grid control. Is it possible to sort that field? If yes, what should be given in the sort expression?

Thanks in advance,
Karthi.

Grid

answered on 16 Mar 2011

3 answers

66 views

Scheduler Demo visual glitch

Hello there,
i was viewing the demos for the Scheduler control. There is a visual glitch when it is in Monthly mode, double click on an empty cell and the popup is cut by the column border. Have a look at the attachment for a screen shot.

Scheduler

answered on 16 Mar 2011

2 answers

145 views

[Solved] The TabTemplate property of the RadTab doesn't work

Hello!
I'm trying to customize RadTabStrip tab's appearance using the TabTemplate property. But it looks like this property doesn't work at all. I implemented a class to be used as a template:

public class TestTabTpl : ITemplate

{

public void InstantiateIn(Control container)

{

// TODO: Implement this method

Label lblCtrl = new Label();

lblCtrl.Text = "Text message";

container.Controls.Add(lblCtrl);

}

Then when I'm trying to use it as a TabTemplate

protected void Page_Load(object sender, EventArgs e)

{