Office 2007 Ribbon UI

Hello Russell,

Thank you very much for the time you dedicated to assemble this marvelous example with six of our RadControls. The contribution you made to the telerik community here is surely appraised by us and everyone else who is interested in building Office 2007 Ribbon UI for web with our ASP.NET controls. The demo site you have uploaded provides the basis for further development - no doubt it will be quite beneficial for other developers. We are also grateful for the doc file outlining the main points covered in the sample application.

30 000 telerik points goes to your account as a token of gratitude. Thank you once again for the involvement and keep posting!

Best regards,
Stephen Rahnev,
Technical Support Director, telerik

Hello guys,

Thanks to Mr. Russell Mason I am glad to bring in public an updated version of the Office 2007 Ribbon UI project attached to this code library thread.

The following is a brief description of the update:

Updated to include the following main features:

Added hover effect to Tabs
Added hover effect to RibbonGroup
Added Dialog Launcher to RibbonGroup
Added LargeSplitRibbonButton
Added SmallSplitRibbonButton
Simplified and clarified examples

You will find several screenshots below:









Best regards,
Stephen Rahnev,
Technical Support Director, Telerik

hi russell, hi stephen.

thanks for the framework. i've done something similar. but i think i will replace it by your framework!

the note in die document about "microsoft office ui licensing" made me a little nervous. i know you are not microsoft but maybe you have an answer for me before contacting ms.

first of all i like the idea that my app is confirmed with this license. but on the other hand what happens if not?

what if i ignore this license and use parts of the office ui like in rad-editor if i enable the ribbon style menue. after i read the evaluation license - it seems that this menue style doesn't match the license requirements. 

hope you can give me some more answers than i found at the msdn.

Hi Buddy

You are right to be nervous regarding the 2007 UI guidelines. The Ribbon UI I have created is NOT fully conformant with the guidelines as set out by Microsoft ... yet.

The key areas that are not conformant are:
1) The application menu (which needs 2 vertical sections)
2) The resizing of Ribbon content (groups should be collapsed/expanded as the window gets smaller/larger)
3) Keyboard Access

I am currently working towards these requirements (although none of them are simple so it will be a little while off yet).

There are other issues e.g. ensuring text in a Ribbon Group does not cause the group to be wider than the buttons within the group. However these can be avoided by taking preventative measures such as shortening the text or adding more buttons. Other rules are entirely up to the implementer to ensure they comply, e.g. ensuring that clicking a Dialog Launcher does not alter document text etc.

As to what would happen if you violated the guidelines? I have no idea. I guess because web applications are not the same as desktop applications Microsoft would allow some flexibility here. The point of the guidelines is to protect Microsoft's investment in an innovative UI. If you abuse the guidelines and start creating something that would be seen as making the UI look ridiculous I'm sure Microsoft would take action to prevent you from doing so. I think what I have done is in keeping with the spirit of the 2007 UI, but then I would say that wouldn't I.

Thanks
Russell Mason

Hello,
Thank you for this framework. I have a question about validation. On my webform that uses the framework, I have a couple of data validation groups. (with requiredfieldvalidators)
When I click something from the applicationgroup or the ribbon, the validationgroup kicks in.
Is there a solution to set enablevalidation=false on the tabstrip and menu ?

Hi

To be honest I know absolutely nothing about validators (I have always had my own methods for performing validation). I will investigate this as I think it's an important question. It may take me while but I will get back to you.

Thanks
Russell Mason

Hi

The Ribbon Button controls I have added do not cause validation. I will try and add CausesValidation and ValidationGroup properties soon as they are an obviously omission.

I've had a look into validation as it can be used currently, and I can't see any difference between the normal behaviour provided by Telerik's controls and when they are used in the Ribbon scenario. The RadTabTrip and RadMenu can both have validation disabled by setting the CausesValidation to false, or you can use a different ValidationGroup from other controls. I did have a question about the RadMenu's default behaviour and you can see Telerik's rely here: http://www.telerik.com/community/forums/thread/b311D-thdet.aspx

If this doesn't resolve your issues please send me an email (ribboncontrols@russellmason.com) with more specific details outlining exactly what is happening and how it is different from the normal Telerik behaviour.

Thanks
Russell Mason

hello,
My problem is indeed solved by setting causesvalidation=true on the tabstrip and radmenu.
I should have solved this myself, but I had some weird intellisense problems last week so the causesvalidation property didn't show on the tabstrip and menu ...

Anyway, thanks again for the ribbon. This is so great for developing intranet solutions.

This ribbonbar is AWESUM!!! well done I definetly intend to make good use of it :)

I wondered how I would go about extending it, at the moment I am converting menus from a standard menu to the ribbonbar, and all my standard menu use the NavigateUrl and Target properties, e.g.:

NavigateUrl="Dynamic.aspx?mode=ShowAnimals" Target="radContent"

I could not find these properties in the LargeRibbonButton property, and they would be very useful.
<orb:LargeRibbonButton ID="Button1" runat="server" Text="Home" EnabledImageUrl="Home.gif" ClientMemberName="_Button1" />

I suspect if I used the ajax manager I could have a server side event that loaded the output of my dynamic.aspx (that page dynamically loads user controls) into the radContent pane (a splitter bar in placement mode), thus avoiding the refresh?    I'm not positive that would work, but I suspect there is a better way anyway..

..Perhaps some javascript to load the page into my radContent pane?  would apreciate anyones ideas on the best way forward?    Ideally if I could add the properties then everyone could benefit, I imagine a lot of people use those properties in their menus, avoiding the postpage, and will want to continue with that approach with the ribbonbar.

keep up the good work!!!!

regards
ewart

Hi Ewart

Thanks for the possitive feedback.

I'm not sure what you mean by radContent, but my understanding of a RadMenu is that it uses a standard A tag. The NavigateUrl and Target properties just output the A tag's href and target.

Given that, could you not just use the client-side OnClientClick of a LargeRibbonButton (or other button) to invoke a navigation, such as...

OnClientClick="window.open('http://www.telerik.com', '_self);"
or
OnClientClick="window.open('http://www.telerik.com', 'myContent');"

Because this is being done in my spare time I have tried to get the basics in first. You are right that navigation such as this is going to be a very common requirement. I may try to add properties that simplify this in the future.

Thanks
Russell Mason

I can, and the Javascript works well thankyou.  I will do this for now, but if I have a chance after this project ends I'll look at extending the framework to output javascript for those tags.

regards
ewart

This is truly a great project - I look forward to contributing (once me current project is done.)

Have you thought about providing source images as well - making life easier for those that might want to alter the colors of the Ribbon Bar?

Hi Bill

All the images used by the Ribbon are already in the project under the 'ApplicationFramework\RussellMason.Web.Application\Web\UI\Office2007\Office2007Client\Images' folder. Note that these are copied into the example project's 'ApplicationFramework\TestClient\Office2007Client\Images' folder.

Images used in the mockup are in the  'ApplicationFramework\TestClient\Images' folder.

Other images used by Telerik's Rad controls are in their usual location.

Hope that answers the question, if not please provide additional details.

Thanks
Russell Mason

Thanks Russell - I saw the .gif images.

I was actually referring to some sort of source image(s) (like a photoshop .psd) that would make it easier to "skin" the Ribbon control.

Might be a useful addition - but given time and attention I'm sure we could properly edit the individual images.

Bill

Hi Bill

Believe it not I don't have any 'source' images. For each component I have taken a screen shot of Word and split out the elements that make up each button/control and saved those directly to gifs. I have made minor adjustments as I originally only had Telerik’s Office 2007 example and a Beta to work from. The official release had some visual changes especially the Quick Access Toolbar, so I have tried to get as close as possible but I didn’t what to have to go through every image/style, so there are some minor differences.

Sorry I can't help further.

Thanks
Russell Mason

After using your controls, if I add to my pages other rad controls I get error like this one:



Can you help me?

Thanks

Hi

Are you using Q1 2007 Telerik controls? I think this can happen if libraries/pages have been build against an old version (as is the case with this version of the Ribbon). Try deleting the bin folders under the 'RussellMason.Web.Application' project and 'TestClient' project so that Visual Studio has to rebuild using the new 1.7 version of RadAjax (make sure yopu copy the latest RadControls folder too).

Thanks
Russell Mason

Bill, to make fast work of a project rather than hunt down icons, I purchased the X-Mac package from IconShock. I'd rather spend my time coding. :D

Russell, thank you very much for an excellent framework. I'm in full swing on three projects thanks to your groundwork and telerik r.a.d.Controls. Shoulders of giants and all that jazz.

I'd like the users to know which menu item is currently selected, as a visual cue.

So, anyone know an easy way to make the only the currently selected LargeRibbonButton retain higlighted status in the menu?

I was thinking perhaps some sort of function like I've sketched out below could trigger hilighting the current item and dehilight the previous item?  I'm not a JavaScript expert however so have no idea how to make this work assuming it's even possible.




oh, and prevMenu would be declared somewhere at the top I guess.

Hi Ewart

I hope I understand correctly in that you want to implement toggle buttons. For the moment the approach you suggest would work although you would need to do this for each group as each would have a different 'previous' button. You would probably need an array based version of your function to handle this.

For those interested in the next release the main focus is on collapsing groups when the browser window changes width. However, I have also added NavigationUrl and Target (thanks for the suggestion) and CausesValidation and ValidationGroup (thanks NS). If I get time I will also try and add a ButtonGroup property to make toggle buttons simpler.

Thanks
Russell Mason

Thanks for your application frameworks! Verry good job!

I just whant to well understant the GenerateClientMember property of a ApplicationBar. If I set it to true, another instance of javascript are created. In this new instance I can use the ShareState.
My question is (i am not a javasrcipt expert) If I need to trigger a client function when the TabStrip a selected, I add a OnClientTabSelected string in the RadTabStrip that point to a JavaScript Function. If I let the GenerateClientMember to true the function are never called because I think the call are made in another JS instance? How Can I put my JS function in the correct instance? For now I put the GenerateClientMembers to false and all work good.

Thanks

Hi Pierre

This was a mistake on my part. I just assigned the events to singlecast handlers. In the next release I have changed these to be multicast so you can still associate your own handlers.

If you set GenerateClientMember to false things won't work properly, e.g. minimizing the ribbon (they may appear to work most of the time but you will get subtle errors introduced). In fact the next release requires all Ribbon controls to have this set to true and you won't be able to turn it off.
However, short term this may be suficient, and I am not far away from the next release where you can reset it to true again.

Thanks
Russell Mason

Thanks for reply. Your next release are aleready scheduled?

Can you provide more information or code example to explain how you can interact with the shared value?

Hi Pierre

Do you mean interact with Shared State generally or in the case you outlined?

If this is the case you outlined it is nothing to do with Shared State but with client side objects that represent the server-side controls and the way events are assigned to those objects. A simple example is when the ribbon is minimized, when you click a tab the ribbon pops-up but I need to know when you click away from the ribbon so I can hide it again. I do this by listening to events on the document object.

If you mean shared State generally, when you create a control (such as the ApplicationBar or RibbonButton) there is a server-side contol and a reduced fuctionality client-side version. The client-side version is written in JavaScript to allow you to do basic operations without doing a PostBack, an example may be setting minimized state of the application bar or the checked state of a button. In addition, some operation, such as the way hover effects work, can't be done simply with CSS, as there are 3 elements that need to change (left, centre, right) so the client object is a good way of allowing this to be implemented. When values change on the client and you do a PostBack the server would have no way of knowing that you made the change. SharedState is similar to ViewState except it allows you to change the values stored on the client via JavaScript. When you call setChecked() against a RibbonButton the checked state (true) is set against the Shared State. This is stored in a hidden field and when it arrives at the server the server can tell what was changed and 'synchronize' the values against the server control. Text boxes, and hidden fields (or controls derived from them) handle this sort of synchronization for you, but when you create your own controls you have to handle it yourself. If you have no client-side interaction then this too is not an issue. However, when you have controls that interact both on the client and server you need this type of mechanism. Telerik and other control providers use this type of mechanism in one way or another, I have just given it the name 'Shared State' and allow you to add it to controls if you so wish.

In the client-side JavaScript this is just held in an array and the get/set methods just access specific indexed items within the array. This makes it more intuitive and 'object' looking. What goes in SharedState is dictated by the server-side controls. You will notice that each control adds a set of items (the key can be used on the server to make it more readable) but again this is just a collection that can be easily written to a string than can be converted to the array when it gets to the client (the JavaScript eval methods does this for you). Shared State can be accessed and changed on the client but it cannot be created or added to.

The idea behind the client-side member is to automatically create an instance of the client-side object. You can use this simply in JavaScript by using the client member variable name, such as _myRibbonButton.setChecked(true); i.e. you do not have to create this yourself. This is not the 'norm', for example to use a client-side version of a Telerik RadTabStrip you would need to manually insert an bit of JavaScript such as

All I am doing is creating this for you, but more importantly it allows me to know what the client-side object will be called so that I can call methods against this object for hover effects etc.

Why do I do this differently than others? I like this idea, think it is simpler, and requires less code. More importantly they know what they are doing and I don't :-)

Hope that helps.

Thanks
Russell Mason

Hi Russell, yes you did understand correctly - I want to check the toggle button so that it is hilighted when the user clicks.  This way the user will always know what menu they are in.  The check/hilight part is easy to do in the OnClientClick menu.

Re the uncheck though - do I really need an array based function for this or anything special per group?  From OnClientClick can't I just store the name of the current item in a global variable, which I will know, then on the next OnClientClick event use that global variable to uncheck/unhilight the menu item - regardless of what group it was in? (because I won't care which group per se as long as I can uncheck)

your can see my java pseudocode attempt for this in the last post.

I may have just demonstrated just how little I know about JavaScript!  If thats the case feel free to say say "no it doesn't work like that buddy, so shutup!"

regards
ewart

Hi Ewart

The reason why I was suggesting some kind of array is if you want more than one toggle button active at a time. Examples:

Button1 - Checked
Button2 - Not Checked
Button3 - Not Checked

If you click Button2 you can use the single global value you suggested, set Checked to false against that value (Button1) and true against Button2. Button2 now becomes the globally set button. This works fine.

However, if you have more than 1 set:

Button1 - Checked
Button2 - Not Checked
Button3 - Not Checked

Button4 - Checked
Button5 - Not Checked
Button6 - Not Checked

These are 2 independent sets so you would need 2 global variables. When you click Button2 you change the first global variable to Button2, If you click Button5 you need to set the second global value to Button5 and reset Button4 not Button2. The more independant sets you have the more global values you need, thus the idea of an array.

I'm not sure if you only need 1 set or not so if you do I apologise for confusing the issue.

Thanks
Russell Mason

Yup just one menu item will be selected at once - essentially - when I click the menu item I want to hilight (check) it and then load the content for that menu option.

Only trouble is I have no idea how to pass the client menu id from the OnClientClick.  event.  You can see i tried this in my code sample already included before, but it doesn't seem to work.  I am hoping my error in that code will be obvious to someone.

regards
ewart

Hi Ewart

I can't see anything wrong with the idea, you are correct in passing _thing1 to the SetHilightMenu method. The only obvious thing I can see in your example is 'prevMenu = currentMenu;' should be outside the 'if' statement or it would never get set (as prevMenu would start and always be null). I would also check for null rather than '' as this is an object not an ID, and set prevMenu to null on start.

Thanks
Russell Mason

I have a following question:
I use the office2007 ribbon as a masterpage in a project.

Let's say that I want to create a portal with the office 2007 ribbon. EG. the buttonbar contains a link to subapplication1, a link to subapplication2 etc ...

What would be the best practice to do this ? and could rad.dock help with this ?

Mr. Mason,

Nice work on the Ribbon.  I'm new to the telerik design concept and have struggled with the client-side java script for sometime and can't seem to get the ribbon to minimize and maximize on the server side.   Could you please provide some insight on how you perform the seemingly easy, but miserable task?

Thanks.

Hi Tim

This should be fairly simple, have a look at the Server-side example ServerApplicationBar.aspx.

In the aspx the ApplicationBar has 3 key properties relating to this:
OnClientCustomizeClick="_applicationBar.showCustomizeMenu(event);"
CustomizeMenuID="CustomizeMenu"
ClientMemberName="_applicationBar"

The ClientMemberName property just provides a variable name for us to use on the client (without the explicit need to add the JavaScript).

The CustomizeMenuID is the ID of the Customize menu declared in aspx page. This is a standard Telerik menu.

The OnClientCustomizeClick event fires on the client when you click the clustomize button.

When you click the customize button we call the showCustomizeMenu method against the client-side ApplicationBar object. This shows the customize menu. When you click the menu it does a standard post back to the server using the OnItemClick="CustomizeMenu_ItemClick" server-side event handler. Once on the server we simply toggle the minimized state with the line:

this.MainApplicationBar.MinimizeRibbon = !this.MainApplicationBar.MinimizeRibbon;

The rest of the event handler deals with changing the menu’s image to toggle the display of the tick.

While you can do this via a post back I would suggest you look at the Client-side example ClientApplicationBar.aspx. This toggles the minimized state without doing a post back and so gives better user feedback.

Thanks
Russell Mason

Hello guys,

This is an updated version of the Office 2007 Ribbon UI application generously provided by Mr. Russell Mason.

The following is a brief description of the version 1.2 update:

Added a RibbonResizingManager control to allow collapsing and expanding of RibbonGroups
Added NavigateUrl and Target properties to Buttons
Added CausesValidation and ValidationGroup properties to Buttons 

Enjoy and happy coding!

Best wishes,
Stephen Rahnev,
Technical Support Director, Telerik

Instantly find answers to your questions at the new Telerik Support Center

Thanks for the update! I can now let the GenerateClientMember to true without buggon my javascript fonctions.

But now the minimized ribbon fonction do not work anymore. I can select the application menu and check Minimise ribbon, the checkbox appear but the ribbon are not minimized.

Thanks

After several test, If I use your new provided DLL someting goes wrong:
First I got this error in javascript:

 Erreur : _applicationBar1.attachTabStripEventHandler is not a function

_applicationBar1.attachTabStripEventHandler();Sys.Application.add_init(function() {
    $create(Telerik.Web.UI.RadAjaxPanel, {"ClientEvents":{OnRequestStart:"",OnResponseEnd:""},"EnableAJAX":true,"EnableHistory":false,"Links":[],"LoadingPanelID":"","Styles":[],"UniqueID":"PagesGMenu$RadAjaxPanel1"}, null, null, $get("PagesGMenu_RadAjaxPanel1"));
});

And all my Prometheus RadAjaxManager functionnality work one time only. If I replace your old DLL all work good...
Any suggestion?

Hi

First things first, are you sure you deployed the new Office2007Client folder to your project? attachTabStripEventHandler is in the JavaScript so it implies it may be trying to use the old version some how.

If that's not the problem, is this the attaching of an event to OnClientTabSelected you outlined previously? If so I will try to reproduce it to see what's happening.

Thanks
Russell Mason

shame on me... I forgot to copy the office2007 Client folder.
Thanks very good job.

Hello fellow devs,

First of all, I would like to thank Russell for this great app.  I plan to use it in the very near future. 

Second, I have taken the liberty to convert this application to VB and would like to share it with the community.  How can I upload the ZIP file to this thread?

*VB Version

Hi Shane

Thanks for you input, its nice to know someone has spend the time and effort to convert this project.

You need to send a request to Telerik support. However, I would prefer it if you could use another thread (I suggest you ask Telerik's advice on this). That way there would be no confusion as to what flavour people were downloading. Additionally, I would not be able to aswer questions about your convesion and that would help me to continue answering questions on this thread against code I am familiar with.

Thanks again
Russell Mason

What is the best way to reference your ribbonbar.js file?

If I don't put this:<script language=javascript src='Office2007Client/Scripts/RibbonBar.js'/> 
I got a javascrip error telling that applcationbar1 is undefined

I try this:
<head runat="server">
<title>Module de Gestion</title>
<link rel="Stylesheet" type="text/css" href="Office2007Client/Css/RibbonBar.css" />

<script language=javascript src='Office2007Client/Scripts/RibbonBar.js'/>

<script type="text/javascript" >
  function customizeMenuHandler(sender, eventArgs)
  {
    if (eventArgs.Item.Value == "MinimizeRibbon")
   {
      checked = _applicationBar1.getMinimizeRibbon();
      checked = !checked;
      imageUrl = "Images/Misc/Unchecked.gif";
      if (checked)
      {
        imageUrl = "Images/Misc/Checked.gif";
      }
      eventArgs.Item.SetImageUrl(imageUrl);
      _applicationBar1.setMinimizeRibbon(checked);
  }
}
</script>
</head>

its work, but when I try to minimized the ribbon I got a javascript error : customizeMenuHandler are undefined

if I put <script language=javascript src='Office2007Client/Scripts/RibbonBar.js'/> juste after the <form> tag All work (i can minimized the ribbon) but I got this javascrip error:Sys.WebForms.PageRequestManager.GetInstance() are null or not an object

Any suggestion? Thanks

Hi Pierre

1) The ribbon will not work without a reference to the javascript file
2) You must add the script reference in the head section as client side objects are created as the page is rendered, i.e. the script must have been loaded prior to this
3) I don't understand the error you are getting. If the script 'customizeMenuHandler' is defined in your page then it must exist so should not cause an 'undefined' error

Did you retype the error message, i.e. could it be that you have mistyped the method name?
Are you calling customizeMenuHandler from the OnClientItemClicked of a RadMenu, i.e the parameters match those expected?
How are you using controls?
Are you using a single page or Master/Content pages?

The ClientMockup and ClientApplicationBar examples use this mechanism without problem so we need to find what is different about the page you have created.

Thanks
Russell Mason

I found the problem, the 

type="text/javascript"

was not precised!

Hi,

Ribbon bar looks great!

Is there anyway to reduce/change the HTML markup it produces, to make the page downloading faster?

Regards

Hi Benoit

The layout for the Ribbon is quite complex so requires a reasonable amount of mark-up. I have looked at others who have tried the Ribbon layout in HTML and they have even more so I'm not sure that anything could be done to reduce the actual mark-up required.

There are ways you could probably use AJAX to progressively load the Ribbon, this would give the impression of loading faster but would actually take just as long. It would also be a sizable undertaking.

Thanks
Russell Mason

Me again.
i just reinstall all my developpement computer with windows Vista. I donwload the new Telerik release (SP2) and you new ApplicationFramework.

When I try to start a page with your framework in it, I got an error in the SharedStateWebControl.cs in the function OnPreRender:
FileLoadException
Cannot load the file or assembly "RadTabStrip.Net2" version 3.5.0.0, culture= neutral.

If I look in the Telerik Bin folder, I can see that the RadTabStrip.Net2 are now a version 3.5.2.0. I try to recompile your dll with your CS Projet, same problem.

Any suggestion?

Hi Pierre

Please see my post in this thread from 5/18/2007 4:38:59 AM. This holds true for any Telerik update.

Thanks
Russell Mason

Hi,

I'm a bit confused on the reasons why you've chosen to use the shared state. When you click a button and create a post back, surely all the information you need is in the view state for each object (e.g. textbox, checkbox etc)? Could you explain this a bit further?

The reason I ask this is I am looking at the possibility of removing this to simplify the code and output it produces.

Regards

Hi Benoit

I think I've explained the purpose of, and need for, SharedState quite clearly here and in the documentation. This is not a complex thing to undestand and I don't think I can add anything more.

You can take it out, but nothing will work, I guess thats your choice (though that doesn't sound like it will simply anything to me).

Thanks
Russell Mason

Hi,

Thanks for your reply.

Are there reasons why you have chosen to use "HtmlImage" instead of System.Web.UI.WebControls.Image?

I russell, a little question:

I try to ajaxified a orb largeribbonbutton without success. I use this command:

<orb:LargeRibbonButton ID="btnNew" runat="server" AutoPostBack="true" Text="Ajouter" EnabledImageUrl="Images/32x32/MenuAdd2.gif" ToolTip="Ajouter un item sous l'élément selectionné" ClientMemberName="_largeRibbonButton17" />

and in my Prometheus RadAjaxManager I put this:

<telerik:AjaxSetting AjaxControlID="btnNew">
  <UpdatedControls>
     <telerik:AjaxUpdatedControl ControlID="RadTreeMenu" />
  </UpdatedControls>
</telerik:AjaxSetting>

And in code behind:

Public Sub New_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles btnNew.Click

The radTreeMenu are updated correctly, but the page have a visible postback. If I try the same thing with a asp.net Button all work good. 
For now I need to invoque the client part of the ajax manager to avoid visible postback.
What I am doing wrong?
Thanks

the NavigateUrl do not support root oriented notation.

like this
largeRibbonButton.NavigateUrl="~/Admin/User.aspx";
simply does not work. i checked the source code of RibbonButton.cs,the following line in the RenderClientPostBack method

// Embedded JavaScript
string windowOpenCode = string.Format("window.open('{0}', '{1}');", this.NavigateUrl, target);

maybe we could change this to
string windowOpenCode = string.Format("window.open('{0}', '{1}');", ResolveUrl(this.NavigateUrl), target);

so that all the NavigateUrl support the root oriented notation

Hi,

I have a RibbonGroup object call RibbonGroup1.  How do I get a list of the children objects in the PlaceHolder at runtime?  In order words, I want to get a hold of the three LargeRibbonButton objects using the RibbonGroup1 object in the following code.  I try PlaceHolderControls property but it always empty.  Thanks you.

<orb:RibbonGroup ID="RibbonGroup1" runat="server" Text="System" Width="280px" ClientMemberName="_ribbonGroup1">
    <PlaceHolder>
        <orb:LargeRibbonButton ID="LargeRibbonButton1" runat="server" Text="Groups" Width="50px" EnabledImageUrl="~/Images/32x32/Groups.gif" ToolTip="Administer user groups and permissions" ClientMemberName="_largeRibbonButton1" />
        <orb:LargeRibbonButton ID="LargeRibbonButton2" runat="server" Text="Users" EnabledImageUrl="~/Images/32x32/Users.gif" ToolTip="Administer users and their group membership" ClientMemberName="_largeRibbonButton2" />
        <orb:LargeRibbonButton ID="LargeRibbonButton3" runat="server" Text="Certificates" Width="70px" EnabledImageUrl="~/Images/32x32/Certificates.gif" ToolTip="Administer certificates" ClientMemberName="_largeRibbonButton3" /> 
    </PlaceHolder>
</orb:RibbonGroup>

Hi Russell,

First of all, thanks for the great RibbonBar, it's very good :-)

I have a problem, however: I want to add buttons to a RibbonGroup after a push on a regular ASP.NET button (postback), but it doesn't happen. I have debugged your example page ServerProgrammatic.aspx a bit, and it seems the programmatic buttons for a RibbonGroup is added before the event handler for my regular button is executed.

Is it in any way possible to add buttons dynamically, other than overriding the ConfigureRibbonControls method?

I hope you can help me!

Thanks

/Soren Hansen

I am developing a web application based upon java. Can I easily export any menu to a js file?

Please feel free to email me directly at joseph.puopolo@jpuopolo.com

Hello Joseph,

RadControls are based on the ASP.NET framework and all server-side code is implemented on top of the Microsoft framework. The controls are not only client-side and therefore they can not be ported only to JavaScript.

All the best,
Ivo
the Telerik team

Hello!

I'm loading RadComboBoxItems in a RadComboBox dynamlicaly from a database in OnLoad-Event of Page.

RadComboBox does not work correctly inside a RibbonGroup. If SelectedIndexChanged fires, has RadComboBox no items.

Outside RibbonGroup or if RadComboBoxItems are not dynamicaly loaded, but exist statically in aspx, works all fine.

Any tipps?

Thanks a lot,
Vadim

Hi

Sorry for not replying recently but I am up to my eyes with other projects.

Unfortunately I do not have any spare time at the moment and won't for at least the next 6 months. I had plans to do a few fixes and add a couple of new features but this has now be postponed.

This means I am not able to answer any questions or contribute further to this project during this time.

Thanks for your support
Russell Mason

Hi everyone, I have found a minor bug that causes the 'title' attribute to be rendered twice, e.g.


For now I have fixed by editing LargeRibbonButton.cs line ~132 and also QuickAccessRibbonButton.cs line ~77 and commented out the Attributes.Add("title"..  line.  (I don't use any of the other buttons in my project and can't seem to find the 'base' where I suspect these are being added).


Doing so will reduce your page size a little with no loss in functionality as far as I can tell..  no doubt someone will find the base class for removing this duplicate.

cheers
ewart

i have ported ribbon to .net 1.1.
not everything was ported, i skipped the vs designer/editor part, didn't need it.

greets

Hi Peter,

It is great news that you have taken the time to port the Ribbon project to .Net 1.1
Please send us the files and we will attach them to this thread or start a new thread in the Code Library and attach the files yourself.

Your efforts will be rewarded with the respective amount of Telerik points which you can use for discounts in future purchases or renewals.

Regards,
Ivo
the Telerik team

I have also written master pages solution for asp.net 1.1 to simplify building complex layout. sure, its not a full fledged master pages like microsoft stuff, but works very similiar in many cases. you have contentplaceholder and content controls to make a layout and override default content from master.

This is how i use it:

ASPX page:

Master page:

Master pages are ascx files, ordinary web forms are aspx files.
The only difference is that your codebehind in aspx inherits my BaseMasterPage class:


regards

Hello p_e_t_e_r,

Thank you for posting your MasterPage analog for ASP.NET 1.x in this code library thread. We will be expecting the NET 1.x version of the Office 2007 Ribbon project once you are ready to deliver it.

Best regards,
Stephen
the Telerik team

already sent to support@telerik.com and sales@telerik.com

Hi Piotr,

Thank you for submitting ASP.NET 1.x version of the Office 2007 Ribbon UI demo developed by Mr. Russell Mason. I am posting your project in the same code library thread for everyone interested in version for the .NET 1.x version of the development environment. Additionally , I have added 5000 Telerik points to your account for the involvement.

Best regards,

Stephen

the Telerik team

Hi,

fixed couple of bugs, now all client and server examples work with no problem :)
I'll send it when i have time.

regards.

After using your controls, if I add to my pages other rad controls I get error like this one:



Can you help me?

Thanks

rgf21/Russell: I'm currently testing this feature for my company (using the trial version Q1 2007) and I have the same error, were you able to find out the solution?  I cant seem to regenerate the bin folders.

Thanks,

Please note, if you are using .net 1.1 you should register assemblies of .net 1.1 version. so your RadAjax.Net2

should be renamed to
RadAjax

Peter: i'm using .Net framework 2.0 (vs 2005)

Just recompiled the solution and got it to work...

thanks,

Please check this link in IE6

http://chatterjeenet-1.at.vwdhosting.net/public/

Every time when mouseOver on the groups and buttons, images are loaded. please help me to fix or i will have to replace the control

chatterjee.net@hotmail.com

Possible bug:
When I create a webpage in a sub-folder off the root and use the Office2007MasterPage as the Master, I get a javascript error when it tries to load each of the panels in the menu.  Has anyone else experienced this?

most probably you have relative paths in you head section where you include javascript library of ribbon bar. you can check it, and see if path starts without / at the beggining. i.e. ../script/file.js is relative path. you should use autogenerated paths using server variables to be undependant of where your files are.

greets

HI, I try the framework in VS2008 Beta2. I recompile all the framework in 3.5 version without error. But I can't use it on my webpage witout javascrip error (undifined) on all the clientMember variable.

Someone have succesfully jump to VS2008 with the RussellMason framework?

Here is what I have in my <head section:

<script language="javascript" type="text/javascript" src="Office2007Client/Scripts/RibbonBar.js"></script>

What should it be?

All scripts can be automated in codebehind like this:

Please note, that above is from .net 1.1 and this syntax is depreciated in 2.0. but theres analog version of page.registerclientscriptblock, just taka a look on msdn.
by using this method you're no longer troubled with js files location.

greets.

Thanks for your reply peter.  The problem with using the method that you suggested is now the NavigateUrl in the Template no longer points to the correct location.  I tried using NavigateUrl="~/MyRootPage.aspx" but still get an error.

To re-cap:
I have my OfficeTemplate file in the root of the application. 
On the menu, I have a RibbonButton that has a NavigateUrl="MyRootPage.aspx"

I have a page in the root folder called "MyRootPage.aspx" which uses the OfficeTemplate.  When I compile and run, the RibbonButton loads the proper file.

One page that also uses the OfficeTemplate is located in a subfolder /Folder1/MySubPage.aspx. 

Based on your previous suggestion, I add the clientscriptblock code to the codebehind in the "MyRootPage.aspx" and /Subfolder/"MySubPage.aspx" so the JavaScript files would load properly.  Now when I click on the RibbonButton from the "MySubPage.aspx", it can no longer find "MyRootPage.aspx" becuase it is looking in it's current folder.

If I change the NavigateUrl to NavigateUrl="~/MyRootPage.aspx" that also causes the "resource cannot be found" error.

 

I want to dynamically displaying the controls of the Ribbonbar from the Database.I have successfully implemented it.But there is one problem The Ribbon buttons are not displaying the Text for the control.If I dont include the image property of the button,the text is being displayed.But I want both the text and image of the ribbon button to be displayed

Hi Vimal

Just a quick one, try using AutoSizeWidth() or one of its overloads once the text has been set. Sounds as if the text does not fit the button width and is over-running the control area.

Thanks
Russell Mason

Hi Vimal,

Hopefully you will be able to share this with the rest of us.  I was going to start working on making the menu database driven but if someone else has done it might as well save some time.

Tim

When will it follow the 2007 UI guidelines completely? Do You have an possible date? Thanks

Hi

I did originally intend to do all required features (some of the requirements and optional features are a bit of a challenge for a web client). I have been busy on other projects for a while now and will be for the foreseeable future, so as this is just a project done in my spare time I don't foresee any further development any time soon. Sorry for the lack of additions but it is still at the back of my mind. I may come back to it but at this point I can't promise anything.

Thanks
Russell Mason

Russell,
I'm wondering if you wante to share the source files of the images (eg Ribbonbarend.gif, etc)

I'm interested in making other skins than the default light blue of Office 2007.

Nicolas

Hi all,

Has anyone worked on getting the Ribbon Bar to render faster? Render times are fine in Safari for Windows but IE, FF and at times Opera often use from 5 to 15 seconds on my desktop computer - both for Russel's ClientMockup.aspx and my own pages as well. I am not interested in full Office 2007 guideline conformancy, so removing parts of the control is definitely an option for me.

Regards,
Sjur

Will you use Prometheus in a future version? Thanks

I am also interested in a prometheus version of this framework. I have been using prometheus exclusively with my latest projects and would like to introduce a ribbon control. I just dont want to have to use the old controls to get the job done. Telerik what is your stance on this?

Is it free ??
if yes, why this message always appear

a.d.menu 4.2.2 trial version. Copyright telerik © 2002-2007. To remove this message, please purchase a developer version.

Thank you

Hi Russel,

Thanks for this great looking ribbon, I am having one issue with IE 6.0 SP2 I know you have only tested it with version 7.0 but I was hoping you have an idea where to look to try and fix it. It is with registering the resize event as far as I can see what happens.

The problem is that IE has an un ending loop going from function from RadTabStrip.js line 274:

return function(e){
if(!_4._domEventHandlingEnabled&&!_3){
return false;
}
return _4[_2](e||window.event);
};

to function from RibbonBar.js line 30:
function associateObjectWithEvent(object, methodName)
{
    return (function(event) {event = event || window.event; return object[methodName] (event, this);})
}

Thanks anyway for the control

-Mark

Hi Russel,

Thanks for your wonderful application. I downloaded the latest version of the application framework. I tried to use the ribbon resizing manager which works fine on ribbons created during design view. But when creating the ribbons at runtime, ribbon resizing manager does not work. I even created instance of ribbonresizingmanager and attached all the required properties. Please let me know if you have solution for this problem.

Regards,
VS

Hi Russell,

Is there a possibility to use the Office 2007 layout for the Radwindow?
We now implemented the ribbon bar inside the Radwindow but it would be nice if we could get rid of the radwindow title bar and drag and drop the window by the applicationbar.

Do you have such a thing planned?

Regards,
Rogier van de Roer

We are using this as part of our application and when ever we use the AjaxToolkit ModalPopupExtender the Tabstrip and the Menu image float on top of everything instead of getting hidden by the background div of the ModalPopupExtender.  Any ideas? I looked at ZIndex to see if that was a problem but our Zindex is higher then that of those two objects.

I have a image of what it looks like in case anyone needs to see it.
I'd email it or attach it but I dont have any addresses.... thanks

The following javascript script is missing from the download. It is used for the client examples.

RibbonPreloader.js

----ignore this query. I found it in the latest version which I only just noticed----

Hi. It is possible tu update the Office 2007 Ribbon UI to use the new Asp.net 2008 Q1 ?

Hi. I tryed to use the Q1 controls but im getting an error.
can anyone help me?

 code

Hi everyone, I'm wondering how many people are using this control and will require a promethesus version? 

cheers
ewart

Hi all,

We have received quite a lot of inquiries for an ASP.NET AJAX ("Prometheus") version of this project. We realize that Mr. Russell Mason is most probably busy with other projects ad that is why we will spend some time internally to upgrade this very popular code-library project.

Please, expect an update in this thread in the coming couple of weeks. Thank you for your patience.

Best regards,
Ivo
the Telerik team

This would be absolutely GREAT. If its succesful I would suggest adding it as part of your already impressive suite. Really looking forward to this one.

Hi

Whilst it has always been my intention to update this project to work with the latest versions of Telerik's controls, I have simply been too busy, something I don’t see changing any time soon.

I would, therefore, like to thank everyone at Telerik for spending the time and effort required in updating this project. Your involvement is very much appreciated.

Thanks
Russell Mason

Hi, i have a small problems using this excellent control set.

here the problems: i have a custom controls that create at runtime search criteria. when i post back using the large ribbon button only the text box value is set correctly when retrieving it. all the other one's (drop down)  are reset to it's default.

when i use a standard asp button all values are correctly posted back. thus highlithing the fact that may be the large ribbon button that is not posting back state changes.

hope you can help

Kind Regard
Normand

Hello all,

We have now provided a version with RadControls for ASP.NET AJAX. Please, find it attached.
Enjoy!


Greetings,
Ivo
the Telerik team

Telerik,

Good job porting the RibbonBar, but you left out the split buttons (LargeSplitRibbonButton and SmallSplitRibbonButton) as well as the RibbonResizeManager. Can we expect an update with these included?

Regards,
Sjur

Did this thread just die? Almost a week and still no replies. Are someone at Telerik still working on this issue or is it left as-is?

Regards,
Sjur

Hello Sjur,

We apologize for the delayed answer.

Our team is currently working on this project and soon it will be updated.

Regards,
Rosi
the Telerik team

Hi,

I have downloaded the 085467_RibbonBarApplication-ASP.NET_AJAX.
Tried to run it in Visual Studio 2008.

But I get the following error:

Error 1 Could not load file or assembly 'System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35' or one of its dependencies. The system cannot find the file specified. D:\My Documents\Visual Studio 2008\WebSites\085467_RibbonBarApplication-ASP.NET_AJAX\TestClient\web.config 29 

What am I missing,

Regards

Flippie

Hello Flippie,

I suggest you open the project with Visual Studio 2005. Also the error you provided means that you need ASP.NET AJAX Extensions 1.0 . You can download them from www.asp.net/ajax/ site.



Regards,
Rosi
the Telerik team

Any date for the new version? Thanks

Hello ,

The new version of the code library will be uploaded till the end of this week.

Regards,
Rosi
the Telerik team

Great news. thanks

Hi,

We have extensively used RibbonBarApplication-ASP.NET_AJAX in our application. We recently migrated to Prometheus controls and Visual Studio 2008 and was looking for an updated version of RibbonBarApplication-ASP.NET_AJAX with support for RibbonResizeManager. I will be really thankful to telerik support team if they can make the latest version available as soon as possible.

Thanks.

Hello Prakash Jothi,

RibbonBar Application using RadControls for ASP.NET AJAX is already updated and uploaded. You can download it and test it on your machine.

Regards,
Rosi
the Telerik team

hi,
i upgraded the mason's ribbon control to the new version,
the new feature "NavigateUrl" in the LargeRibbonbutton don't seems to work (autopostback or not) when i put "~/mypage.aspx" the page location is not resolved and so the browser try to access something like http://localhost/~/mypage.aspx
is this a bug ?

regards,
a good client

Hi Jean-Christophe Godinaud,

Please find the attached movie illustrating that everything works as expected at our side. Could you, please send us steps to reproduce the problem?

Greetings,
Rosi
the Telerik team

Would anyone like to share with the rest of us how they implemented or are going to implement this control. I for one love the idea of this control but am not sure how to implement it in future projects

Hello Brent,

The zip with name RibbonBarApplication-ASP.NET_AJAX.zip which is uploaded to this code library is the latest version updated. This project cannot be seen online,but you can see online the same project using RadControls for ASP.NET at http://www.killerbitesoftware.com/Office2007/Examples/

This project is uploaded in this code library with name ApplicationFramework.zip

Hope this helps.

Regards,
Rosi
the Telerik team

Russell, thank you for your hard work and update to a wonderful UI.

Awesome!!!! Awesome!!!!
Good stuff Russell and Telerik Team.
does it also works on most recent version of RadControls 2008.1.619?

I replaced the binaries and scripts from the latest release, recompiled, and was good to go. Just make sure you set it to "Release" in Visual Studio.

To fix the problem with relative URLs (e.g. ~/Foo/Bar.aspx), use much the same solution as another poster pointed out above.

1. Download RibbonBarApplication-ASP.NET_AJAX.zip (link is at the top) and extract it. As of this writing it should extract to a folder called 087839_RibbonBarApplication-ASP.NET_AJAX
2. Open the solution in Visual Studio (I use VS 2005).
3. Put your licensed binaries from your telerik ajax controls directory (e.g. C:\Program Files\Telerik\RadControls for ASPNET AJAX Q1 2008\Bin )
4. Open RussellMason.Web.Applicaton/Web/UI/Office2007/RibbonButton.cs
5. Go to line 469 or thereabouts
6. Change the following line:

   string

   .Format("window.open('{0}', '{1}');", this.NavigateUrl, target);
   
   to this:
   
   string.Format("window.open('{0}', '{1}');", this.ResolveUrl(this.NavigateUrl), target);
   

7. In Visual Studio, go to Build > Configuration Manager and change the Active Solution Configuration to Release, check the Build box nex to RussellMason.Web.Application and make sure it'set to Release and Any CPU.

8. Build the solution.

9. NavigateURL should now work properly.

Thanks to Telerik for an ASP.Net-AJAX update to this project, to Russell Mason for developing it, and to Chuanbo for pointing out the ResolveURL fix.

This Office2007 implementation is wonderful and is a joy to use.

Hi,

I download the latest RibbonBarApplication-ASP.NET_AJAX.zip file. The resize manager functionality seems not to be working as described in client examples(ClientRibbonResizingManager) in the TestClient project. Clicking on the collapsed group doesnot show the group's controls as a pop-up. I would be thankful if someone can help in fixing this issue.

Thanks,
Prakash J.

Hi, I found the same issue in the Test client as Prakash  - the ribbon bar collapses into a menu nicely, but it won't actually pop up - at least in IE6.

..otherwise, awesum!  it even works with the new futures .708 build :)

cheers
ewart

Ah, and one other thing that was broken in the upgrade - (best replicated in the client mockup)

When the ribbon bar is minimized ("minimize the ribbon" on the quick access toolbar), and you click a tab, the ribbon bar is supposed to appear (floating above the page), and it used to, but it no longer does.

When you click the menu it is supposed to call setAppearance() to set the style to float (line 597) in RibbonBar.js,
 if (this.getRibbonOpen())
    {     
     multiPageView.className = "ribbonBarFloat";


But as far as I can tell, and I'm no JS expert, this method isn't called on the tab click, hence it doesn't appear.

regards
  ewart

Hi Ewart,

Thank you for bring this to our attention.

To solve the issue with the disappearing ribbonbar, you need to edit the attachTabStripEventHandler javascript method in the following way:

See the attached project for further reference.

Best regards,
Rosi
the Telerik team

First of all, thanks to Russell and all other contributors for such an excellent project.

I am trying to start the Ribbon minimized, but when I set the MinimizeRibbon property in the <orb:ApplicationBar> to true, I get an error in the ControlFinder class as soon as the application starts. More specifically, it occurs in line 58:

if (control.ID == id)

where control is null

Does anybody know a workaround to this issue?

Thanks in advance

Ricardo Villalobos
Accellos, Inc.

Hi, I have a question about the RadWindow behaviour when dragging the window. In the example (http://www.killerbitesoftware.com/Office2007/Examples/Client/ClientMockup.aspx) it shows a gray rectangle that is dragged around, but when using the 087839_RibbonBarApplication-ASP.NET_AJAX.zip version, it drags the window itself. This results in clearing all iframes on the page while dragging, including the window contents.

The styling looks very different as well: Screenshot
The tabs don't look like the example, the section text is bold and the small button in the 'System' section is way over to the right

(Also, I noticed the minimized ribbon not expanding, but this was resolved in the post before mine. However, the expand behavior is different; it pushes the content down instead of overlapping it.)

Sander
businessbase.com

Hi,

The two applications have different style since they use different versions of the controls. The demo which is online as part of our QSF uses RadControls for ASP.NET and this which is in RibbonBarApplication-ASP.NET_AJAX.zip contains RadControls for ASP.NET AJAX.

As for the different behavior of RadWindow:
Could you please provide us with detailed steps to reproduce the issue and/or a screenshot (as well as specify exact example contains the problem)?

Regards,
Rosi
the Telerik team

So, are you telling us that the ajax version has different styling than the normal version? When do you expect an update fot he ajax version?

Regards,
Sander

Hello ,

The RibbonBar application for ASP.NET AJAX uses the same Skins as the ribbonBar version for ASP.NET. But more of RadControls for ASP.NET AJAX has different rendering as RadControls "Classic". That is why the new skins look different. Some of the skins are redesigned too. If you want to change the styling of some of the controls you can read Customizing Appearance help topic of documentation of every control .For example for RadMenu it can be found here.

All the best,
Rosi
the Telerik team

Hi.

I also use this ribbon in my project. I can see that may other people use it too. Maybe was time to give us a Ribbon control for asp.net don't you think? This control was the main reason I choose telerik in the first place. It would  be great if telerik integrate it in the RadControls.

Thanks.

Hi Rosi,

hereby a sample of the strang effect when dragging the RadWindow (See movie). 

In the example (http://www.killerbitesoftware.com/Office2007/Examples/Client/ClientMockup.aspx) it shows a gray rectangle that is dragged around, but when using the 087839_RibbonBarApplication-ASP.NET_AJAX.zip version, it drags the window itself. This results in clearing all iframes on the page while dragging, including the window contents.

I expect the same behaviour as in the online example.

Sander

Hi,


Also dragging the window instead of the visual clue is behavior implemented by design in a result of client requests. We have logged in our To-Do list to implement it as optional instead of default.

In addition, note that the online example uses the source code from ApplicationFramework.zip. The demo from RibbonBarApplication-ASP.NET_AJAX.zip will be online soon.

Best regards,
Rosi
the Telerik team

Hi,

I have downloaded latest of RussellMason.Web.Application.
I wrapped one of the webpages(ServerSmallRibbonButton.aspx) in RadAjaxPanel. 

<

body onload="preloadRibbonImages('../../Office2007Client/Images/');">
<form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <telerik:RadAjaxPanel ID="ajaxifyingPanel" runat="server" Height="100%"  
    Width="100%" EnableAJAX="true">
        <div style="min-width: 600px;">
            ....
            ....
        </div>
    </telerik:RadAjaxPanel>
</form>
</body>

The issue I am facing is that small ribbon buttons in the ribbon bar loose their hover style inside the RadAjaxPanel. On clicking on the first time the behaviour is as expected and we can see the hover style. But subsequent clicks result in loosing the hover style though the postback action happens as expected.

I will be thankful if someone can help in resolving this issue.

Thanks and regards,
Prakash J.

Hi,

I wrapped one of the webpages(ServerSmallRibbonButton.aspx) in RadAjaxPanel and added a required field validator to the Text Box.

<body onload="preloadRibbonImages('../../Office2007Client/Images/');">
<form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <telerik:RadAjaxPanel ID="ajaxifyingPanel" runat="server" Height="100%"  
    Width="100%" EnableAJAX="true">
        <div style="min-width: 600px;">
            ....
            <div class="pageTitle">Server-side examples</div>
            <div class="plainText" style="margin-top: 16px;">
            This text box will show the results of clicking any Ribbon button that has a server-            side event handler.</div>
            <div style="margin-top: 8px;">
            <asp:TextBox runat="server" ID="EventText" Rows="4" TextMode="MultiLine" 
                Width="500px"></asp:TextBox>
            <asp:RequiredFieldValidator runat="server" ControlToValidate="EventText" 
            ErrorMessage="*"></asp:RequiredFieldValidator>
         </div>
             ....
        </div>
    </telerik:RadAjaxPanel>
</form>
</body >

The issue I am facing is that validation is not getting fired after partial page rendering. On clicking for first time the validator gets fired for empty text box. But on subsequent clicks the validator is not fired.

It would be of great help if someone can guide in solving the issue.

Thanks and regards,
Prakash J.

Hi Prakash ,

The issue with  the RequiredFieldValidator is due to a bug in RadAjax which is fixed in our latest official release.

Please find the attached project which works as expected now. You can download it and try it.

Kind regards,
Rosi
the Telerik team

Telerik,

Are you working on upgrading the Ribbon to the 2008 Q2 release of RadControls for ASP.NET AJAX? In case, do you have an estimate of when it is expected?

Regards,
Sjur

Hi Sjur,

The last project attached in this code library thread by my colleague Rosi should use the ASP.NET AJAX versions of RadControls. Please use it for further reference.
 
Regards,
Stephen
the Telerik team

Stephen,

Thanks for your quick reply. The attached file RibbonBarApplication-ASP.NET_AJAX.zip still uses version 2008.1.515.20 (Q1). When will  you update to Q2?

Regards,
Sjur

Hello Sjur,

You can easily update the assemblies. For details on how to this please refer to our KB article (ID#503) Updating RadControls for ASP.NET to another version or license.

Sincerely yours,
Paul
the Telerik team

Hi,

The SmallRibbonButton.prototype.showDropDownMenu function in theRibbonBar.js file is calling the RadMenu's IsChildOf javscript function which does not exist in RadControls for ASP.Net AJAX.  Does anyone now of another function to replace the IsChildOf function?  If not then can I safely remove the call to the IsChildOf function fromt the if statement?

Thank you,

Vincent

 

SmallRibbonButton.prototype.showDropDownMenu = function(evt)

{

menu = getObjectByID(this.getDropDownMenuID());

if ((!evt.relatedTarget) || (!menu.IsChildOf(menu.get_element(), evt.relatedTarget)))

{

menu.show(evt);

}

cancelEventBubble(evt);

}

 

In version 3 of the project, why doesn't the ribbon group hover not work?

Thanks

Hello Russell,

I currently work on a project using your 'RussellMason.Web.Application', which helps me a lot but I encountered one problem:

1. if I set minimize Ribbon bar as 'false', everything works fine.
2. but I need minimize Ribbon bar, after I do this by add the following code to 'Page_load' of my master page, the RadTabStrip cannot work properly.
       [[this.MainApplicationBar.MinimizeRibbon = true;]]

please click the following link to get the attachedment files for the screenshots and the sample project to illustrates this problem, I'm very sorry I don't know how to attache the files here.
http://www.telerik.com/client.net/my-support-tickets/view-ticket/b307G-bgdett.aspx

Please help, thanks in advance!

Jane

Hi Jane Dong,

We have run your files and they work as expected at our side.
Please see the attached movie for a reference.

Perhaps you use an old verison of Telerik.Web.UI. I suggest you upgrade it to the latest official -2008.2.826.

Regards,
Rosi
the Telerik team

Hi Rosi,

thank you for your reply.

To make sure I'm using the latest version, I installed the latest version again and also  RibbonBarApplication-ASP.NET_AJAX.zip, but the problem remains the same.

I'm using Visual Studio 2008, .net framework 3.5, so for RibbonBarApplication, I changed the framework to 3.5, and add the refrence 'System.web.Extensions' again.

Are you using the same as me?

Any other advice? thanks!

Jane

Hi Jane,

Yes, we use the same version.

Please find attached the project including your files.They are placed under test folder.

Best,
Rosi
the Telerik team

Hi Rosi,

I downloaded the attached project, but find that:

you are using Visual Studio 2005 and .net framework 2.0, and the reference for 'System.Web.Extensions' is version '1.0.61025.0'.

but I'm using Visual Studio 2008 and .net framework 3.5, and refernce for 'System.Web.Extensions' is version "3.5.0.0".

Is this the reason why the project cannot work properly on my side?

Thanks!

Jane

 

Hello Jane,

You can convert the project to use the ASP.NET 3.5 framework (and System.Web.Extensions 3.5.0.0 respectively) using the VS2008 project converter. You can also add BindingRedirects to the web.config file manually as explained in this help topic.

Regards,
Stephen
the Telerik team

Hi Rosi,

Finally I found the reason after I compared your files and mine, I found that I copied the wrong script files.

For  folder "Office2007Client", I copied from folder "RussellMason.Web.Application\Web\UI\Office2007\Office2007Client" other than the 'TestClient\Office2007Client' folder, I assumed they are the same :(

Now everything is OK, thank you very much!

Hello!

I hope this is the right thread to be posting on.  We are currently using the Office 2007 Ribbon UI in a development project.  (Works great out of the box, and looks wonderful)

The problem that I'm having is that if you use 2 ASP.NET controls in 2 different Ribbon Groups, and allow them to PostBack.  The second button that is clicked on actually runs the Event Handler from the first Postback in addition to its own.

If you use the Server-side AJAX example in the Test Client, and add a radio button (autopostback=true) to one ribbon group, and then a regular button to a second ribbon group, you'll see what I mean.  (you can copy/paste this over top of RibbonGroup6 & RibbonGroup3)

                    <orb:RibbonGroup ID="RibbonGroup6" runat="server" Text="Small Ribbon Buttons" Width="210px" GenerateClientMember="True" ClientMemberName="_ribbonGroup6" >
                        <PlaceHolder>
                            <orb:ThreeRowLayout ID="A" runat="server">
                                <TopPlaceHolder><orb:SmallRibbonButton ID="ClickSmallRibbonButton" runat="server" DisabledImageUrl="~/Images/16x16/DocumentDisabled.gif" EnabledImageUrl="~/Images/16x16/Document.gif" Text="Click" Width="80px" ToolTip="Click this button to demonstate the Click event handler used with AJAX" AutoPostBack="True" OnClick="ClickSmallRibbonButton_Click" ClientMemberName="_clickSmallRibbonButton" />
                                    <asp:radiobutton id="testRadioButton" runat="server" text="Hello" autopostback="true" oncheckedchanged="ClickSmallRibbonButton_Click" />
                                </TopPlaceHolder>                            
                            </orb:ThreeRowLayout>
                            <orb:RibbonSeparator id="RibbonSeparator3" runat="server"></orb:RibbonSeparator>
                            <orb:ThreeRowLayout ID="ThreeRowLayout3" runat="server">
                                <TopPlaceHolder><orb:SmallRibbonButton ID="EnabledSmallRibbonButton" runat="server" DisabledImageUrl="~/Images/16x16/DocumentDisabled.gif" EnabledImageUrl="~/Images/16x16/Document.gif" Text="Enabled" Width="80px" ClientMemberName="_enabledSmallRibbonButton" ToolTip="This button will reflect the Enabled state" /></TopPlaceHolder>
                                <CenterPlaceHolder><orb:SmallRibbonButton ID="CheckedSmallRibbonButton" runat="server" DisabledImageUrl="~/Images/16x16/DocumentDisabled.gif" EnabledImageUrl="~/Images/16x16/Document.gif" Text="Checked" Width="80px" ClientMemberName="_checkedSmallRibbonButton" ToolTip="This button will reflect the Checked state" /></CenterPlaceHolder>
                            </orb:ThreeRowLayout>
                        </PlaceHolder>
                    </orb:RibbonGroup>
                    <orb:RibbonGroup ID="RibbonGroup3" runat="server" Text="Large Ribbon Buttons" Width="224px" ClientMemberName="_ribbonGroup3">
                        <PlaceHolder>
                            <asp:button id="testButton" runat="server" text="Test Button" onclick="ClickLargeRibbonButton_Click" />
                            <orb:LargeRibbonButton ID="ClickLargeRibbonButton" runat="server" Width="65px" EnabledImageUrl="~/Images/32x32/Document.gif" Text="Click" ToolTip="Click this button to demonstate the Click event handler used with AJAX" DisabledImageUrl="~/Images/32x32/DocumentDisabled.gif" AutoPostBack="True" OnClick="ClickLargeRibbonButton_Click" ClientMemberName="_clicklargeRibbonButton" />
                            <orb:RibbonSeparator ID="RibbonSeparator1" runat="server" />
                            <orb:LargeRibbonButton ID="EnabledLargeRibbonButton" runat="server" Width="60px" EnabledImageUrl="~/Images/32x32/Document.gif" Text="Enabled" DisabledImageUrl="~/Images/32x32/DocumentDisabled.gif" ClientMemberName="_enabledLargeRibbonButton" ToolTip="This button will reflect the Enabled state" />
                            <orb:LargeRibbonButton ID="CheckedLargeRibbonButton" runat="server" Width="60px" EnabledImageUrl="~/Images/32x32/Document.gif" Text="Checked" DisabledImageUrl="~/Images/32x32/DocumentDisabled.gif" ClientMemberName="_checkedLargeRibbonButton" ToolTip="This button will reflect the Checked state" />
                        </PlaceHolder>
                    </orb:RibbonGroup>

The results for clicking the radio button first, and then the regular button are:
Small Ribbon Button Clicked
Small Ribbon Button Clicked
Large Ribbon Button Clicked

As you can see, when I click the regular button, the radio button EventHandler fires as well. (for a second time)

Are these controls (the Ribbon Groups) meant to house regular ASP.NET controls?

Thanks in advance for any help!

Jason

Hello Jason,

I am not sure what cause the problem. Also it seems that it is reproduced only with the RadioButton control. After the first time the radiobutton is clicked, it does not postback anymore. That is why when the button is clicked two events are fired. If you replace the RadioButton  with a CheckBox control everything works as expected:


Hope this helps.

Greetings,
Rosi
the Telerik team

Hi,

Thanks for the quick response.  Unfortunately, the checkbox doesn't appear to solve the problem...

I have added a checkbox to the code I posted earlier, and it does the same thing as the Radio Button:

Clicking the checkbox first, then the "test button" results in:
Small Ribbon Button Clicked
Small Ribbon Button Clicked
Large Ribbon Button Clicked

Let me know if you need more info!

Jason

Hi Jason,

I suggest you edit the CreateChildControls method in the RibbonBar.cs file by the following way:


Greetings,
Rosi
the Telerik team

Hello,
anyone can explain me why I can create Telerik controls OnPreRender event but not Ribbon Controls. Is it a limitation or by design?
This is because I need to create some ribbon buttons programmatically reading them from a external provider that expose data only from OnPreRender event.
How is it possible to address this problem?

Regards,
Marco

Hi Marco,

Please see the attached page which works as expected at our side. You can test it by adding it to the project from the code library.

Best regards,
Rosi
the Telerik team

Rosi,

Thanks for all of your help, your code changes (setting enableviewstate to true) worked perfect!

I couldn't find the file called RibbonBar.cs...So I made those edits to a file called RibbonGroup.cs...I'm just posting this for future reference. 

Thanks again!

Jason

Hi Russell

Using Office Ribbon in the masterpage, can you please explain how to place usercontrols in the content area when a button is clicked from the ribbon menu.The state of tab should not change and the clicked button should remain highlighted.

Regards
Shekhar

Hello,
Is there one single application to be downloaded that has all changes listed in this thread?

Thanks

Hello Bilal Haidar,

This thread contains many posts and different user requests. You may download the code library and contact us later if you encounter problems.

Kind regards,
Helen
the Telerik team

Thanks for the reply.

Does this mean, if I download the code in the link at the top of this thread, contains all the fixes and updates?

Thanks

Hello,

I would like recompile Ribbon with new version of Telerik Control 2008.3 1314 but i have dependance probleme.

I replace in directory /bin and replace reference ... but  i have probleme

Could not load file or assembly 'Telerik.Web.UI, Version=2008.1.619.20, Culture=neutral, PublicKeyToken=121fae78165ba3d4'  ....

I have reference in httphandler and copy EditorDialogs and App_GlobalResources ... but i don't understand.

Could you help me ?

Thn kou

Hi Bertrand,

The reasons for this error and the solution are discussed in the following help article:

http://www.telerik.com/help/aspnet-ajax/troubleshooting.html

Best regards,
Sebastian
the Telerik team

Hi Telerik,

Hi Aaron Ellery,

A full-blown RadRibbonBar control is in our ToDo list for next releases but we can not commit to a time-frame yet. We are now working on a few other items with higher priority.

For now you can either use the sample in this thread or the "official" (and simpler) online demo we have:
http://demos.telerik.com/aspnet-ajax/toolbar/examples/applicationscenarios/ribbonbar/defaultcs.aspx?product=toolbar

Kind regards,
Ivo
the Telerik team

Hi Guys,

hi Aaron,

 

I just migrate my application from a quite backdated version of Telerik.Web.UI.dll of 2008.2.723.25 to 2009.1.311.35.

I just need to make sure RussellMason.Web.Application project is rebuild using the the same Telerik.Web.UI.dll version, everything display and works fine as old version. 

Great work for Telerik, the UI coloring looks more consistent and impressive. Thanks.

Hi Telerik,

Hello Aaron,

You can find the migrated Office2007Big skin attached to this post.

Thank you for the kind words regarding the RadControls. Currently we have no plans for adding the RibbonBar to the suite in the near future.

All the best,
Alex
the Telerik team

Hi Telerik,

Hello Aaron,

The issues that you see may be because I've renamed the skin to Office2007Big, since there is already an embedded skin named Office2007.

You can either replace all occurances of "Office2007Big" with "Office2007" or change the RadMenu declaration so that it uses the Office2007Big skin instead of the Office2007 one.

Kind regards,
Alex
the Telerik team

Hi Alex,

Hi Aaron,

I'm sorry, it was my mistake. I was using the ToolBar / Application Scenarios example to test the skin. You can find attached an updated version that works with the RibbonBar sample application.

Greetings,
Alex
the Telerik team

Hello -

We are testing implementing the Ribbon Bar into our project and ran across an issue with the ribbon bar minimized state when issuing a response.redirect when using a LargeRibbonButton and a DropDownMenu. We are correctly using the RibbonSerializer.StoreRibbonState to store the state and RibbonSerializer.RestoreRibbonState to restore the state. This works fine so far when using other controls as the ribbon bar is correctly hidden or not based on the session values. However when using a DropDownMenu that has an OnItemClick event once the menu item is clicked the following happens:

• The ribbon bar is minimized on the click of the menu item. This is correct
• The server side onItemClick is called and the response.redirect to another page occurs. This is correct.
• The new page is loaded and stepping through the code the MainApplicationBar.MinimizeRibbon property is properly set to true to minimize the ribbon bar. This is correct.
• Once the new page is done loading the ribbon bar is displayed in the non-minimized state even though it is supposed to be displayed minimized. This is NOT correct.
• Now if you click anywhere on the page the ribbon bar is correctly minimized. This happens due to the document onclick being associated in Javascript to the JS function dismissRibbon.

Note, this only happens when an OnItemClick event is used. If you just use the NavigateURL and no postback occurs the ribbon bar is minimized as expected. Unfortunately, we need the postback to do some things serverside so this is not an option for us. Does anyone have an ideas as to why this is occuring and/or could Telerik look into this issue and provide us with some insight on how to resolve?

Thanks in advance.

 

Hi Telerik,

Hi Telerik,

Hi Telerik,

we are currently thinking about purchasing Infragistics or Telerik controls for our project.

A main part of the project is the ribbon framework.

I can't find any download link of the latest VB.NET Office 2007 Ribbon UI for Visual Studio 2008 (2010).

If you could provide me a download link it would be very helpfull.

Thank you and Kind Regards,

Johannes

Hello Johannes,

We currently do not have a separate RadRibbonBar control for ASP.NET AJAX. There are a couple of examples how to achieve a similar interface with the current controls - one of them is in the online demos and the other one is here in this thread contributed by a Telerik community member - Russell Mason. I hope these are helpful.

Kind regards,
Ivo
the Telerik team

HI Ivo,

thanks for your reply.

I looked for a VB.NET version of the RibbonBarApplication-ASP.NET_AJAX3 but I just found only C# above.

Version 1.2 update ApplicationFramework = C#
RibbonBarApplication-ASP.NET_AJAX = C#
RibbonBarApplication-ASP.NET_AJAX2 = C#
RibbonBarApplication-ASP.NET_AJAX3 = C#

Is there any chance to get a VB.NET RibbonBarApplication-ASP.NET_AJAX3 ?

Would be rly great and helpfull.

Thanks and kind regards,


Johannes

Hello Johannes,

You can convert the C# code from the sample project in VB.NET language using our free online converter:

http://converter.telerik.com/

Greetings,
Sebastian
the Telerik team

Hello,

@the posting below: I don't need a VB.NET version of the project anymore.

So here are the good news:

I took the latest sample provided here and did some updates and some changes to it, here is a overview:

- Updated the Visual Studio version to 2008
- Updated the .NET framework version of the project to v. 3.5
- Updated the RadControls version to Telerik.Web.UI.2009.2.701.35 (that's the Q2 2009 release from 6th July 2009)
- Replaced the ScriptManager in the Office2007TemplateMasterPage.master with a faster RadScriptManager for better support of the RadControls
- Added a RadFormDecorator in the Office2007TemplateMasterPage.master with the value "Skin" set to "Office2007" for more Office 2007 feeling in the webapp
- Added a Office2007.aspx page to provide a sample that everything works

/Edit:

The project is attached to this post.


Good Luck and Kind Regards,

Johannes

Hi Johannes,

Thank you very much for your efforts -- they will be appreciated by a lot of people in the Telerik community. Your Telerik points have been updated.

The files are now attached to your message as well.

P.S. Thank you for the tweets as well!

All the best,
Ivo
the Telerik team

Hi

After update to ribbonbar-q2-2-9-3-5.zip, i have one problem.

First, my RadDropDown under largeribbonbutton is not working, it stops on line :

LargeRibbonButton.prototype.showDropDownMenu = function(evt) {
    menu = getObjectByID(this.getDropDownMenuID());

    if ((!evt.relatedTarget) || (!menu.IsChildOf(menu.get_element(), evt.relatedTarget))) {
        menu.show(evt); //here
    }

    cancelEventBubble(evt);
}

Any ideas?

Hi Grzegorz,

I did run this page: TestClient/Examples/Client/ClientLargeRibbonButton.aspx

But I don't get any errors or stops at the function you are reffering to.

Could you provide a sample?

Thanks and Kinds Regards,

Johannes

I found my bug.
I had RadMenu control rather than RadContextMenu control. After update to new version od telerik kontrols, my soulution broke down. After change to RadContextManu everything is working fine :)
Regards
Grzegorz

Hi Grzegorz,

glad to hear that you found your bug and fixed it!

If you have any further problems feel free to post them here - you're welcome!

Kind Regards,

Johannes

my ShowDialogLauncher does not appear. i used the current attachment.

Hello Russell,

Has anyone had any issues when using a RadScheduler in a project that uses the Office 2007 Ribbon UI?

There are so many posts to go through, what is the most current version of the library to download. Aslo, where is the css used on http://www.killerbitesoftware.com/Office2007/Examples/Default.aspx? The title area's text is colored differntly and there are mouse over events on the button groups that change colors.

Thank you

I am having a strange issue. It started once I added the ResizeManager to my project. First, I had to modify the

RibbonResizingManager.prototype.expandCollapseGroups

method in the RibbonBar.js becuase some of my Ribbon Groups are hidden depending on the page. So, the group object would not get instantiated properly. Here is what I did:

On any of my pages that have an UpdatePanel and an UpdateProgress area I am getting an error: this.sharedState is undefined. Becuase of this error my UpdatePorgress window is not closing.

Hi,

Hello Russel,
                     I need ribbon bar on my webpart which is to be places on sharepoint 2007 site.
I am not able to do that with framework. Getting "File not Found" ,i tried toi dubug it but it is not able to go to the create controls part i got error on the webpart constructor it self.
   Please help me how can i use the framework to display a ribbon on a webpart. Do i need any license agreement with microsoft.
I don't know all that. Please guide me.
Waiting for your reply. As it is an urgent requirement for me.


Thanks in advance.
Shabana