如果验证失败,则阻止更改标签 - easyResponsiveTabs

时间:2018-05-11 13:08:56

标签: jquery tabs

我在我的应用程序中实现了easyResponsiveTabs。在每个选项卡中,我都使用AjaxBeginForm发布我的数据。我通过单击隐藏的保存按钮更改选项卡时保存数据。

如果验证失败,我想阻止标签更改。有没有可用的选择。 我在更改标签时按照以下代码保存数据:

 $('#ulTab').on("click", "li", function (event) {
        var activeTab = $(this).find('a').data("tabid");           
        var hdnActivetabIndex = $("#hdnActivetabIndex");
        $("#hdnActivetabIndex").val('');
        var btnsave = $("#btnsavetab");
        if (btnsave != null && hdnActivetabIndex != null && btnsave.prop("disabled") == false) {
            hdnActivetabIndex.val(activeTab);
            btnsave.click();
        }
        else {
             Tab_Change(activeTab);
        }

    });
$('#divTabs').easyResponsiveTabs({
        type: 'default', //Types: default, vertical, accordion
        width: 'auto', //auto or any width like 600px
        fit: true, // 100% fit in a container
        tabidentify: 'horz_1', // The tab groups identifier
        activate: function (event) { // Callback function if tab is switched
            var $tab = $(this);
            var $info = $('#nested-tabInfo');
            var $name = $('span', $info);
            $name.text($tab.text());
            $info.show();
        }
    });

此处点击提交的按钮表单。

1 个答案:

答案 0 :(得分:0)

添加return false以停止传播。

我建议您将选择器更改为$('#ulTab li')

$('#ulTab li').click(function (event) {
    var activeTab = $(this).find('a').data("tabid");           
    var hdnActivetabIndex = $("#hdnActivetabIndex");
    $("#hdnActivetabIndex").val('');
    var btnsave = $("#btnsavetab");
    if (btnsave != null && hdnActivetabIndex != null && btnsave.prop("disabled") == false) {
        hdnActivetabIndex.val(activeTab);
        btnsave.click();
        return false;
    }
    else {
         Tab_Change(activeTab);
    }

});