根据下拉选择动态生成文本字段和相应的标签
[英]dynamic generation of text field and the corresponding label based on the drop down selection
问题描述
If the user selects drop down,flight no, only one text field and the corresponding label should come in. If the user selects drop down, all, many text fields should be generated such as for getting the input for flight no, source from, destination and so on. 
如果用户选择下拉菜单，航班号，则只能输入一个文本字段和相应的标签。如果用户选择下拉菜单，则应生成所有很多文本字段，例如用于获取航班号，来源，目的地等等。 "I want it to be done using JavaScript", “我希望使用JavaScript完成”，
The following code works as per my requirement but how to prevent the select from moving away from the normal table alignment,
"Once, on change event is invoked,drop-down selection is made,the required fields are generated as per the selection is made but the select,drop-down moves away from the normal alignment in the resultant. "how to prevent this from happening and why does this happens???" “一旦更改事件被调用，就进行下拉选择，根据选择进行生成必填字段，但是选择，下拉菜单会偏离结果中的常规对齐方式。”如何防止这种情况发生发生了，为什么会发生？？？”
<html>
<head>
<title>hide/show</title>
<script type="text/javascript">
function display(obj,id1,id2)
{
txt=obj.options[obj.selectedIndex].value;
document.getElementById(id1).style.display='none';
document.getElementById(id2).style.display='none';
if(txt.match(id1))
{
document.getElementById(id1).style.display='block';
}
if(txt.match(id2))
{
document.getElementById(id2).style.display='block';
}
}
</script>
</head>
<body>
<table cellspacing="0" cellpadding="2">
<thead>
<tr>
<td class="title">Type:</td>
<td class="field">
<select name="type" onchange="display(this,'text','image');">
<option>Please select option</option>
<option value="image">image</option>
<option value="text">texts</option>
<option value="invisible">invisible</option>
</select>
</td>
</tr>
</thead>
<tfoot>
<tr>
<td class="align-center" colspan="2">
<input type="submit" name="submit" value="update"/>
<input type="reset" value="reset"/>
</td>
</tr>
</tfoot>
<tbody id="text" style="display: none;">
<tr>
<td class="title" rowspan="3">Text Color:</td>
<td class="field">
<input type="text" name="color" size="8" maxlength="7"/>
</td>
</tr>
</tbody>
<tbody id="image" style="display: none;">
<tr>
<td class="title">Image:</td>
<td class="field">
<input type="text" name="image" size="15"/>
</td>
</tr>
<tr>
<td class="title">X Coordinates:</td>
<td class="field">
<input type="text" name="x_coordinate" size="15"/>
</td>
</tr>
<tr>
<td class="title">Y Coordinates:</td>
<td class="field">
<input type="text" name="y_coordinate" size="5"/>
</td>
</tr>
<tr>
<td class="title">Text Color:</td>
<td class="field">
<input type="text" name="color" size="8" maxlength="7"/>
</td>
</tr>
</tbody>
<tbody>
<tr>
<td class="title">Display:</td>
<td class="field">
<select name="diplay">
<option value="visitors">Visitors</option>
<option value="hits">Hits</option>
</select>
</td>
</tr>
</tbody>
</table>
</body>
1 个解决方案
解决方案1
0 2015-10-01 02:35:37
You can use variable_name.setVisible(boolean_value) property to hide or unhide the elements depending upon the criteria. 您可以根据条件使用variable_name.setVisible(boolean_value)属性隐藏或取消隐藏元素。 If you want to hide a search button, you can use JsearchButton.setVisible(false); 如果要隐藏搜索按钮，则可以使用JsearchButton.setVisible(false); Here JsearchButton is the variable name of the search button. 这里的JsearchButton是搜索按钮的变量名。 Please see the example i wrote for your requirements. 请参阅我为您的要求编写的示例。 I hope this is useful. 我希望这是有用的。
This constructor initially makes all the elements invisible as soon as the application starts. 该构造函数最初使应用程序启动后所有元素都不可见。
public class AirportForm extends javax.swing.JFrame {
/**
* Creates new form AirportForm
*/
public AirportForm() {
initComponents();
FlightNo.setVisible(false);
EnterFlightNoTextBox.setVisible(false);
From.setVisible(false);
To.setVisible(false);
SelectFromStationDropDown.setVisible(false);
SelectToStationDropDown.setVisible(false);
}
This is the code for your drop down user selection. 这是用于下拉用户选择的代码。 Depending upon the user selection, the elements will be displayed. 根据用户选择，将显示元素。
private void SelectSearchCriteriaActionPerformed(java.awt.event.ActionEvent evt) {
// TODO add your handling code here:
String search1="Flight No";
String search2="All";
String search3="Select An Item";
if(SelectSearchCriteria.getSelectedItem().toString()==search1){
FlightNo.setVisible(true);
EnterFlightNoTextBox.setVisible(true);
From.setVisible(false);
To.setVisible(false);
SelectFromStationDropDown.setVisible(false);
SelectToStationDropDown.setVisible(false);
}
else if(SelectSearchCriteria.getSelectedItem().toString()==search2){
FlightNo.setVisible(true);
EnterFlightNoTextBox.setVisible(true);
From.setVisible(true);
To.setVisible(true);
SelectFromStationDropDown.setVisible(true);
SelectToStationDropDown.setVisible(true);
}
}
This is for declaring elements 这是为了声明元素
// Variables declaration - do not modify
private javax.swing.JTextField EnterFlightNoTextBox;
private javax.swing.JButton FinalSearchButton;
private javax.swing.JLabel FlightNo;
private javax.swing.JLabel From;
private javax.swing.JComboBox SelectFromStationDropDown;
private javax.swing.JComboBox SelectSearchCriteria;
private javax.swing.JLabel SelectSearchType;
private javax.swing.JComboBox SelectToStationDropDown;
private javax.swing.JLabel To;
// End of variables declaration
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.