1

スクロール可能なヘッド行を除く、テーブル内のテーブル行が必要な要件があります。私は次のように試しましたが、これは望ましい結果をもたらしません: 

 <table id="applicantList1" border="1" align="left">
<tr><td align="center" colspan="4"><b>Select one record from the below list for proceeding further </b></td></tr>
<tr><th>View</th><th>Name</th><th>Address</th><th>Pan No</th></tr>
  <c:forEach items="${applicantList}" var = "applicantList">  
    <div id="applicantList2" align="center" style="height:1px;width: 10px">
    <tr>
        <td>${applicantList[0]}</td>
        <td>${applicantList[1]}</td>
        <td>${applicantList[2]},${applicantList[3]},${applicantList[4]},${applicantList[5]},${applicantList[6]},${applicantList[7]}</td>
        <td>${applicantList[8]}</td>
      </tr> 
    </div>                
  </c:forEach> 
</table>

アイデアがあれば、私と共有してください。

4

4 に答える 4

0

あなたがそれを使用している方法ではありません。div 内に tr を強制する代わりに、リストを使用します。

于 2013-05-20T04:59:27.877 に答える
0

css を使用してこれを解決できます。

<div>テーブルの位置を相対に設定して、テーブルを の中に配置できます。セット内で<div>、位置属性を継承するテーブルを設定します。position: absoluteテーブル内の をおよびに設定し、テーブル内top: 0の残りの要素の位置を に設定する必要がありますinherit。

于 2013-05-20T05:00:35.303 に答える
0

ヘッダーのスクロールを避けるために、2 つの整列したテーブルで構成される構造を作成しようとします。1 つはヘッダー用、もう 1 つは本文用のテーブルです。そうすれば、2 番目のテーブルのみがスクロールされるようにすることができます。

サードパーティのソリューションを受け入れる場合は、Telerik グリッドもお勧めします。これらはすべてこの動作をサポートしているためです。

于 2013-05-20T04:57:39.457 に答える
0

JavaScript は使用できますか？jQuery? どのブラウザをサポートする必要がありますか?

CSS のみのソリューションは不可能です。聖杯へようこそ: <table><tbody> scrollable?

これを CSS のみのソリューションとして試すことはできますが、スクロールは IE では機能しません。theadテーブルのマークアップにとtbodyタグ を追加する必要があります: http://tjvantoll.com/2012/11/10/creating-cross-browser-scrollable-tbody/

したがって、100% のカバレッジを得るための唯一の解決策は、JavaScript を使用することです。上記とプラグインを組み合わせて使用​​するため、JS がオフの場合は適切に機能が低下します。DataTables は、私が以前に使用した jQuery プラグインです。純粋な JavasScript プラグインが必要な場合は、Google で検索できると確信しています...

于 2013-05-20T05:20:49.537 に答える