We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
close icon

How to get Customer Toolbar in MVC (non classic) Grid Working like online Example.

VS 2013
Syncfusion MVC: 12.1451.0.49

I'm trying to create a custom toolbar just like on the online example (Expand, Collapse, Refresh) but it isn't working. (I don't need Expand and Collapse but when testing left them in just to see if they would show up.)

The project attached was created from the Syncfusion template in VS 2013 and is MVC 5 non-classic. I've updated the project with the latest ...0.49 MVC patches and made the project .NET 4.5.1 instead 4.5. The only other change is in the site.css - I removed a !important from one style definition based on the suggestion of a prior submission regarding SplitButton.

What happens when I add something like the following:

.ToolBar(toolbar =>
  toolbar.AllowToolBar(true).CustomToolbarItems(new List<object>() { "Expand", "Collapse", new Syncfusion.JavaScript.Models.CustomToolbarItems() { TemplateId = "#Refresh" }});

along with the script sections for both css, template, and javascript just like the example, the toolbar area is created but none of the items show. If you hover over the area there are regions created but it seems to be for each letter of a json representation of the toolbar definition. For example if you hover in a particular stop you may see the letter C show up for the "C" in Collapse. What would be the first toolbar item location shows a '[' which is the start of the json data.

I've removed all the toolbar "stuff" from the attached project since the online example I don't think is correct. Even the names for image resources, such as "../Content/ej/common-images/icons-white.png", are incorrect as they don't exist in the Syncfusion template for 12.145x.0.43 through 12.145x.0.49.



Attachment: TestSfMVC_5d0201da.zip

2 Replies

RU Ragavee U S Syncfusion Team June 9, 2014 12:30 PM UTC

Hi Rick


We have analyzed the sample that you have provided and the issue that you have mentioned.


The ASP.Net MVC Controls will render in two mode, they are

·         Unobtrusive mode

·         Non-unobtrusive mode.

The ASP.Net MVC Controls will render in Unobtrusive mode when setting the “UnobtrusiveJavascriptEnabled” as true in web.config file.


. . . .

<add key="UnobtrusiveJavaScriptEnabled" value="true" />



We have analyzed and suspect that this issue had arose in unobtrusive mode.


We confirmed “Issue with CustomToolBar in Unobtrusive mode” as a defect. The fix for this issue will be available in our Volume 2, 2014 release at the mid of June Month.


As of now, the requirement of custom tool bar can be achieved by setting the UnobtrusiveJavascriptEnabled as “false”.


For your convenience, we have modified the sample that you have attached in your previous update, with the customToolBar enabled and UnobtrusiveJavascriptEnabled set to “false” . The sample can be downloaded from the attachment.


Please let us know if you need any further assistance.



Ragavee U S

Attachment: TestSfMVC_3fcb0156.zip

MS Madhu Sudhanan P Syncfusion Team July 11, 2014 10:27 AM UTC

Hi Rick,


We are glad to announce that our  Essential Studio Volume 2 2014 is rolled out and is available for download under the following link.




The fix for the issue “Issue with CustomToolBar in Unobtrusive mode” has been included in the above link.


We thank you for your support and appreciate your patience in waiting for this release. Please get in touch with us if you would require any further assistance.



Madhu Sudhanan. P

Live Chat Icon For mobile
Up arrow icon