Question

我有一个基于远程数据源的面板栏，都可以正常工作。提要中的属性之一与屏幕上的表单字段相结合，将确定用户是否可以单击面板栏中的子项并浏览至url，或者是否出现警告对话框且导航失败。

我正在使用以下技术在Feed中捕获给定的json属性，并将其与面板中的每个项目相关联：

    $("#panelbar").kendoPanelBar({
        dataSource: haRepList,
        template: "<span class=''repType'' data-url=''#= item.type #''>#= item.name #</span>",
        select: function(panel){
           var classId =  $(panel.item).find(".repType").data(''url'');
           if (classId !== ''undefined'') {
           alert(classId);
           }
        },
        dataTextField: ["name", "name"]
    });

因此，当我单击给定的项目时，会收到一条警报，告诉我type属性是什么。现在，我需要根据此值和屏幕上的另一个字段来告诉面板“不允许点击URL起作用”。

Answer 1

您可以尝试preventDefault，stopPropagation或直接尝试return false：

$("#panelbar").kendoPanelBar({
    dataSource: haRepList,
    template: "<span class=''repType'' data-url=''#= item.type #''>#= item.name #</span>",
    select: function(panel){
       var classId =  $(panel.item).find(".repType").data(''url'');
       if (classId !== ''undefined'') {
           panel.preventDefault();
       }
    },
    dataTextField: ["name", "name"]
});

这里是指向有效demo的链接，其中第二个面板有条件地被禁用。希望这会有所帮助。

如何在面板栏中有条件地单击导航

1 个答案: