Broken menus in Admin area whilst trying to make a plugin admin page

Hi,

I'm trying to build a multi-page admin area for a plugin. The first configure page works perfectly, but subsequent pages don't display properly.

I have made subsequent pages by getting their views to use the admin area's layout. I've also used a 5 part URL for the routes.

My problem is that although all of my links work for moving around my plugin pages, the admin area links are all broken.

The most obvious manifestation of this problem is that the entire admin menu lacks the "/Admin" portion of the URL. There is also a rendering fault where the close button of the ajax notification bar is visible.

I have worked out that the Admin layout needs to be rendered in the context of the MVC Admin Area, but I don't know how to ensure that my own views make this happen. Note that I have added .DataTokens.Add("area", "Admin") to my route mapping.

I really hope someone can help, this stuff is really confusing me.

P.S. I did get the admin menu to render properly once, but my own action links were broken then, particularly those in Telerik Grids. Can't remember what I did, just hoping someone's already been there.

Cheers,

Mark

mrabjohn wrote:

Hi,

The Admin area has the registration as

            

context.MapRoute(
                "Admin_default",
                "Admin/{controller}/{action}/{id}",
                new { controller = "Home", action = "Index", area = "Admin", id = "" },
                new[] { "Nop.Admin.Controllers" }
            );

So any link that resembles Admin/[CONTROLLER_NAME]/[ACTION_NAME]/[ID_IF_ANY] is going to be redirected to the corresponding Controller under Nop.Admin. To bypass this, just make your route more than 4 parts, for example Admin/Plugins/Misc/PluginName/ActionName/Id-if-any. The link should then work, assuming it is registered properly in RouteProvider.cs of the plugin itself.

Thanks Lam, I've already read up on that issue and changed my route accordingly.

To clarify some of the technical bits:

If I use route:

            routes.MapRoute("Plugin.Widgets.Slider.Admin",
                "Admin/Plugins/IA/WidgetsSlider/{action}",
                new { controller = "WidgetsSlider", action = "" },
                new[] { "Nop.Plugin.Widgets.Slider.Controllers" }
           );

ActionLinks generated to my controller actions are correct i.e.

@Html.ActionLink("Test2", "Configure2", "WidgetsSlider")

Generates "/Admin/Plugins/IA/WidgetsSlider/Configure2" as expected.

The Configure2 view starts with:

    Layout = "_AdminLayout";

When my view is displayed, all links generated via my route are correct, which means that my plugin config works as expected, that's not the problem here.

Links generated via the Admin route don't contain "/Admin" e.g. my view contains:

@Html.ActionLink("(Back to widget list)", "List", "Widget")

This generates "/Widget/List" i.e. "/Admin" is missing. This situation is repeated throughout the entire admin menu.


If I add the ".DataTokens.Add("area", "Admin")" to my route, the behaviour is completely different. In this case, an action link to my Configure2 action is generated as "/WidgetsSlider/Configure2" which is completely wrong to begin with, AND the admin route links don't work.


I'm missing some info on how to generate the correct ActionLinks, or how to set up the correct route, or otherwise how to get the admin route links and the admin layout to render correctly.


I'm somewhat lost, please help.

Mark

I'm using NopCommerce 2.65 too, although I'm presuming that I'm the problem, not Nop.

mrabjohn wrote:

Hi,

To solve the problem of the Admin Menu items not rendered correctly, you can try editing ~/Nop.Admin/Views/Shared/Menu.cshtml as follow:

Html.Telerik().Menu().Name("Admin")
    .BindTo("admin", (item, siteMapNode) =>
    {
        //Add this line
        item.RouteValues = new RouteValueDictionary() { { "area", "Admin" } };

The reason being your plugin not in the same area as Nop.Admin, so when your plugin is rendered, Telerik Menu assume the menu items is at the same area as your plugin.

Similarly, to produce the correct ActionLink in your plugin Views, use the following (taking from you previous example):

@Html.ActionLink("Widgets", "List", "Widget", new { area = "Admin" }, null)

Note the new { area = "Admin" } part. :D

Hi Lam,

I'd already worked out that I could add { area = "Admin" } to my own external links, thanks for confirming that' I'm on the right track.

The admin sitemap file update will probably be useful too, I'll try that later.

Thanks for your help.

Mark

Hi Lam,

That additional line in the Menu.cshtml worked great, thanks!

I have one last problem, and I'm hoping that you or someone else can help out with.

To recap, I now have my own plugin page, which uses the _AdminLayout file, and I've altered the menu, and my external actions so that everything works well.

There is one remaining issue with working in this mode, I have the close icon from the front-end's _Notification view rendered just below the date in the admin area. I presume that the View engine is falling back to the front end instead of the Admin area.

I tried copying the admin _Notification view to my plugin Views/Shared folder and marking it as an embedded resource, but that didn't clear up the issue.

Does anybody have any ideas?

I believe that I can define a section, and use the IsSectionDefined logic, but that would remove the bar, not use the correct one. Could I use a defined section to call in the Admin _Notification view?

Cheers,

Mark

mrabjohn wrote:

Just add an extra line in your CSS to hide the bar. Setting

display: none;

will do the job. :D