This is a migrated thread and some comments may be shown as answers.

Adding Items to Telerik RadContextMenu showing transparent background

9 Answers 154 Views
Menu
This is a migrated thread and some comments may be shown as answers.
Tuhin Ghosh
Top achievements
Rank 1
Tuhin Ghosh asked on 20 Dec 2011, 09:54 AM

Following is the javascript code where I am adding few items in existing rad context menu i.e. RadMenu1. There are few items already in it and I am adding few more items dynamically in javascript

function ContextMenuOpen(sender, args) 
{
   
var menu = $find("m_c_RadMenu1");
   
if (IsMobileBrowser() == false)
   
{
       
var evt = args.get_domEvent();
   
}
    menu
.trackChanges();
   
var items = menu._getAllItems()
    menu
.get_items().clear();

   
//menu.commitChanges();
   
AddItem("Visit & View Details", "a");

   
if (selectedRow.findElement("lblTask") != null) {
       
var tasklist = selectedRow.findElement("lblTask").defaultValue;
       
var taskArray = tasklist.split(',');

       
for (i = 0; i < taskArray.length; i++) {
           
if (typeof (taskArray[i].split('~')[1]) == 'undefined') break;
           
AddItem("Perform " + taskArray[i].split('~')[1], taskArray[i].split('~')[0]);
       
}
       
//rb.AddItem(selectedRow.findElement("lblTask").innerText,4)
   
}
   
AddItem("Log an Incident", "b");
   
if (rb.isLocationSelected == false) {

   
AddItem("Log a Discrepancy", "c");
}


function AddItem(text, value) {
   
var menu = rb.GetMenu();
   
var item = rb.GetContextMenuItem(text);
   
if (item != null) return false;
   
var menuItem = new Telerik.Web.UI.RadMenuItem();
    menuItem
.set_text(text);
    menuItem
.set_value(value)
    menu
.trackChanges();
    menu
.get_items().add(menuItem);
    menu
.commitChanges();
   
return true;
}

Everything goes well , but the newly added context menu shows transparent background on rightside , I found it is filling the background only at the area where text is present , on empty area at rightside it is transparent (see attached image )

see the transparent background, right side of the items

do anybody know how to remove this transparent background?

9 Answers, 1 is accepted

Sort by
0
Kate
Telerik team
answered on 20 Dec 2011, 11:26 AM
Hi Tuhin Ghosh,

Can you please provide more details on your scenario - for example what is the version of the controls that you are using and the browser under which you are experiencing this appearance? Unfortunately the code that you provided is not sufficient to replicate the issue locally therefore we would appreciate very much if you could send us a simplified runnable page the we could test and come back to you with a suitable solution.

Greetings,
Kate
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
0
Anjani
Top achievements
Rank 1
answered on 21 Mar 2012, 05:43 AM
Hi Kate,

Im working with RadContextMenu, version 2011.1.502.1040 in my application. My scenario is such that I fill the collection of menu items at runtime with property binding :

<telerik:RadContextMenu.ContextMenu>
    <telerik:RadContextMenu x:Name="ButtonContextMenu" ItemTemplate="{StaticResource MenuItemTemplate}" ItemsSource="{Binding ContextMenuSource}" Placement="Bottom" PlacementRectangle="10,30,0,0">
       <i:Interaction.Triggers>
          <i:EventTrigger EventName="ItemClick">
                <TriggerActions:MapDoubleClickEventToCommand Command="{Binding Path=ItemClickCommand}"/>
          </i:EventTrigger>
       </i:Interaction.Triggers>
    /telerik:RadContextMenu>
</telerik:RadContextMenu.ContextMenu>

the template used is :

 <telerik:HierarchicalDataTemplate x:Key="MenuItemTemplate" ItemsSource="{Binding ContextMenuSource}"> 
     <telerik:ContainerBinding.ContainerBindings>
        <telerik:ContainerBindingCollection>
            <telerik:ContainerBinding PropertyName="Icon" Binding="{Binding Icon}" />
        </telerik:ContainerBindingCollection>
     </telerik:ContainerBinding.ContainerBindings>
          <TextBlock Text="{Binding Text}" >
		 <ToolTipService.ToolTip>
			<ToolTip>
  			    <TextBlock  Text="{Binding Text}" />
			</ToolTip>
		 </ToolTipService.ToolTip>
	 </TextBlock>
     </telerik:HierarchicalDataTemplate>


NOTE : This context menu is linked to a button and when the button is clicked, radcontextmenu is seen opened with its menu items

My requirement is that I want to highlight the 1st item of menu items, the moment the button is clicked and radcontextmenu is shown.

I have searched the net enough to find out if there is a way out.. Unfortunately, I couldn't find anything that served my requirement.

Could you suggest something to me in this regard ? Please find the image of my UI attached with this query. 'Expected behaviour image' is what im expecting

~ Anjani
0
Tuhin Ghosh
Top achievements
Rank 1
answered on 22 Mar 2012, 10:23 AM
Hi Kate, 

Following are details

Version : Telerik.Web.UI 2011.1.519.35
Browser: All Browsers

Thanks.
0
Kate
Telerik team
answered on 26 Mar 2012, 08:57 AM
Hi Tuhin,

Thank you for clarifying. Indeed we are aware of such bug of the menu that occurs in IE Quirks mode only. It is already logged in our internal system so that our developer can fix it. However, using the code that you provided I was not able to replicate the same issue. Can you test your scenario with the latest version of our controls and check if you still encounter the same appearance?

All the best,
Kate
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Anjani
Top achievements
Rank 1
answered on 26 Mar 2012, 09:30 AM
Hi Kate,

Could also please provide a solution to my problem that I have mentioned below incase you missed seeing my post..

Thanks
Anjani
0
Kate
Telerik team
answered on 26 Mar 2012, 09:58 AM
Hello Anjani,

To highlight the first item of the context menu you can use the OnClientShowing event, find the first item and then set set_focused() or set_selected() to it. Give it a try and let me know how it goes.

Regards,
Kate
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Anjani
Top achievements
Rank 1
answered on 26 Mar 2012, 10:43 AM
Hi Kate,
Thanks for your response but here is some clarification.. Im using silverlight 4, RadContextMenu, version 2011.1.502.1040 in my application.. Where the only relevant event is 'Opened' .. But how do you set 1st item as selected ?

0
Kate
Telerik team
answered on 29 Mar 2012, 11:30 AM
Hi Anjani,

Thanks for clarifying that but in order to get complete advantage of the RadContextMenu/RadMenu control I would suggest that you upgrade to the latest version of our controls. Thus, can use all of the client-side events and methods that are currently available.

All the best,
Kate
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Anjani
Top achievements
Rank 1
answered on 29 Mar 2012, 11:44 AM
Hi Kate,

Thanks a lot for your response.. Probably we will need to upgrade to the latest telerik version for this problem

~ Anjani
Tags
Menu
Asked by
Tuhin Ghosh
Top achievements
Rank 1
Answers by
Kate
Telerik team
Anjani
Top achievements
Rank 1
Tuhin Ghosh
Top achievements
Rank 1
Share this question
or