Fatal编程技术网
  • java/
  • Java JSF呈现不起作用

Java JSF呈现不起作用

java ajax jsf jakarta-ee

Java JSF呈现不起作用,java,ajax,jsf,jakarta-ee,Java,Ajax,Jsf,Jakarta Ee,我的网页上有这样一个选择/下拉菜单。此下拉菜单应根据所选项目生成另一个下拉菜单。我这样做是通过调用 <h:selectOneMenu value="#{teacher.viewCategory}"> <f:selectItem itemValue="0" itemLabel="Tahun" /> <f:sel

我的网页上有这样一个选择/下拉菜单。此下拉菜单应根据所选项目生成另一个下拉菜单。我这样做是通过调用

                        <h:selectOneMenu value="#{teacher.viewCategory}">
                            <f:selectItem itemValue="0" itemLabel="Tahun" />
                            <f:selectItem itemValue="1" itemLabel="Mata Pelajaran" />
                            <f:ajax event="change" render="divYearSelection divCourseSelection"
                                    listener="#{teacher.enableViewCategory}"/>
                        </h:selectOneMenu>

                        <h:panelGroup id="divYearSelection" layout="block" rendered="#{teacher.showViewYearSelection}">
                            <h:outputText value="YEAR"/>
                        </h:panelGroup>

                        <h:panelGroup id="divCourseSelection" layout="block" rendered="#{teacher.showViewCourseSelection}">
                            <h:outputText value="COURSE"/>
                        </h:panelGroup>


                        <h:commandButton value="#{msg.tcr_form_submit_view}" action="#{teacher.viewTeacher}"/>
                    </h:panelGrid>
                </h:form>'
但这并没有像我预期的那样发生。在下拉菜单中选择项触发ajax标记中的侦听器时，以下下拉表的
rendered
属性似乎不受更改的影响。渲染的
的值成功地从false更改为true。这让我想知道我的jsf页面出了什么问题


                        <h:selectOneMenu value="#{teacher.viewCategory}">
                            <f:selectItem itemValue="0" itemLabel="Tahun" />
                            <f:selectItem itemValue="1" itemLabel="Mata Pelajaran" />
                            <f:ajax event="change" render="divYearSelection divCourseSelection"
                                    listener="#{teacher.enableViewCategory}"/>
                        </h:selectOneMenu>

                        <h:panelGroup id="divYearSelection" layout="block" rendered="#{teacher.showViewYearSelection}">
                            <h:outputText value="YEAR"/>
                        </h:panelGroup>

                        <h:panelGroup id="divCourseSelection" layout="block" rendered="#{teacher.showViewCourseSelection}">
                            <h:outputText value="COURSE"/>
                        </h:panelGroup>


                        <h:commandButton value="#{msg.tcr_form_submit_view}" action="#{teacher.viewTeacher}"/>
                    </h:panelGrid>
                </h:form>' 


这是xhtml
'



                        <h:selectOneMenu value="#{teacher.viewCategory}">
                            <f:selectItem itemValue="0" itemLabel="Tahun" />
                            <f:selectItem itemValue="1" itemLabel="Mata Pelajaran" />
                            <f:ajax event="change" render="divYearSelection divCourseSelection"
                                    listener="#{teacher.enableViewCategory}"/>
                        </h:selectOneMenu>

                        <h:panelGroup id="divYearSelection" layout="block" rendered="#{teacher.showViewYearSelection}">
                            <h:outputText value="YEAR"/>
                        </h:panelGroup>

                        <h:panelGroup id="divCourseSelection" layout="block" rendered="#{teacher.showViewCourseSelection}">
                            <h:outputText value="COURSE"/>
                        </h:panelGroup>


                        <h:commandButton value="#{msg.tcr_form_submit_view}" action="#{teacher.viewTeacher}"/>
                    </h:panelGrid>
                </h:form>' 



当我调试时，该函数运行良好。
如果部分呈现不起作用，一个好的起点是在浏览器中呈现页面时查看页面的html源代码。您的
render=“divYearSelection”
只有在两者（ajax触发组件和目标组件）具有相同的直接父容器时才起作用


                        <h:selectOneMenu value="#{teacher.viewCategory}">
                            <f:selectItem itemValue="0" itemLabel="Tahun" />
                            <f:selectItem itemValue="1" itemLabel="Mata Pelajaran" />
                            <f:ajax event="change" render="divYearSelection divCourseSelection"
                                    listener="#{teacher.enableViewCategory}"/>
                        </h:selectOneMenu>

                        <h:panelGroup id="divYearSelection" layout="block" rendered="#{teacher.showViewYearSelection}">
                            <h:outputText value="YEAR"/>
                        </h:panelGroup>

                        <h:panelGroup id="divCourseSelection" layout="block" rendered="#{teacher.showViewCourseSelection}">
                            <h:outputText value="COURSE"/>
                        </h:panelGroup>


                        <h:commandButton value="#{msg.tcr_form_submit_view}" action="#{teacher.viewTeacher}"/>
                    </h:panelGrid>
                </h:form>' 


呈现的html组件的id通常看起来像
id=“formId:componentId:nestedComponentId1”
或
id=“formId:componentId:nestedComponentId2”


                        <h:selectOneMenu value="#{teacher.viewCategory}">
                            <f:selectItem itemValue="0" itemLabel="Tahun" />
                            <f:selectItem itemValue="1" itemLabel="Mata Pelajaran" />
                            <f:ajax event="change" render="divYearSelection divCourseSelection"
                                    listener="#{teacher.enableViewCategory}"/>
                        </h:selectOneMenu>

                        <h:panelGroup id="divYearSelection" layout="block" rendered="#{teacher.showViewYearSelection}">
                            <h:outputText value="YEAR"/>
                        </h:panelGroup>

                        <h:panelGroup id="divCourseSelection" layout="block" rendered="#{teacher.showViewCourseSelection}">
                            <h:outputText value="COURSE"/>
                        </h:panelGroup>


                        <h:commandButton value="#{msg.tcr_form_submit_view}" action="#{teacher.viewTeacher}"/>
                    </h:panelGrid>
                </h:form>' 


因此，从component1调用的
render=“nestedComponentD2”
只有在两个ID具有相同的“尾部”时才能工作


                        <h:selectOneMenu value="#{teacher.viewCategory}">
                            <f:selectItem itemValue="0" itemLabel="Tahun" />
                            <f:selectItem itemValue="1" itemLabel="Mata Pelajaran" />
                            <f:ajax event="change" render="divYearSelection divCourseSelection"
                                    listener="#{teacher.enableViewCategory}"/>
                        </h:selectOneMenu>

                        <h:panelGroup id="divYearSelection" layout="block" rendered="#{teacher.showViewYearSelection}">
                            <h:outputText value="YEAR"/>
                        </h:panelGroup>

                        <h:panelGroup id="divCourseSelection" layout="block" rendered="#{teacher.showViewCourseSelection}">
                            <h:outputText value="COURSE"/>
                        </h:panelGroup>


                        <h:commandButton value="#{msg.tcr_form_submit_view}" action="#{teacher.viewTeacher}"/>
                    </h:panelGrid>
                </h:form>' 



您可以尝试使用示例中给出的完整id，从表单id开始，或者（如果整个表单不太大）使用更新整个表单的
render=“@form”
。
如果部分呈现不起作用，一个好的起点是在浏览器中呈现页面时查看页面的html源代码。您的
render=“divYearSelection”
只有在两者（ajax触发组件和目标组件）具有相同的直接父容器时才起作用


                        <h:selectOneMenu value="#{teacher.viewCategory}">
                            <f:selectItem itemValue="0" itemLabel="Tahun" />
                            <f:selectItem itemValue="1" itemLabel="Mata Pelajaran" />
                            <f:ajax event="change" render="divYearSelection divCourseSelection"
                                    listener="#{teacher.enableViewCategory}"/>
                        </h:selectOneMenu>

                        <h:panelGroup id="divYearSelection" layout="block" rendered="#{teacher.showViewYearSelection}">
                            <h:outputText value="YEAR"/>
                        </h:panelGroup>

                        <h:panelGroup id="divCourseSelection" layout="block" rendered="#{teacher.showViewCourseSelection}">
                            <h:outputText value="COURSE"/>
                        </h:panelGroup>


                        <h:commandButton value="#{msg.tcr_form_submit_view}" action="#{teacher.viewTeacher}"/>
                    </h:panelGrid>
                </h:form>' 


呈现的html组件的id通常看起来像
id=“formId:componentId:nestedComponentId1”
或
id=“formId:componentId:nestedComponentId2”


                        <h:selectOneMenu value="#{teacher.viewCategory}">
                            <f:selectItem itemValue="0" itemLabel="Tahun" />
                            <f:selectItem itemValue="1" itemLabel="Mata Pelajaran" />
                            <f:ajax event="change" render="divYearSelection divCourseSelection"
                                    listener="#{teacher.enableViewCategory}"/>
                        </h:selectOneMenu>

                        <h:panelGroup id="divYearSelection" layout="block" rendered="#{teacher.showViewYearSelection}">
                            <h:outputText value="YEAR"/>
                        </h:panelGroup>

                        <h:panelGroup id="divCourseSelection" layout="block" rendered="#{teacher.showViewCourseSelection}">
                            <h:outputText value="COURSE"/>
                        </h:panelGroup>


                        <h:commandButton value="#{msg.tcr_form_submit_view}" action="#{teacher.viewTeacher}"/>
                    </h:panelGrid>
                </h:form>' 


因此，从component1调用的
render=“nestedComponentD2”
只有在两个ID具有相同的“尾部”时才能工作


                        <h:selectOneMenu value="#{teacher.viewCategory}">
                            <f:selectItem itemValue="0" itemLabel="Tahun" />
                            <f:selectItem itemValue="1" itemLabel="Mata Pelajaran" />
                            <f:ajax event="change" render="divYearSelection divCourseSelection"
                                    listener="#{teacher.enableViewCategory}"/>
                        </h:selectOneMenu>

                        <h:panelGroup id="divYearSelection" layout="block" rendered="#{teacher.showViewYearSelection}">
                            <h:outputText value="YEAR"/>
                        </h:panelGroup>

                        <h:panelGroup id="divCourseSelection" layout="block" rendered="#{teacher.showViewCourseSelection}">
                            <h:outputText value="COURSE"/>
                        </h:panelGroup>


                        <h:commandButton value="#{msg.tcr_form_submit_view}" action="#{teacher.viewTeacher}"/>
                    </h:panelGrid>
                </h:form>' 



您可以尝试使用示例中给出的完整id，从表单的id开始，或者（如果整个表单不太大）使用更新整个表单的
render=“@form”
。
如果在ajax命令中使用
render=“@form”
，是否有效？这就成功了！你介意在ajax标签上给我解释一下吗？另外，把它作为一个答案，这样我就可以给你打分了。谢谢@马特，你能不能把这个作为答案贴出来，这样我就可以给它打分了！很高兴听到这个消息！如果在ajax命令中使用
render=“@form”
，它能工作吗？这就成功了！你介意在ajax标签上给我解释一下吗？另外，把它作为一个答案，这样我就可以给你打分了。谢谢@马特，你能不能把这个作为答案贴出来，这样我就可以给它打分了！很高兴听到这个消息！我只是有同样的问题
render=“message”
或
render=“：message”
正在工作。我做了
render=“form:message”
，它正在工作！请你解释一下原因好吗？我也有同样的问题
render=“message”
或
render=“：message”
正在工作。我做了
render=“form:message”
，它正在工作！请你解释一下原因好吗？

                        <h:selectOneMenu value="#{teacher.viewCategory}">
                            <f:selectItem itemValue="0" itemLabel="Tahun" />
                            <f:selectItem itemValue="1" itemLabel="Mata Pelajaran" />
                            <f:ajax event="change" render="divYearSelection divCourseSelection"
                                    listener="#{teacher.enableViewCategory}"/>
                        </h:selectOneMenu>

                        <h:panelGroup id="divYearSelection" layout="block" rendered="#{teacher.showViewYearSelection}">
                            <h:outputText value="YEAR"/>
                        </h:panelGroup>

                        <h:panelGroup id="divCourseSelection" layout="block" rendered="#{teacher.showViewCourseSelection}">
                            <h:outputText value="COURSE"/>
                        </h:panelGroup>


                        <h:commandButton value="#{msg.tcr_form_submit_view}" action="#{teacher.viewTeacher}"/>
                    </h:panelGrid>
                </h:form>'