入力フィールドを持つフォームが 1 つあります。最初の部分の後、2 つのボタン (外部、内部) があり、外部は別の場所にリダイレクトします。
お気に入り
<form action="servlet_link" method="post">
<table class="ui-widget">
<colgroup width="350" span="2"></colgroup>
<tbody>
<tr>
<td>
<p class="form">
Familyname
</p><td>
<input class="ui-widget-content ui-state-default ui-corner-all" name="familyname" type="text"">
</td>
</tr>
<tr>
<td>
<p class="form">
Givenname
</p></td>
<td>
<input class="ui-widget-content ui-state-default ui-corner-all" name="ustid" type="text">
</td>
</tr>
</tbody>
</table>
<div class="center">
<!-- Buttons -->
<table align="center">
<tr>
<td>
<!-- sends data post and redirects u -->
<a href="javascript:document.forms[0].submit()" class="btn" name="extern">External</a>
</td>
<td>
<!-- shows more input fields and sets both buttons invisible -->
<a href="???" class="btn" name="intern" >Internal</a>
</td>
</tr>
</table>
</div>
<!-- part 2 should be shown -->
<table class="ui-widget">
<colgroup width="350" span="2"></colgroup>
<tbody>
<tr>
<td>
<p class="form">
Companyname
</p><td>
<input class="ui-widget-content ui-state-default ui-corner-all" name="companyname" type="text"">
</td>
</tr>
<tr>
<td>
<p class="form">
address
</p></td>
<td>
<input class="ui-widget-content ui-state-default ui-corner-all" name="address" type="text">
</td>
</tr>
</tbody>
</table>
<div class="center">
<!-- Buttons -->
<table align="center">
<tr>
<td>
<!-- sends data post and redirects u -->
<a href="javascript:document.forms[0].submit()" class="btn" name="extern">External</a>
</td>
</tr>
</table>
</div>
</form>
すべての要素に id タグを付けて、非表示に設定する必要がありますか:
JS:
function invisbleForm() {
document.getElementById("companynameText").style.display ="block";
}
それを行うためのより良い解決策はありますか? 任意の助けのためのthx :)
更新 1
表示と非表示を設定しても問題ありません。ページに大きな白いブロックがあり、動的にサイズを変更するにはどうすればよいですか?