Question

我们有一个使用JSF 2，OpenFaces，jQuery和Uniform插件的应用程序。有一个表单有一个选择框，其中包含根据另一个选择框的值动态填充的选项。我们使用JSF 2 f：ajax标记来激活选择框的重新填充。

这是触发ajax调用的框：

    <h:selectOneMenu id="applicant-employmentStatus-civilian"
                        value="#{membershipData.civilianEmploymentStatus}">
                        <f:selectItems value="#{lookup.civilianEmploymentOptions }"/>
                        <f:ajax event="change" 
                            render="applicant-eligibility-base applicant-eligibility-ship applicant-eligibility-govtAgency"
                            onevent="ajaxCallback"/>
                        <o:validateCustom clientFunction="return validateEligibilityField(input.id);"
                            summary=""
                            detail="#{msgs['errormesg.eligibility.employment']}" />
                    </h:selectOneMenu>

此次调用将填充其他3个选择框。

该页面还使用Uniform插件来装饰所有表单输入。在document.ready（）函数中，调用以下命令来配置它：

$('select, input:text, input:radio').uniform();

问题在于，当在Ajax调用之后呈现3个选择框时，它们“丢失”装饰并在FF，Chrome等中变得不可用。在IE中，未格式化的选择框放在旧的选择框上。我尝试在ajaxCallback函数中调用uniform（）函数，但它不起作用。

任何帮助表示赞赏

Answer 1

我弄明白了这个问题。

在调用$（'select'）。uniform（）之前，你需要调用$ .uniform.restore（'select'）。统一恢复将删除所有统一格式并将其恢复为“正常”选择控件。

Answer 2

这应该适合你：

<script type="text/javascript">
    function ajaxCallback(e) {
        if(e.status == 'success') {
            $('select, input:text, input:radio').uniform();
        }
    }
</script>

使用jQuery Uniform和JSF2的动态选择菜单选项

2 个答案: