1

拡張ライブラリ Form Table コントロールを使用してフォームを作成しています。最近、この投稿の助けを借りて、hide-when のような関数を作成することができました: コンボボックスで選択された値に基づいて dojo onchange を起動する

ただし、このコードはフォーム テーブル要素内では機能しないことがわかりました。テーブル全体に表示/非表示の div を配置でき、それが機能します。それを見つけて、複数のフォームテーブルを作成し、必要に応じて表示または非表示にできると思ったのですが、フォームテーブル間にレンダリングされるスペースが多く、それを取り除く方法がわからないため、見た目が悪くなります。

フォーム テーブル間のスペースを削除する方法、またはフォーム テーブル コントロール内で「表示/非表示」を実行する別の方法についてのヒントはありますか?

ご協力ありがとうございます。

ネイト

4

2 に答える 2

4

表のセルの内容を非表示にしても役に立ちません。すべてのセルの内容が非表示になっていても、表の行は引き続き表示されます。これは、ノーツ クライアント テーブルとは異なります。ブラウザでは、表の行全体を非表示にする必要があります<tr>... </tr>.

サーバー側のテーブル行の表示/非表示

<tr>非表示コードをタグに入れることができます:

<xp:table>
    <xp:tr rendered="#{....}">

コードが を返すと、テーブルの行全体が非表示になりますfalse。

クライアント側テーブル行の表示/非表示

クライアント側の表示/非表示の場合、<tr>タグに ID を指定します。

<xp:table>
    <xp:tr id="row1">

次に、IDでテーブル行をアドレス指定し、行を非表示にすることができます。

dojo.style(dojo.byId("#{id:row1}"), "display", "none")

でもう一度表示します

dojo.style(dojo.byId("#{id:row1}"), "display", "")

拡張ライブラリ フォーム テーブル コントロールのクライアント側テーブル行の表示/非表示

xe:formRow残念ながら、 の id はレンダリング中に失われるため使用できません。つまり、ID はクライアント側の設定では使用できません。

ただし、 を指定できますstyleClass。

<xe:formTable
    id="formTable1">
    <xe:formRow
        id="formRow1"
        styleClass="classRow1">

このクラス名はレンダリングを「存続」し、それを使用してこのクラスを持つすべての ID を取得し、テーブル行を非表示にすることができます

dojo.query(".classRow1").forEach(function(node, index, nodelist){
    dojo.style(node, "display", "none")
});

そしてもう一度見せる

dojo.query(".classRow1").forEach(function(node, index, nodelist){
    dojo.style(node, "display", "")
});
于 2013-10-07T21:01:46.963 に答える