javascript - 强制检查 dirtyforms.js

Question

在选项卡之间切换时，我尝试检查表单是否脏乱 - 如果表单脏乱，则显示警报。

我正在使用这个插件:https://github.com/snikch/jquery.dirtyforms

当尝试访问外部页面时，Ii 工作正常(在这里我会收到警告)，但是当我在选项卡( Bootstrap )之间切换时，没有任何反应。我创建了一个特殊的类(“.chkChange”)来监听表单是否脏，但是当我单击选项卡时没有任何反应。选项卡如下所示:

<li class="setup-conditions"><a data-toggle="tab" class="chkChange" href="#setup-conditions">Procedure</a></li>

我可以使用此代码片段检查表单是否脏，但我需要帮助来触发 dirtyforms 中的警报构建:

$('#myTab li a').click(function () {
    if ($('form').dirtyForms('isDirty')) {
        //alert("Form is dirty");
    }
});

就像我说的，如果我将相同的类放在另一个(外部)链接上，它会提示是否有任何更改 - 机器人不在选项卡上。

Answer 1

在这种情况下，您可以customize the event binding将点击处理程序附加到您的链接。

$(document).bind('bind.dirtyforms', function (ev, events) {
    var originalBind = events.bind;

    events.bind = function (e) {
        $('#myTab li a').on('click', events.onAnchorClick);
        originalBind(e);
    };
});

脏表格将正确

1. 检查表单是否脏了
2. 如果脏了，阻止点击事件
3. 显示对话框
4. 如果用户决定继续，将重新触发点击事件

Dirty Forms ignores your anchor tag by automatically because it has no HREF tag. This was a feature that was contributed by the community, that I am now reconsidering because apparently there is an argument to monitor anchor tags that don't have HREF sometimes.

更新

默认行为已在 2.0.0-beta00005 中更改默认情况下包含没有 HREF 标记的链接。这应该可以解决这个问题，这样您就不需要附加该事件。但是，根据您使用的库，您可能需要向 Dirty Forms 添加 ignoreSelector 才能停止监视它们。

$('form').dirtyForms({ ignoreSelector: 'a.some-class:not([href])' });