1

尝试结合 jQuery-Steps ( http://www.jquery-steps.com ) 和语义 UI ( http://semantic-ui.com )，代码如下。SemanticUI 验证丢失内联弹出窗口，需要帮助。

此外，在进行下一步时，如何首先验证语义 UI 字段？

<script>
(function ($) {
    $('#regform').form({
    email_address: {
    identifier: 'email_address',
    rules: [{
        type: 'empty',
        prompt: 'First Name is required'
    }]}
    },{
    on: 'blur',
    inline: 'true'
}).steps({
    headerTag: '#regform_sectionHeader',
    bodyTag: '#regform_section'
});
})(jQuery);
</script>
4

1 回答 1

2

虽然这有点晚了，但我也遇到了同样的问题，并解决了它。希望这可以帮助任何有同样问题的人。

我猜这个问题是由于在 JQuery 步骤之前首先初始化语义 UI 表单验证。

问题可能在于 JQuery 步骤将语义 UI 表单 HTML 从最初保存它的内容标记中移出并移入新容器，而在调用向导初始化时没有正确复制事件。

因此，您基本上需要做的是在 JQuery 步骤之后初始化语义 UI 设置和验证。这可以使用 JQuery Steps onInit()事件来完成。

onInit: function (event, currentIndex) { 

    //Initialize Semantic UI dropdown
    $('.ui.dropdown').dropdown();

    //Initialize Semantic UI Form validations
    $(".ui.form").form(formValidationRules);
},

完整的工作代码和演示：http ://plnkr.co/edit/5rVWPXZ7hAkqnZO9ubJP?p=preview

于 2015-06-01T01:33:59.963 回答