java - jsf 2.0 (myfaces) 中的 ajax 调用，在渲染完成之前调用 ajax 标记中的 onevent Javascript 函数

Question

这是我第一次在论坛上提问，因为通常我的问题已经被提问和回答了。我还没有找到适合我的这个问题的答案，所以这里是:

我正在 JSF 2.0 中进行 Ajax 调用，如下所示:

< f :ajax listener="#{myReferenceController.clearRequiredReferenceNumber}"
    onevent="resetFocus" execute="@form"
    render=":resultsForm:ResultsDisplay" />

监听器中的一切都完美无缺，然后数据在我的 .xhtml 页面中的数据表中按预期呈现。问题是我在 onevent 中调用的 Javascript 似乎在渲染完成之前被调用，因此将焦点重置到我的 datatable 中的列的过程> 不起作用，因为 datatable 被删除，然后在 Ajax 完成重新呈现时重新添加到 DOM。

我正在我的 Javascript 中查找“成功”状态，希望此时渲染已经完成。唉，事实并非如此，我的 getElementById(实际上是 dojo.byId)没有在数据表中找到元素。我知道我的 Javascript 函数在正常情况下工作，因为我在没有 Ajax 调用的情况下调用同一个函数，并且一切都在那里完美运行。

如果我可以避免呈现表格中我试图将焦点设置到的单元格，那就太好了，但是我的监听器正在 ajax 调用中更改此单元格。我无能为力，所以对此有任何想法将不胜感激。

-- 对 Balusc 的回应(顺便说一句，听说过你的好事)

嗯，我认为我实际上走在了正确的轨道上，但似乎仍然遇到了麻烦。我正在检查“成功”，但即使成功了，我也无法将焦点放在这里。这是我检查“成功”的 Javascript 函数:这个函数在另一种情况下工作，它没有附加到 Ajax 事件。

function resetFocus(data) {
    var theRow = dojo.byId("resultsForm:selectedRow").value;               
    if (data.status == "success") {
        dojo.query('[widgetId]',dojo.byId('theResultsDataTable'))
            .forEach(function(node) {
                var widget = dijit.byNode(node);
                var theId = widget.attr("id")                                             
                if (theId.indexOf(':' + theRow + ':') != -1) {
                    if (theId.indexOf('theOrppoNum') != -1) {
                        widget.focus();
                        widget.attr("isFocused",true);
                    }
                }
            });
    }
}

Answer 1

附加到 onevent 属性的函数实际上将被调用三次 次。发送 ajax 请求前 1 次，ajax 响应到达后 1 次，成功更新 HTML DOM 后 1 次。您应该为此检查给定数据参数的 status 属性。

function onEventFunction(data) {
    var status = data.status; // Can be "begin", "complete" or "success".

    switch (status) {
        case "begin": // Before the ajax request is sent.
            // ...
            break;

        case "complete": // After the ajax response is arrived.
            // ...
            break;

        case "success": // After update of HTML DOM based on ajax response..
            // ...
            break;
    }
}

在您的特定情况下，您因此只需要添加检查状态是否为 success。

function resetFocus(data) {
    if (data.status == "success") {
        // Do your job here.
    }
}