c# - DNN 6 jQuery 选项卡

Question

我已经尝试了好几次都未能让 DNN 6 版本的 jQuery 选项卡(称为 DNNTabs)在自定义模块“编辑”页面(以模式打开，类似于模块“设置”)内工作。我想要将相同的默认主题/css 应用于选项卡和按钮(它的行为应该几乎与设置完全一样)。

这似乎是一些文档的开头，但它不是很完整。

http://www.dotnetnuke.com/Resources/Wiki/Page/dnnTabs-jQuery-Plugin.aspx

我已经在互联网上搜索了一个示例，但大多数示例都使用了原始的 jQuery 选项卡和/或对其进行修改以“与 DNN 一起工作”。

http://jqueryui.com/demos/tabs/

我的代码开头不起作用。

<script type="text/javascript">
    $('#tabs').dnnTabs();
</script>
<div id="tabs" class="dnnForm dnnModuleSettings dnnClear">
    <ul class="dnnAdminTabNav dnnClear">
        <li><a href="#tab1">Tab 1</a></li>
        <li><a href="#tab2">Tab 2</a></li>
    </ul>
    <div id="tab1">
        Some content...
    </div>
    <div id="tab2">
        Some content...
    </div>        
</div>

我在其他地方读到我必须像这样在我的 OnInit 中请求 DNN 插件注册:

protected void OnInit(object sender, System.EventArgs e)
{
    DotNetNuke.Framework.jQuery.RequestDnnPluginsRegistration();
}

我是否遗漏了另一个引用、代码行之类的东西？ 1) 所有选项卡都在加载时显示 2) 单击一个选项卡只会滚动到模式中的 id 位置(之后无法滚动回顶部)

Answer 1

我认为这看起来很完整；我看到的唯一问题是您在定义选项卡之前初始化插件。也就是说，您要做的第一件事是检索带有 ID 选项卡的元素并为其设置插件，但该元素尚不存在。将您的脚本移动到控件的底部，我认为它会开始工作。

您可能需要调整的另一件事是您的 OnInit 处理程序。通常，OnInit 是 Control.OnInit 的重写，因此它最终看起来像这样:

protected override void OnInit(EventArgs e)
{
    base.OnInit(e);
    jQuery.RequestDnnPluginsRegistration();
}

您可能还想在 https://github.com/bdukes/DNN-World-Demos 查看我的这个(和其他)插件示例.这些示例非常精简，因此您会发现其中有一些您并不真正需要的 CSS 样式，如果您不使用它们的话。