p:向导onnext没有停止'导航'

时间:2015-10-21 18:02:37

标签: jsf primefaces wizard

当我使用p:向导时,我使用onnext属性的自定义处理程序,处理程序只是警告并返回false以测试行为。

据我从primefaces库中的wizard.js了解到,点击向导的下一个按钮,下面的代码应该执行:

next: function () {
        if (this.cfg.onnext) {
            var b = this.cfg.onnext.call(this);
            if (b == false) {
                return
            }
        }
        var a = this.cfg.steps[this.getStepIndex(this.currentStep) + 1];
        this.loadStep(a, false)
    } 

我的理解是这样的:向导首先执行自定义处理程序,如果自定义处理程序返回false,则不应加载下一个选项卡(调用PrimeFaces.widget.Wizard.loadStep)。但实际上会发生的事情是自定义处理程序被称为然后,称为向导的PrimeFaces.widget.Wizard.loadStep函数,因此下一个选项卡将被聚焦。

我的理解是错误的,或者这是PF中的错误?

1 个答案:

答案 0 :(得分:2)

刚做了一点检查,“订单”没问题,所以然后,因为你说它没有错,问题是它被称为无论如何,即使你(想)你回归假。

问题在于:

this.cfg.onnext.call(this);

始终返回undefined。它在5.3和5.1以及5.0和4.0中都失败了,所以这最初让我觉得它在未来的浏览器中从未经过全面测试或有所改变。但实际发生的是,一个定义的函数(在我的例子中是demo)包含在一个匿名函数

function (){demo()}

没有返回值,所以不是

function (){return demo()}

没有“返回”,导致它永远不会返回从函数返回的实际值,但总是“未定义”。

这让我想到onnext="demo()"只是添加回报......所以让它成为onnext="return demo()" et瞧,它有效。

请记住,使用javascript调试器很容易调试,并且您始终可以覆盖函数以添加其他日志语句。

我测试的代码:

<html  xmlns:h="http://xmlns.jcp.org/jsf/html"
       xmlns:p="http://primefaces.org/ui"
       xmlns:ui="http://xmlns.jcp.org/jsf/facelets">
<h:head />
<h:body>
<h:form id="form">

    <p:wizard onnext="demo()" flowListener="#{mailTemplateBean.onFlowProcess}">
        <p:tab title="Step 1"/>
        <p:tab title="Step 2"/>
        <p:tab title="Step 3"/>
        <p:tab title="Step 4"/>

    </p:wizard>

    <script>

    PrimeFaces.widget.Wizard.prototype.next = function() {
        if(this.cfg.onnext) {
            var value = this.cfg.onnext.call(this);
            console.log("Return: " + value + " function: " + this.cfg.onnext);
            if(value === false) {
                return;
            }
        }

        var targetStepIndex = this.getStepIndex(this.currentStep) + 1;
        if(targetStepIndex &lt; this.cfg.steps.length) {
            var stepToGo = this.cfg.steps[targetStepIndex];
            this.loadStep(stepToGo, false);
        }
    }

    function demo() {
        var bla = confirm("Sure?");
        console.log("Choosen: " + bla);
        return bla;
    }</script>

</h:form>
</h:body>
</html>

请向PF提出问题并要求他们将此添加到文档中,或让他们修复函数的“包装”,添加自动返回。