Question

我有问题使用widgetVar，而其名称是动态生成的。我们如何恰当地调用这样的小部件？组件代码：

<cc:attribute name="id" required="true" type="java.lang.String" />
...
<cc:implementation>
    <p:selectOneRadio widgetVar="widgetVariable#{cc.attrs.id}" id="#{cc.attrs.id}" required="false" immediate="#{cc.attrs.immediate}"
                      value="#{cc.attrs.value}">
        <p:ajax event="click" oncomplete="checkRadio()"/>
        <cc:insertChildren/>
    </p:selectOneRadio>

    <script type="text/javascript">
        /*  <![CDATA[ */

        function checkRadio() {
            var widgetVariable = widgetVariable#{cc.attrs.id}; //HERE PROBLEM
            widgetVariable.dosmth();
        }

        /*    ]]> */
    </script>
</cc:implementation>

那是什么，它的工作原理，但是当我在页面上使用这个组件的许多信息时，有时会发疯并为组件的许多信息制作javascript。

编辑：一切正常。无论如何，我有一个新问题。我在这个.js文件中创建了一些全局状态变量。

var state = -1;

function checkRadio() {
        var widgetVariable = widgetVariable#{cc.attrs.id}; //HERE PROBLEM
        widgetVariable.dosmth(state);
}

但是每个州应该只针对一个复合度，atm每个复合使用这个var，一些想法？

Answer 1

实际上有两个问题。

第一个问题是你在XHTML文件中声明JS函数而不是真正的JS文件。如果你有多个这些组件，那么你基本上是在HTML输出中生成多个JS函数checkRadio()。在浏览器中拉出页面，右键单击查看源。你基本上会看到

<script type="text/javascript">
    function checkRadio() {
        // ...
    }
</script>
<script type="text/javascript">
    function checkRadio() {
        // ...
    }
</script>
<script type="text/javascript">
    function checkRadio() {
        // ...
    }
</script>
...

他们互相压倒直到最后一个。因此，当调用checkRadio()时，实际将调用最后一个。这显然是不对的。

你应该只有一个功能。您可以通过简单地将变量设为函数参数来外化变量。更重要的是，您不应该在XHTML文件中编写JS代码，而应该在<h:outputScript>包含的独立JS文件中编写。额外的奖励，即使你有多个复合组件，它也会自动确保只加载了一个JS文件。

<cc:implementation>
    <h:outputScript name="myComposite.js" />
    ...
    <p:ajax event="click" oncomplete="checkRadio('#{cc.attrs.id}')" />
</cc:implementation>

回到你的具体问题，第二个问题，你可以利用window[variableName]表示法通过动态组合的变量名来获取全局（窗口）变量。因此，checkRadio()中的myComposite.js函数（无论你想要什么名称，但与myComposite.xhtml相同的文件名都是自我记录的）应该如下所示：

function checkRadio(compositeId) {
   var widgetVariableName = "widgetVariable" + compositeId;
   var widgetVariable = window[widgetVariableName];
   widgetVariable.dosmth();
}

复合组件jsf * primefaces

1 个答案: