hi,
I noticed that tab rendering is changed in Nop Commerce version 3.80. I am trying to add a tab in products edit, the way I did in version 3.70. but it is not working.
Can some one help to identify the change in new version i.e. version 3.80.
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>"));
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>"));
public static class TabStripHelper
{
/// <summary>
/// Renders an additional tab to an element
/// </summary>
/// <param name="attachToElementWithId">The id of the element to attach to, e.g. product-edit</param>
/// <param name="tabTitle">The title of the tab</param>
/// <param name="contentUrl">The url to fetch the content of the tab</param>
/// <param name="tabId">The id of the new tab. If null or empty, it is calculated from <paramref name="tabTitle"/></param>
/// <returns></returns>
public static MvcHtmlString RenderAdminTab(string attachToElementWithId, string tabTitle, string contentUrl, string tabId = null)
{
tabId = string.IsNullOrEmpty(tabId)
? ("tab-" + tabTitle.Trim().ToLower().Replace(" ", "-").Replace("'", "\""))
: tabId;
return new MvcHtmlString(
"<script>"
+ "$(document).ready(function() {"
+ "$('#" + attachToElementWithId + " > .nav-tabs')"
+ ".append('<li><a data-tab-name=\"" + tabId + "\" data-toggle=\"tab\" href=\"#" + tabId + "\">" + tabTitle + "</a></li>');"
+ "$('#" + attachToElementWithId + " > .tab-content').append('<div class=\"tab-pane\" id=\"" + tabId + "\" data-contenturl=\"" + contentUrl + "\">Loading...</div>');});"
+ "$(document).one('click', 'a[data-tab-name=" + tabId + "]', function() {$(this).tab('show');"
+ "$.ajax({async: true,cache: false,type: 'GET',url: '" + contentUrl + "'})"
+ ".done(function(data) {$('#" + tabId + "').html(data);}); }); "
+ "</script>");
}
}
HandleEvent(AdminTabStripCreated eventMessage)something like this:
eventMessage.BlocksToRender.Add(
TabStripHelper.RenderAdminTab("product-edit",
"My Tab",
"/MyAdminController/Configure/" + productId));