Link 直接到视图中的笔记本页面

Question

我有一个扩展当前项目视图的视图，我们在其中添加多个选项卡（笔记本页面）以显示来自项目其他部分的信息。

其中一个页面是概述页面，它总结了其他选项卡下的内容，我想 link 将每个部分的标题直接显示到每个显示的页面。我目前通过使用每个选项卡的索引并在选项卡中的 link 上调用 bootstrap 的 .tab('show') 方法来解决此问题：

$(".overview-link").click(function (e) {
    e.preventDefault();
    var sel = '.nav-tabs a:eq(' + $(this).data('tab-index') + ')';
    $(sel).tab('show');
});

这是有效的，因为我在我的小部件代码中为每个 header link 附加了一个 data-tab-index="<int>"，但它很脆弱 - 如果有人稍后添加选项卡，当前索引将被打破。早些时候我依赖于每个选项卡上的锚点，但它也坏了（如果插入新的笔记本页面也可能会坏）。

触发 Web 客户端重定向/表单 link 直接有效，但我想在视图中显示特定页面：

this.do_action({
    type: 'ir.actions.act_window',
    res_model: 'my.model.name',
    res_id: 'my.object.id',
    view_mode: 'form',
    view_type: 'form',
    views: [[false, 'form']],
    target: 'current'
});

有什么方法可以通过 do_action 方法或 FormWidget 上的类似方法 link / 将 Web 客户端直接重定向到特定的笔记本页面选项卡？

Answer 1

我没有尝试我给你的解决方案，但如果它不起作用至少可能会让你想出一些主意。

XML 个元素有一个名为 autofocus 的参数（对于按钮和字段是 default_focus 并取 1 或 0 作为值）。如果您将 autofocus="autofocus" 添加到 XML 中的页面，则此页面将是您打开视图时显示的页面。

所以，当用户点击相应的 link 时，您可以尝试通过 JavaScript 添加它 - 老实说，我现在不知道如何实现 -。但是你可以为XML中的每个link添加一个独特的context参数，例如context="{'page_to_display': 'page x'}"。当您单击 link 时，我希望这些上下文键将到达您的 JS 方法。

如果没有，您还可以修改 fields_view_get 方法（我在这里写了如何做到这一点：）来检查您是否获得了添加到 [=27] 的上下文=]s 并将 autofocus 参数添加到相应的页面。

Answer 2

如你所说：

This works since I've attached a data-tab-index="" to each header link in my widget code, but it's brittle - if someone adds a tab later, the current indices will be broken.

我假设您的应用程序允许实时多用户交互，因此您必须在代码中的某处集成更新部分功能。

此函数将在发生更改时触发并清除数据以重建索引以避免当前索引被破坏。

Answer 3

如果我理解得很好，你想 select 来自 JavaScript (jQuery) FormWidget 的选项卡，考虑到如果有人安装另一个添加另一个模块，id 可能会改变选项卡

解决方案 0

您可以在 xml 表单视图中将 class 添加到 page。您可以使用此 class 名称 select 元素的 ID 来调用正确的锚点和 select 正确的选项卡项。这应该在页面完全加载时发生：

<page class="nb_page_to_select">

$('a[href=#' + $('.nb_page_to_select').attr('id') + ']').click()

注意：正如您所说的以下段落，我假设您知道运行该指令的位置。我建议的解决方案与索引无关。

This works since I've attached a data-tab-index="<int>" to each header link in my widget code, but it's brittle - if someone adds a tab later, the current indices will be broken. Earlier I relied on the anchor on each tab, but that broke as well (and would probably break if a new notebook page were inserted as well).

解决方案 1

加载页面后，您可以获得选项卡列表 DOM 对象，如下所示：

var tablist = $('ul[role="tablist"]')

然后您可以单击特定选项卡，按锚点内的文本进行选择。所以你不依赖标签索引：

tablist.find('a:contains("Other Information")').click()

我认为如果您有两个具有相同文本的选项卡没有任何意义，那么这应该足够了。

解决方案 2

即使您想更具体一些，也可以在笔记本中添加 class 以确保您在正确的笔记本中

<notebook class="nt_to_change">

现在您可以使用其中一个表达式来 select 选项卡列表

var tablist = $('div.nt_to_change ul.nav-tabs[role="tablist"]')

// or

var tablist = $('div.nt_to_change ul[role="tablist"]')

解决方案 3

如果 contains selector 不能说服你，因为它应该相等，你也可以这样做来比较和过滤

tablist.find('a').filter(function() {
    return $.trim($(this).text()) === "Other Information";
}).click();

其中"Other Information"是笔记本页面的字符串

Link 直接到视图中的笔记本页面

Link directly to a notebook page in a view

odoo

odoo-10

解决方案 0

解决方案 1

解决方案 2

解决方案 3