Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/447.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 语义UI避免某些按钮单击事件的表单验证触发器_Javascript_Jquery_Validation_Semantic Ui - Fatal编程技术网

Javascript 语义UI避免某些按钮单击事件的表单验证触发器

Javascript 语义UI避免某些按钮单击事件的表单验证触发器,javascript,jquery,validation,semantic-ui,Javascript,Jquery,Validation,Semantic Ui,因此,默认情况下,语义ui没有任何方法来阻止在表单设置完成后触发验证的单击,因为验证是在Submit上直接处理的。如果您在页面上有多个按钮,并且只希望其中一些按钮触发验证,而其他按钮可能能够回发,或者执行除触发表单验证之外的其他操作,那么这一点很重要 我检查了一些关于将输入从type=submit更改为type=button的答案,但是您失去了设计能力,尤其是添加图标的能力,这不是理想的解决方案 我发布了这个问题,因为我的答案被版主删除了,尽管我有一把工作小提琴和一个关于如何实现这一点的详细答案

因此,默认情况下,语义ui没有任何方法来阻止在表单设置完成后触发验证的单击,因为验证是在Submit上直接处理的。如果您在页面上有多个按钮,并且只希望其中一些按钮触发验证,而其他按钮可能能够回发,或者执行除触发表单验证之外的其他操作,那么这一点很重要

我检查了一些关于将输入从type=submit更改为type=button的答案,但是您失去了设计能力,尤其是添加图标的能力,这不是理想的解决方案

我发布了这个问题,因为我的答案被版主删除了,尽管我有一把工作小提琴和一个关于如何实现这一点的详细答案


在这里重新发布整个答案,以防任何人需要帮助。

我能够以不同的方式实现这一点,因为button type=button控件在忽略验证时没有提交,如果我手动提交,semanticui的默认事件处理程序将介入并显示验证错误

我的用例有两个按钮,一个是保存草稿,另一个是最终保存。第一个必须按原样保存数据,而不触发验证,而另一个将触发验证,然后保存

我还使用我为这个项目定制的数据属性来实现所有的验证器,因此表单验证器位于JS文件中

在表单验证的失败方法中,我包含了一个委托函数,我可以在页面上设置该函数,并根据单击该函数的按钮,然后返回true或false

JS文件中的我的表单验证程序 在我的页面上,我在窗口上附加了一个函数,因为我的表单验证在一个JS文件中

页面功能 对于我不需要此功能的其他页面,我不能简单地编写委托方法,默认验证将按预期在submit按钮上触发

也张贴在这里

希望这有助于任何人寻找更好的方式来处理这种情况

$('.ui.form').form({
    inline: true,
    on: 'submit',
    fields: formFields,
    transition: 'fade',
    keyboardShortcuts: false,
    onFailure: function () {
        var returnValue = false; //Default to false, since validations failed

        //If the delegate is present, fire it to evaluate
        if (typeof window.delegValidate == 'function') {
            returnValue = window.delegValidate();
        }

        //Ignore the toast if the delegate evaluated to TRUE
        if (!returnValue) {
            $('body')
                .toast({
                    title: 'Unable to save',
                    message: 'Please enter all required field data before saving.',
                    classProgress: 'red',
                    showProgress: 'top',
                    progressUp: true,
                    position: 'bottom right',
                    showIcon: 'red exclamation triangle'
                });
        }
        return returnValue; // false is required if you don't want to let it submit
    }
});
       //For all postback buttons, save the id value in a hidden field for use in the delegate
        $('.postbackButton').bind('click', function (e) {
            $('#ButtonClicked').val(this.id); // a hidden field on the page
        });

        //setting the delegate for use in the form validations
        window.delegValidate = function () {
            //For the save button, just ignore the validations and return true
            //This in turn is invoked by the failure method of the form validation that is 
            //dynamically attached to the page, and hence this return value is respected
            //over the false that is otherwise sent back for when we want to interrupt the page
            //since there are errors normally.
            if ($('#ButtonClicked').val() == 'Save')
                return true;
            else // if value is finalize, let it return false
                return false;
        }