我有一个 JSP 页面,其中我使用 Struts2 标签来制作我的注册表单。
现在第一个字段是使用 s:select
标记的类型。现在,根据用户选择的内容,我想在选择框下方的同一页面上加载下一个文本字段。我该怎么做?这是我的方法,但它不起作用。
<s:form action="clientAction" method="post">
<s:select name="type" label="Registration Type"
list="{'Student','Faculty'}" emptyOption="false" />
<s:if test="type.equals(Student)">
<s:textfield label="FirstName" name="s_fname"/>
<s:textfield label="LastName" name="s_lname"/>
<s:textfield label="UserName" name="s_username"/>
<s:password label="Password" name="s_password"/>
<s:textfield label="EmailId" name="s_email_id"/>
</s:if>
<s:if test="type.equals(Faculty)">
<s:textfield label="FirstName" name="fac_fname"/>
<s:textfield label="LastName" name="fac_lname"/>
<s:textfield label="UserName" name="fac_username"/>
<s:password label="Password" name="fac_password"/>
<s:textfield label="EmailId" name="fac_email"/>
<s:textfield label="Course Name" name="course_name"/>
<s:textfield label="Course Id" name="course_id"/>
</s:if>
<s:submit/>
</s:form>
最佳答案
您可以使用 JQuery 来完成此操作,并且不需要从服务器加载字段,也不需要将 JavaScript 代码与 JSP 代码搞乱。您应该使用 css_xhtml
主题在选择框的更改事件上隐藏/显示字段。就像这个例子一样
<s:form action="clientAction" method="post" theme="css_xhtml">
<s:select id="RegistrationType" name="type" label="Registration Type"
list="{'Student', 'Faculty'}" emptyOption="false" />
<s:div id="Student" cssStyle="display: none;">
<s:textfield label="FirstName" name="s_fname"/>
<s:textfield label="LastName" name="s_lname"/>
<s:textfield label="UserName" name="s_username"/>
<s:password label="Password" name="s_password"/>
<s:textfield label="EmailId" name="s_email_id"/>
<s:submit/>
</s:div>
<s:div id="Faculty" cssStyle="display: none;" >
<s:textfield label="FirstName" name="fac_fname"/>
<s:textfield label="LastName" name="fac_lname"/>
<s:textfield label="UserName" name="fac_username"/>
<s:password label="Password" name="fac_password"/>
<s:textfield label="EmailId" name="fac_email"/>
<s:textfield label="Course Name" name="course_name"/>
<s:textfield label="Course Id" name="course_id"/>
<s:submit/>
</s:div>
</s:form>
<script type="text/javascript">
$(document).ready(function(){
$('#RegistrationType').change(function(){
$('#'+this.value).css('display', 'block');
if (this.value=='Student') $('#Faculty').css('display', 'none');
else $('#Student').css('display', 'none');
});
});
</script>
关于java - 加载与选择框内容相关的字段,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17916235/