Adding tab via plugin in version 3.80

This topic was automatically closed 365 days after the last reply. New replies are no longer allowed.
6 years ago
I'm finally back to try to figure out why client-side validation is not working...

sohel wrote:

The following js are missing in Admin Layout

  Html.AppendScriptParts("~/Scripts/jquery.validate.unobtrusive.min.js");
    Html.AppendScriptParts("~/Scripts/jquery.validate.min.js");



True, yet somehow the built-in tabs seem to be doing it.  (how?)


I think the problem may be related to the added tab being 'dynamic content'.  I've tried a few things based on this article, but I still can't get it to work.
www.noptools.com
0
6 years ago
Hi There,

I have Added a New tab in Product-edit page in Admin Section, a Comobox is also added in that tab,

Now On Save Button of Product-edit Page I want to get that Combobox selected value in my controller method. But i am unable to get it.

here is Sample Code.

public void HandleEvent(EntityUpdated<Product> eventMessage)
        {
            object objectId = System.Web.HttpContext.Current.Request.RequestContext.RouteData.Values["id"];
            object planId = System.Web.HttpContext.Current.Request.RequestContext.RouteData.Values["PlanId"];

        }


How to get that Combobox values in my controller.
0
6 years ago
Any idea how to set a Success message after hitting Save on my custom tab? right now it just updates my url and puts a # at the end.
Custom T-Shirts at http://www.ochapparel.com
0
6 years ago
Mariann wrote:
Hi,

now you can add tab the following way:

eventMessage.BlocksToRender.Add(new MvcHtmlString(
"<script>"
        + "$(document).ready(function() {"
            + "$(\"<li><a data-tab-name='tab-name' data-toggle='tab' href='#tab-name'>"
            + _localizationService.GetResource("Computer.Category.MenuIconTab")
            + "</a></li> \").appendTo('#category-edit .nav-tabs:first');"

            + "$.get('" + urlHelper + "', function(result) {"
            + "$(\" <div class='tab-pane' id='tab-name'>\" + result + \"</div>\").appendTo('#category-edit .tab-content:first');"
            + "});"
        + "});"
+ "</script>"));




Is there a mistake?

Not added!
0
6 years ago
khoaphamnet wrote:
Hi,

now you can add tab the following way:

eventMessage.BlocksToRender.Add(new MvcHtmlString(
"<script>"
        + "$(document).ready(function() {"
            + "$(\"<li><a data-tab-name='tab-name' data-toggle='tab' href='#tab-name'>"
            + _localizationService.GetResource("Computer.Category.MenuIconTab")
            + "</a></li> \").appendTo('#category-edit .nav-tabs:first');"

            + "$.get('" + urlHelper + "', function(result) {"
            + "$(\" <div class='tab-pane' id='tab-name'>\" + result + \"</div>\").appendTo('#category-edit .tab-content:first');"
            + "});"
        + "});"
+ "</script>"));




Is there a mistake?

Not added!


No, there is no error here. But you have to confirm the following ==>  id='tab-name',  href='#tab-name','#category-edit .nav-tabs:first'  and urlHelper, These will be your defined name.
Sohel

Skype: sohel.bs23
Head of nopStation
0
6 years ago
If anyone would find this useful, here is an extension to eventMessage that is working well for me in Nop 4.0:

public static HtmlString TabContent(this AdminTabStripCreated eventMessage, string tabId, string tabName, string url)
        {
            return new HtmlString($@"
                <script type='text/javascript'>
                    $(document).ready(function() {{
                        $(`<li><a data-tab-name='{tabId}' data-toggle='tab' href='#{tabId}'>{tabName}</a></li>
                        `).appendTo('#{eventMessage.TabStripName} .nav-tabs:first');

                        $.get('{url}', function(result) {{
                            $(`<div class='tab-pane' id='{tabId}'>` + result + `</div>`).appendTo('#{eventMessage.TabStripName} .tab-content:first');
                        }});
                    }});
                </script>");
}


Example of calling the extension function:
public void HandleEvent(AdminTabStripCreated eventMessage)
        {
            if (eventMessage?.Helper == null)
                return;

            if (eventMessage.TabStripName == "vendor-edit")
            {
                string url = new UrlHelper(//... url helper logic here as you need
                
                var vendorTab = eventMessage.TabContent("MyTabId", "My Tab Name", url);
                eventMessage.BlocksToRender.Add(vendorTab);
            }
}
1
6 years ago
ChuckR wrote:
The only downside to this implementation is if users are fast when selecting a plugin tab upon arriving at the admin screen.
For example, I have 3 custom tabs on the product edit screen. I also have a license for nop-templates quick tabs and attachments....so 5 in total.
If you edit a product (/admin/product/edit/x), if the loading spinner (top right) is still going and you click on a custom tab, the tab is selected visually, but the content from 'info' tab will continue to display.  Even when the page is fully loaded, your custom tab is selected (visually), but the info tab is actually being displayed.  Then you can click on any other tab, then click back on your custom tab and your in good shape.
If you edit a product and wait the couple seconds for the loading to totally finish, then click on your custom tab, its great.
Now, nop-templates must have noticed this during their development of their plugins, and they implemented differently than the code suggested in this thread.  They look to be doing a call on demand when you click on one of their custom tabs... They display simple "loading" text during the fetch.  But even if you click immediately on their attachments tab (as an example) while the main sites loading gif is still spinning, they show the loading text in the content panel, and after a brief delay, the content renders.
I am changing my implementation to work this way, but just thought I would mention this so that people can rethink this implementation before using it.


I've also noticed this. Has anyone already have a workaround for this yet?
0
This topic was automatically closed 365 days after the last reply. New replies are no longer allowed.