Questions on UI for ASP.NET AJAX Forum

12 answers

141 views

Hi,

I am using tabstrip as a wizard.

I have previous and next buttons on my page and I load a user control in the multipage for each tabstrip.
When I navigate with the previous button. I have some binding controls on my pages which get bound when i pass the data for that particular tab.
WHen I am using the previous button it is trying to render all the tabs. SInce I don't pass data for all the tabs my code is not able to bind some controls.
Below is my code and html.

Let me know what am I doing wrong. I suspect I am not using the LoadStep() function call at the right place but I am not able to figure out the right event.

<table cellpadding="0" cellspacing="0" width="100%">

<tr>

<td>

<telerik:RadTabStrip ID="rtsEnrollment" runat="server" MultiPageID="rmpEnrollment"

OnTabClick="rtsEnrollment_TabClick" SelectedIndex="0" CausesValidation="true"

Align="Justify" AutoPostBack="true">

</telerik:RadTabStrip>

<telerik:RadMultiPage ID="rmpEnrollment" runat="server" SelectedIndex="0" OnPageViewCreated="rmpEnrollment_PageViewCreated"

CssClass="multiPage">

</telerik:RadMultiPage>

</td>

</tr>

<tr>

<td class="enrollmentButton">

<telerik:RadButton runat="server" ID="PreviousButton" Text="<< Previous" OnClick="PreviousButton_Click"

AutoPostBack="true" CausesValidation="false">

</telerik:RadButton>

<telerik:RadButton runat="server" ID="ContinueButton" Text="Next >>" CausesValidation="true"

AutoPostBack="true" OnClick="ContinueButton_Click">

</telerik:RadButton>

</td>

</tr>

</table>

public partial class enrollment_theCompany_EDCP : EnrollmentBasePage

{

protected void LoadStep()

{

string tabName = rtsEnrollment.SelectedTab.Text;

RadTab tab = rtsEnrollment.FindTabByText(tabName);

switch (rtsEnrollment.SelectedTab.Text)

{

case "Deferral Elections":

LoadSalaryElections(tab);

break;

case "Distribution Elections":

LoadDistributionElections(tab);

break;

case "Fund Allocations":

RadPageView pvFundAllocations = (RadPageView)tab.PageView.FindControl("fundAllocations");

ucFundBucket ucFundAllocations = (ucFundBucket)pvFundAllocations.FindControl("ucFundAllocations");

ucFundAllocations.LoadPlan();

break;

case "Enrollment Summary":

// commit data

RadPageView pvEnrollmentSummary = (RadPageView)tab.PageView.FindControl("enrollmentSummary");

enrollment_ucEnrollmentSummary ucEnrollmentSummary = (enrollment_ucEnrollmentSummary)pvEnrollmentSummary.FindControl("ucEnrollmentSummary");

_enrollment.CommitEnrollmentData(DeferralSources());

break;

}

protected override void UpdateStep(int nextStepIndex)

{

string tabName = rtsEnrollment.SelectedTab.Text;

RadTab tab = rtsEnrollment.FindTabByText(tabName);

switch (tabName)

{

case "Deferral Elections":

RadPageView pvDeferralElections = (RadPageView)tab.PageView.FindControl("deferralElections");

enrollment_theCompany_deferralElections ucDeferralElections = (enrollment_theCompany_deferralElections)pvDeferralElections.FindControl("ucDeferralElections");

ucDeferralElections.SaveForEnrollment(_enrollment);

break;

case "Distribution Elections":

RadPageView pvPaymentOptions = (RadPageView)tab.PageView.FindControl("paymentOptions");

enrollment_theCompany_paymentOptions ucPaymentOptions = (enrollment_theCompany_paymentOptions)pvPaymentOptions.FindControl("ucPaymentOptions");

ucPaymentOptions.PlanPeriodName = _enrollment.PlanPeriodName;

ucPaymentOptions.SaveForEnrollment(_enrollment);

break;

case "Fund Allocations":

RadPageView pvFundAllocations = (RadPageView)tab.PageView.FindControl("fundAllocations");

ucFundBucket ucFundAllocations = (ucFundBucket)pvFundAllocations.FindControl("ucFundAllocations");

ucFundAllocations.SaveAllocationForEnrollment(_enrollment);

break;

case "Enrollment Summary":

break;

}

protected void Page_Load(object sender, EventArgs e)

{

if (!Page.IsPostBack)

{

AddTab("Deferral Elections", true);

RadPageView pageView = new RadPageView();

pageView.ID = "DeferralElections";

rmpEnrollment.PageViews.Add(pageView);

AddTab("Distribution Elections", false);

AddTab("Fund Allocations", false);

AddTab("Enrollment Summary", false);

LoadStep();

}

#region UI Events

protected void rmpEnrollment_PageViewCreated(object sender, RadMultiPageEventArgs e)

{

Control pageViewContents = new Control();

switch (e.PageView.ID)

{

case "DeferralElections":

pageViewContents = LoadControl("~/enrollment/thecompany/deferralElections.ascx");

pageViewContents.ID = "uc" + e.PageView.ID ;

break;

case "PaymentOptions":

pageViewContents = LoadControl("~/enrollment/thecompany/paymentOptions.ascx");

pageViewContents.ID = "uc" + e.PageView.ID;

break;

case "FundAllocations":

pageViewContents = LoadControl("~/fund/ucFundbucket.ascx");

pageViewContents.ID = "uc" + e.PageView.ID;

break;

case "EnrollmentSummary":

pageViewContents = LoadControl("~/enrollment/ucEnrollmentSummary.ascx");

pageViewContents.ID = "uc" + e.PageView.ID;

break;

}

e.PageView.Controls.Add(pageViewContents);

}

protected void PreviousButton_Click(object sender, EventArgs e)

{

GoToPreviousTab();

GoToPreviousPageView();

LoadStep();

}

protected void ContinueButton_Click(object sender, EventArgs e)

{

UpdateStep();

GoToNextTab();

GoToNextPageView();

LoadStep();

}

#endregion

#region Private Events

private void GoToNextTab()

{

string tabName = rtsEnrollment.SelectedTab.Text;

switch (tabName)

{

case "Deferral Elections":

RadTab paymentOptionsTab = rtsEnrollment.FindTabByText("Distribution Elections");

rtsEnrollment.ValidationGroup = "PaymentOptionsTabValidationGroup";

paymentOptionsTab.Enabled = true;

paymentOptionsTab.Selected = true;

break;

case "Distribution Elections":

RadTab fundAllocationsTab = rtsEnrollment.FindTabByText("Fund Allocations");

fundAllocationsTab.Enabled = true;

fundAllocationsTab.Selected = true;

break;

case "Fund Allocations":

RadTab enrollmentSummaryTab = rtsEnrollment.FindTabByText("Enrollment Summary");

enrollmentSummaryTab.Enabled = true;

enrollmentSummaryTab.Selected = true;

break;

case "Enrollment Summary":

break;

}

private void GoToNextPageView()

{

string tabName = rtsEnrollment.SelectedTab.Text;

switch (tabName)

{

case "Deferral Elections":

break;

case "Distribution Elections":

RadPageView paymentOptionsTabPageView = rmpEnrollment.FindPageViewByID("PaymentOptions");

if (paymentOptionsTabPageView == null)

{

paymentOptionsTabPageView = new RadPageView();

paymentOptionsTabPageView.ID = "PaymentOptions";

rmpEnrollment.PageViews.Add(paymentOptionsTabPageView);

}

paymentOptionsTabPageView.Selected = true;

break;

case "Fund Allocations":

RadPageView fundAllocationsTabPageView = rmpEnrollment.FindPageViewByID("FundAllocations");

if (fundAllocationsTabPageView == null)

{

fundAllocationsTabPageView = new RadPageView();

fundAllocationsTabPageView.ID = "FundAllocations";

rmpEnrollment.PageViews.Add(fundAllocationsTabPageView);

}

fundAllocationsTabPageView.Selected = true;

break;

case "Enrollment Summary":

RadPageView enrollmentSummaryTabPageView = rmpEnrollment.FindPageViewByID("EnrollmentSummary");

if (enrollmentSummaryTabPageView == null)

{

enrollmentSummaryTabPageView = new RadPageView();

enrollmentSummaryTabPageView.ID = "EnrollmentSummary";

rmpEnrollment.PageViews.Add(enrollmentSummaryTabPageView);

}

enrollmentSummaryTabPageView.Selected = true;

break;

}

private void GoToPreviousTab()

{

string tabName = rtsEnrollment.SelectedTab.Text;

switch (tabName)

{

case "Deferral Elections":

break;

case "Distribution Elections":

RadTab deferralElectionsTab = rtsEnrollment.FindTabByText("Deferral Elections");

rtsEnrollment.ValidationGroup = "DeferralElectionsTabValidationGroup";

deferralElectionsTab.Enabled = true;

deferralElectionsTab.Selected = true;

break;

case "Fund Allocations":

RadTab paymentOptionsTab = rtsEnrollment.FindTabByText("Distribution Elections");

rtsEnrollment.ValidationGroup = "PaymentOptionsTabValidationGroup";

paymentOptionsTab.Enabled = true;

paymentOptionsTab.Selected = true;

break;

case "Enrollment Summary":

RadTab FundAllocationsTab = rtsEnrollment.FindTabByText("Fund Allocations");

FundAllocationsTab.Enabled = true;

FundAllocationsTab.Selected = true;

break;

}

private void GoToPreviousPageView()

{

string tabName = rtsEnrollment.SelectedTab.Text;

switch (tabName)

{

case "Deferral Elections":

RadPageView deferralElectionsTabPageView = rmpEnrollment.FindPageViewByID("DeferralElections");

if (deferralElectionsTabPageView == null)

{

deferralElectionsTabPageView = new RadPageView();

deferralElectionsTabPageView.ID = "DeferralElections";

rmpEnrollment.PageViews.Add(deferralElectionsTabPageView);

}

deferralElectionsTabPageView.Selected = true;

break;

case "Distribution Elections":

RadPageView paymentOptionsTabPageView = rmpEnrollment.FindPageViewByID("PaymentOptions");

if (paymentOptionsTabPageView == null)

{

paymentOptionsTabPageView = new RadPageView();

paymentOptionsTabPageView.ID = "PaymentOptions";

rmpEnrollment.PageViews.Add(paymentOptionsTabPageView);

}

paymentOptionsTabPageView.Selected = true;

break;

case "Fund Allocations":

RadPageView fundAllocationsTabPageView = rmpEnrollment.FindPageViewByID("FundAllocations");

if (fundAllocationsTabPageView == null)

{

fundAllocationsTabPageView = new RadPageView();

fundAllocationsTabPageView.ID = "FundAllocations";

rmpEnrollment.PageViews.Add(fundAllocationsTabPageView);

}

fundAllocationsTabPageView.Selected = true;

break;

case "Enrollment Summary":

break;

}

private void AddTab(string tabName, bool enabled)

{

RadTab tab = new RadTab(tabName);

tab.Enabled = enabled;

switch (tab.Text)

{

case "Deferral Elections":

break;

case "Distribution Elections":

break;

case "Fund Allocations":

break;

case "Enrollment Summary":

//tab.ImageUrl = "Images/4_normal.png";

//tab.SelectedImageUrl = "Images/4_active.png";

//tab.DisabledImageUrl = "Images/4_disable.png";

break;

default:

break;

}

rtsEnrollment.Tabs.Add(tab);

}

private void LoadSalaryElections(RadTab tab)

{

RadPageView pvDeferralElections = (RadPageView)tab.PageView.FindControl("deferralElections");

enrollment_theCompany_deferralElections ucDeferralElections = (enrollment_theCompany_deferralElections)pvDeferralElections.FindControl("ucDeferralElections");

ucDeferralElections.PlanPeriodName = _enrollment.PlanPeriodName;

ucDeferralElections.NextPlanPeriodName = _enrollment.NextPlanPeriodName;

ucDeferralElections.LoadDeferralElections(_enrollment);

}

private void LoadDistributionElections(RadTab tab)

{

RadPageView pvPaymentOptions = (RadPageView)tab.PageView.FindControl("paymentOptions");

enrollment_theCompany_paymentOptions ucPaymentOptions = (enrollment_theCompany_paymentOptions)pvPaymentOptions.FindControl("ucPaymentOptions");

ucPaymentOptions.LoadPaymentOptions(_enrollment);

}

#endregion

}

TabStrip

answered on 10 Jul 2014

2 answers

337 views

Mutually Exclusive Checkbox

Does anyone know if there is a way to get a Mutually Exclusive Checkbox with this listbox control. Like the one available thru the Ajax Toolkit?

ListBox

answered on 10 Jul 2014

1 answer

123 views

RadSplitter scrollbar issue

Hi,
I was using Telerik RadSplitter and in one of the pane I have both horizontal and scrollbars set to visible always. The scrollbars are appearing in Chrome without any issues. But in IE I can see vertical one but not the horizontal one. It doesn't seem like compatibility related issue as I can view the scroll bar either in zoom plus mode. But I can't ask the website viewers to do the same whenever they visit this web page.

Below is my aspx code:

<telerik:RadSplitter ID="RadSplitter" runat="server" Height="100%"
        Orientation="Vertical" VisibleDuringInit="false" BorderWidth="0px">
        <telerik:RadPane ID="RadPane" runat="server" BorderWidth="0px" Scrolling="Both"
            Width="100%" Orientation="HorizontalTop">

Can anyone help me to resolve this issue?

Thank you.

General Discussions

answered on 10 Jul 2014

1 answer

111 views

Changing Column Headertext during Export

Hi all, literally as the title says, I need to change column header(s) during the grid export without changing it on the UI...

I've tried loads of stuff I've found by searching both here and google...

I would have thought something like this would work : -

        Private Sub FrameworkGrid_ItemCommand(sender As Object, e As GridCommandEventArgs) Handles Me.ItemCommand

            If e.CommandName.StartsWith("Export") Then

                For Each item In Me.Items

                    If TypeOf item Is GridHeaderItem Then

                        For Each cell As TableCell In CType(item, GridHeaderItem).Cells
                            StripTags(cell.Text)
                        Next

                    End If

                Next

            End If

        End Sub

But there never is a GridHeaderItem when doing that... It's just all the normal DataGridItems in the grid instead...

Basically, we've appended a load of css styling into some of the column headers and obviously when exporting we want to remove that and put it back to just plain text... I've got a function to strip the HTML using RegEx no problem ('StripTags') but I can't even get it that far...

Any suggestions?

Grid

answered on 10 Jul 2014

1 answer

159 views

RadComobox is not 508 compliant

Hi,

I tested it in IE browser using Web Accessibility toolbar from paciello group. I did set radcombox ID to AssociatedControlID of the ASP.NET label control. They resulted there are two labels that are not associated to the radcomobox controls. These radcomobox controls just added input to the ID. Therefore they were not associated to the label controls

<div class="col-md-6 form_row">

<div>

<asp:Label ID="lblRequestTypeSelect" runat="server" Text="Request Type" AssociatedControlID="rcRequestType" CssClass="control-label col-md-3">Request Type<span class="required">*</span></asp:Label>

<div class="col-md-9">

<telerik:RadComboBox ID="rcRequestType" runat="server" AutoPostBack="true" ToolTip="Request Type *" EnableAriaSupport="true" Skin="Simple" OnSelectedIndexChanged="rcRequestType_SelectedIndexChanged" TabIndex="0">

<Items>

<telerik:RadComboBoxItem Text="Select" Value="Select" Selected="true" />

<telerik:RadComboBoxItem Text="Congressional" Value="Congressional" />

<telerik:RadComboBoxItem Text="Federal Requester" Value="Federal Requester" />

<telerik:RadComboBoxItem Text="Local Government" Value="Local Government" />

<telerik:RadComboBoxItem Text="Other Organization" Value="Other Organization" />

<telerik:RadComboBoxItem Text="Private Citizen" Value="Private Citizen" />

<telerik:RadComboBoxItem Text="State Requester" Value="State Requester" />

<telerik:RadComboBoxItem Text="Universities / Schools" Value="Universities / Schools" />

<telerik:RadComboBoxItem Text="Veterans Organization" Value="Veterans Organization" />

<telerik:RadComboBoxItem Text="Vocational" Value="Vocational" />

</Items>

</telerik:RadComboBox>

<asp:RequiredFieldValidator ID="RequiredFieldValidator1" ControlToValidate="rcRequestType" runat="server" InitialValue="Select" ForeColor="Red" ErrorMessage="Request Type is Required" ValidationGroup="cs1"></asp:RequiredFieldValidator>

</div>

<div class="col-md-6 form_row">

<div>

<asp:Label ID="lblradSelectOrg" runat="server" Text="Organization" AssociatedControlID="rcOrg" CssClass="control-label col-md-3">Organization<span class="required">*</span></asp:Label>

<div class="col-md-9">

<telerik:RadComboBox ID="rcOrg" runat="server" AutoPostBack="true" EnableAriaSupport="true" OnSelectedIndexChanged="rcOrg_SelectedIndexChanged" Enabled="false" ToolTip="Organization *" DropDownAutoWidth="Enabled" Skin="Simple"></telerik:RadComboBox>

<asp:RequiredFieldValidator ID="RequiredFieldValidator2" ControlToValidate="rcOrg" runat="server" InitialValue="Select" ForeColor="Red" ErrorMessage="Organization is Required" ValidationGroup="cs1"></asp:RequiredFieldValidator>

</div>

ComboBox

answered on 10 Jul 2014

2 answers

195 views

Equivalent of DBNULL when using RadGrid

I have worked with GridView earlier and wanted to know what is the equivalent of DBNull.Value when using Radgrid.
For instance, with gridview I could do the following check:

System.Data.DataRowView View = (System.Data.DataRowView)e.Row.DataItem;
var isSuppProduct = (DBNull.Value != View[this._ProdTable.ItemIdColumn.ColumnName]);

But how to do this comparision with Radgrid?

protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e)
{
if (e.Item is GridDataItem)
{
GridDataItem dataItem = (GridDataItem)e.Item;
var isSuppProduct = (DBNull.Value != dataItem["SupplementalOriginalPriceDealEntityProductItemId"]);//which is not correct
}
}

Grid

answered on 10 Jul 2014

2 answers

97 views

Pass filePath to radgrid modal edit template

Hello,

I have a radGrid which includes an "Add New" form. This form is set as a modal popup form and includes a file selector set up exact like this demo:

http://demos.telerik.com/aspnet-ajax/fileexplorer/examples/client-sideapi/fileselectordialog/defaultcs.aspx

My problem comes with trying to get the filePath back to the textbox in the radgrid form template. Currently when I double click a file nothing happens. The file explorer does not close and I do not get the file path populating my textbox. All of my code is identical to the above demo except for the fact that the file explorer dialog and filepath textbox reside within a radgrid editform template.

Any advice/insight is greatly appreciated!

Thanks,
Ric

FileExplorer

answered on 10 Jul 2014

1 answer

113 views

Persist row selection on postback

Hi,

I have a parent and child grid that are both using Ajax to when a selection is made on the parent grid to update the child grid. When I select an item on the parent grid, the CSS style for the .rgSelectedRow disappears and is the user has no way of knowing which one they selected although the child grid displays the correct data. I've narrowed it down to the RadGrid1_OnItemDataBound method where I programmatically apply CSS rules to the respective alternating items and regular items. The way I apply the CSS is as follows:

if (e.Item.ItemType == Telerik.Web.UI.GridItemType.AlternatingItem)
    {
         e.Item.CssClass = " AlternatingItemColor " + cssstyle + " rgAltRow";
     }
else
    {
         e.Item.CssClass = "rgRow " + cssstyle;
    }

Where cssstyle is the CSS rule based off attributes in the data item. When I remove this code from the method, the selected row persists through the postback, but that's where the problem lies. Any suggestions would be very helpful as to why it's being overridden.

Thanks,

Joe

Grid

answered on 10 Jul 2014

1 answer

74 views

text disappears on submit of form

implemented the telerik rad editor in production over the weekend and have two calls so far that the text is disappearing when the form is submitted. Running a asp.net 4.5 project here with ajax.

I took the one call myself. The user can't even right click in the editor this was the case in IE, chrome and firefox. CTRL + V did work when attempting to paste, but when the form was submitted the content was cleared - it was also cleared when content was directly typed it. The content does show in the box it just gets cleared when the form is submitted.

I wasn't able to duplicate this on my PC or another PC. But then we got another call with the same issue.

Has anyone come across this?

Editor

answered on 10 Jul 2014

4 answers

144 views

RadToolTip Response Error

Hi,

I am using RadToolTipManager and it appears when the user hovers the mouse on a treeview node but I am getting this error. Any Help would be greatly appreciated.

RadToolTipManager response error:
Exception=Sys.InvalidOperationException: Could not find UpdatePanel with ID 'dnn_RibbonBar.ascx_AddMod_UpdateAddModule'. If it is being updated dynamically then it must be inside another UpdatePanel.

Protected Sub RadToolTipmanager_AjaxUpdate(ByVal sender As Object, ByVal e As ToolTipUpdateEventArgs)

Dim roleName As String = e.Value

Dim listOfUsersInToolTip As New RadListBox

Dim label As New Label

listOfUsersInToolTip.Width = 150

listOfUsersInToolTip.Height = 200

If IsUserRole(e.Value) Then

Dim sql As String = "select UserId, TeamId from FF_UserTeamMapping where TeamId = (select ID from FF_Team where TeamName = '" & e.Value & "')"

Dim dt As DataTable = DNNDB.Query(sql)

'Dim usersList As ArrayList = rc.GetUserRolesByRoleName(DNN.GetPMB(Me).PortalId, roleName)

If dt IsNot Nothing And dt.Rows.Count <> 0 Then

For Each row As DataRow In dt.Rows

Dim nUserId As Integer = row("UserId")

Dim userInfo As UserInfo = DotNetNuke.Entities.Users.UserController.GetUserById(DNN.GetPMB(Me).PortalId, nUserId)

listOfUsersInToolTip.Items.Add(New RadListBoxItem(userInfo.Username, userInfo.UserID))

Next

listOfUsersInToolTip.Sort = RadListBoxSort.Ascending

listOfUsersInToolTip.SortItems()

RadToolTipManager.Width = "150"

RadToolTipManager.Height = "200"

RadToolTipManager.Position = ToolTipPosition.TopRight

listOfUsersInToolTip.BackColor = Color.DimGray

listOfUsersInToolTip.ID = Guid.NewGuid().ToString()

e.UpdatePanel.ContentTemplateContainer.Controls.Add(listOfUsersInToolTip)

End If

Else

For Each role As RadComboBoxItem In cmbRoleName.Items

Dim userInfo As UserInfo = DotNetNuke.Entities.Users.UserController.GetUserByName(DNN.GetPMB(Me).PortalId, e.Value)

Dim found = FindUserInTeam(role.Value, userInfo.UserID)

If found Then

label.Text = e.Value & " belongs to " & role.Text

RadToolTipManager.Width = "160"

RadToolTipManager.Height = "50"

RadToolTipManager.BackColor = Color.DimGray

listOfUsersInToolTip.BackColor = Color.DimGray

listOfUsersInToolTip.ID = Guid.NewGuid().ToString()

e.UpdatePanel.ContentTemplateContainer.Controls.Add(label)

Exit For

Else

label.Text = e.Value & " doesn't belong to any team"

RadToolTipManager.Width = "160"

RadToolTipManager.Height = "50"

RadToolTipManager.BackColor = Color.DimGray

listOfUsersInToolTip.BackColor = Color.DimGray

listOfUsersInToolTip.ID = Guid.NewGuid().ToString()

e.UpdatePanel.ContentTemplateContainer.Controls.Add(label)

End If

Next

End If

<%@ Control Language="VB" AutoEventWireup="false" CodeFile="PS_UserJobMapping.ascx.vb"

Inherits="PS_UserJobMapping" %>

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

<%@ Register TagPrefix="Portal" Namespace="DotNetNuke.Security.Permissions.Controls"

Assembly="DotNetNuke" %>

<link href="module.css" rel="stylesheet" type="text/css" />

<telerik:RadCodeBlock runat="server" ID="RadCodeBlock1">

<script type="text/javascript">

//indicates whether the user is currently dragging a listbox item

var listBoxDragInProgress = false;

//indicates whether the user is currently dragging a tree node

var treeViewDragInProgress = false;

//select the hovered listbox item if the user is dragging a node

function onListBoxMouseOver(sender, args) {

if (treeViewDragInProgress) {

args.get_item().select();

}

//select the hovered tree node if the user is dragging a listbox item

function onTreeViewMouseOver(sender, args) {

if (listBoxDragInProgress) {

args.get_node().select();

}

//////////////// radtooltip code for move over ///////////////

var nodeElem = args.get_node();

if (nodeElem.get_level() != 0) {

var node = nodeElem.get_textElement();

var tooltipManager = $find("<%= RadToolTipManager.ClientID%>");

//If the user hovers the image before the page has loaded, there is no manager created

if (!tooltipManager) return;

//Find the tooltip for this element if it has been created

var tooltip = tooltipManager.getToolTipByElement(node);

//Create a tooltip if no tooltip exists for such element

if (!tooltip) {

tooltip = tooltipManager.createToolTip(node);

tooltip.set_value(nodeElem.get_text());

tooltip.show();

}

//unselect the item if the user is dragging a node

function onListBoxMouseOut(sender, args) {

if (treeViewDragInProgress) {

args.get_item().unselect();

}

//unselect the node if the user is dragging a listbox item

function onTreeViewMouseOut(sender, args) {

if (listBoxDragInProgress) {

args.get_node().unselect();

}

//indicate that the user started dragging a listbox item

function onListBoxDragStart(sender, args) {

listBoxDragInProgress = true;

}

//indicate that the user started dragging a tree node

function onTreeViewDragStart(sender, args) {

treeViewDragInProgress = true;

}

//handle the drop of the listbox item

function onListBoxDropping(sender, args) {

//indicate that the user stopped dragging

listBoxDragInProgress = false;

document.body.style.cursor = "";

//restore the cursor to the default state

document.body.style.cursor = "";

//get the html element on which the item is dropped

var target = args.get_htmlElement();

//if dropped on the listbox itself return.

if (isOverElement(target, "<%= lstUsers.ClientID %>")) {

return;

}

//check if dropped on the treeview

var target = isOverElement(target, "<%= tvUsersInJobStages.ClientID %>");

//if not cancel the dropping event so it does not postback

if (!target) {

args.set_cancel(true);

return;

}

//the item was dropped on the treeview - set the htmlElement.

//it can be later accessed via the HtmlElementID property of the RadListBox

args.set_htmlElement(target);

}

//handle the drop of the tree node

function onTreeViewDropping(sender, args) {

//indicate that the user stopped dragging

treeViewDragInProgress = false;

//restore the cursor to the default state

document.body.style.cursor = "";

//get the html element on which the node is dropped

var target = args.get_htmlElement();

//if dropped on the treeview itself return.

if (isOverElement(target, "<%= tvUsersInJobStages.ClientID %>")) {

return;

}

//check if dropped on the listbox

var target = isOverElement(target, "<%= lstUsers.ClientID %>");

//if not cancel the dropping event so it does not postback

if (!target) {

args.set_cancel(true);

return;

}

//the node was dropped on the listbox - set the htmlElement.

//it can be later accessed via the HtmlElementID property of the RadTreeNodeDragDropEventArgs

args.set_htmlElement(target);

}

//chech if a given html element is a child of an element with the specified id

function isOverElement(target, id) {

while (target) {

if (target.id == id)

break;

target = target.parentNode;

}

return target;

}

function checkDropTargets(target) {

if (isOverElement(target, "<%= lstUsers.ClientID %>") || isOverElement(target, "<%= tvUsersInJobStages.ClientID %>")) {

//if the mouse is over the treeview or listbox - set the cursor to default

document.body.style.cursor = "";

} else {

//else set the cursor to "no-drop" to indicate that dropping over this html element is not supported

document.body.style.cursor = "no-drop";

}

//update the cursor if the user is dragging the item over supported drop target - listbox or treeview

function onListBoxDragging(sender, args) {

checkDropTargets(args.get_htmlElement());

}

//update the cursor if the user is dragging the node over supported drop target - listbox or treeview

function onTreeViewDragging(sender, args) {

checkDropTargets(args.get_htmlElement());

}

function CloseActiveToolTip() {

var tooltip = Telerik.Web.UI.RadToolTip.getCurrent();

if (tooltip) tooltip.hide();

}

</script>

</telerik:RadCodeBlock>

<fieldset id="fsMain" runat="server">

<legend class="fieldsetLegend" id="fslgndMain">

<asp:Label ID="lblUserJobMapping" runat="server" Text="Resource Management" />

</legend>

<telerik:RadAjaxLoadingPanel ID="alpUserJobMapping" runat="server" Height="75px"

MinDisplayTime="5" Width="75px">

<asp:Image ID="Image1" runat="server" AlternateText="Loading..." ImageUrl="~/Portals/0/Images/LoadingAjax.gif" />

</telerik:RadAjaxLoadingPanel>

<telerik:RadAjaxPanel ID="rapUserJobMapping" RequestQueueSize="5" runat="server"

Width="100%" EnableOutsideScripts="True" HorizontalAlign="NotSet" ScrollBars="None"

LoadingPanelID="alpUserJobMapping">

<table id="sub1" border="0" cellpadding="0" cellspacing="0" width="100%">

<tr valign="top">

<td>

<table border="0" cellpadding="0" cellspacing="0" width="100%">

<tr>

<td width="30%">

<telerik:RadComboBox ID="cmbRoleName" EmptyMessage="- please select team -" runat="server"

AutoCompleteSeparator="true" HighlightTemplatedItems="true" AllowCustomText="true">

<%-- <Items>

<telerik:RadComboBoxItem Value="0" Text="-- Select All Users --">

</Items>

--%>

<ItemTemplate>

<table border="0" cellpadding="0" cellspacing="0">

<tr>

<td>

<asp:CheckBox runat="server" ID="chkRole" AutoPostBack="true" Text="" OnCheckedChanged="chkRole_OnCheckedChanged" />

</td>

</tr>

</table>

</ItemTemplate>

</telerik:RadComboBox>

</td>

<td width="20%">

</td>

<td>

</td>

</tr>

<%-- <tr>

<td width="20%">

<asp:CheckBox runat="server" ID="chkAllPSUsers" Text="Select All PS Users" AutoPostBack="true"

OnCheckedChanged="chkAllPSUsers_OnCheckedChanged" />

</td>

</tr>

--%>

</table>

</td>

</tr>

<tr>

<td>

</td>

<td>

</td>

</tr>

<tr>

<td>

<table border="0" cellpadding="0" cellspacing="0" width="100%">

<tr>

<td width="30%">

<asp:Label ID="lblUser" runat="server" Text="Resources"></asp:Label>

</td>

<td width="20%">

</td>

<td>

<asp:Label ID="Label2" runat="server" Text="Stages"></asp:Label>

</td>

</tr>

</table>

</td>

</tr>

<tr>

<td>

</td>

<td>

</td>

</tr>

<tr>

<td>

<telerik:RadToolTipManager HideDelay="1" EnableViewState="false" RelativeTo="Element"

ID="RadToolTipManager" runat="server" EnableShadow="true" OffsetX="15" HideEvent="LeaveToolTip"

BackColor="#ffff66" Position="TopRight" OnAjaxUpdate="RadToolTipmanager_AjaxUpdate"

Style="font-size: 18px; text-align: center; font-family: Arial;" RenderInPageRoot="true">

</telerik:RadToolTipManager>

</td>

</tr>

<tr>

<td>

<table border="0" cellpadding="0" cellspacing="0" width="100%">

<tr>

<td width="20%">

<telerik:RadListBox runat="server" ID="lstUsers" Sort="Ascending" EnableDragAndDrop="True" skinn="Vista"

Width="160px" AllowReorder="true" Height="200px" OnClientDropping="onListBoxDropping"

OnClientDragStart="onListBoxDragStart" OnClientMouseOver="onListBoxMouseOver"

BorderColor="#ffff66" BackColor="#ffff66" OnClientMouseOut="onListBoxMouseOut"

OnClientDragging="onListBoxDragging" OnDropped="lstUsers_ItemDropped">

<ButtonSettings ShowReorder="false" />

</telerik:RadListBox>

</td>

<td width="20%">

<div style="height: 200px; overflow: auto; width: 100%;">

<telerik:RadTreeView runat="server" ID="tvUsersInJobStages" EnableDragAndDrop="True"

OnClientMouseOver="onTreeViewMouseOver" OnClientMouseOut="onTreeViewMouseOut"

OnClientNodeDragStart="onTreeViewDragStart" OnClientNodeDropping="onTreeViewDropping"

OnNodeDrop="tvUsersInJobStages_NodeDrop" OnClientNodeDragging="onTreeViewDragging"

OnContextMenuItemClick="tvUsersInJobStages_ContextMenuItemClick">

<ContextMenus>

<telerik:RadTreeViewContextMenu runat="server" ID="HelpDeskMenu" ClickToOpen="True"

Skin="Vista">

<Items>

<telerik:RadMenuItem Text="Remove From Stage" Value="Remove">

</telerik:RadMenuItem>

<telerik:RadMenuItem Text="Remove From All Stages" Value="Remove All">

</telerik:RadMenuItem>

</Items>

</telerik:RadTreeViewContextMenu>

</ContextMenus>

</telerik:RadTreeView>

</div>

</td>

</tr>

</table>

</td>

</tr>

<tr>

<td>

</td>

<td>

</td>

</tr>

<tr>

<td>

<asp:Button ID="btnSave" runat="server" Text="Save" />

<asp:Button ID="btnCancel" runat="server" Text="Cancel" />

</td>

</tr>

</table>

</telerik:RadAjaxPanel>

</fieldset

ToolTip

answered on 10 Jul 2014