C# と VB.NET の質問掲示板

ASP.NET、C++/CLI、Java 何でもどうぞ

C# と VB.NET の入門サイト

動的に画面作成時のテーブルの結合

[トピック内 6 記事 (1 - 6 表示)]  << 0 >>

■83415 / inTopicNo.1)  動的に画面作成時のテーブルの結合
  
□投稿者/ 貴将 (1回)-(2017/03/22(Wed) 11:36:50)

分類:[ASP.NET (C#)] 

宜しくお願いします。

開発環境 windoes8.1
使用言語 asp.Net2015 の C#で開発しています。


昔、VBでaspの開発はあるのですが、

早速ですみませんが
テーブルの結合について教えてください。

//画面 aa.aspx
<asp:Table ID="Table4"  runat ="server"></asp:Table>


//ソース aa.aspx.cs
    TableRow tableRow;
    TableCell tableCell;

    tableRow = new TableRow();
//テーブルヘッダー
    tbleCell = new TableCell();
    tableCell.Text = "名前" ;
    tableRow.Cells.Add(tableCell);

    tableCell = new TableCell();
    tableCell.Text = "";
    tableRow.Cells.Add(tableCell);

    tableCell = new TableCell();
    tableCell.Text = "性別";
    tableRow.Cells.Add(tableCell);


    tableCell = new TableCell();
    tableCell.Text = "郵便番号";
    tableRow.Cells.Add(tableCell);

    tableCell = new TableCell();
    tableCell.Text ="";
    tableRow.Cells.Add(tableCell);

    Table4.Rows.Add(tableRow);
//テーブル明細
    tableCell = new TableCell();
    tableCell.Text = "山田" ;
    tableRow.Cells.Add(tableCell);

    tableCell = new TableCell();
    tableCell.Text = "太郎" ;
    tableRow.Cells.Add(tableCell);

・・・・省略
実行すると
--------------------------------
|名前 |    | 性別 |郵便番号|   |
-------------------------------
|山田 |太郎|  男  | 999 |99999 |
-------------------------------

表示したいのは
--------------------------------
|名前      | 性別 |郵便番号    |
-------------------------------
|山田 |太郎|  男  | 999 |99999 |
-------------------------------
としたいのですが

どのように結合すればいいのか

すみませんが宜しくお願い致します。





引用返信 編集キー/
■83416 / inTopicNo.2)  Re[1]: 動的に画面作成時のテーブルの結合
□投稿者/ WebSurfer (1176回)-(2017/03/22(Wed) 11:53:29)
No83415 (貴将 さん) に返信

> 実行すると
> --------------------------------
> |名前 | | 性別 |郵便番号| |
> -------------------------------
> |山田 |太郎| 男 | 999 |99999 |
> -------------------------------
>
> 表示したいのは
> --------------------------------
> |名前 | 性別 |郵便番号 |
> -------------------------------
> |山田 |太郎| 男 | 999 |99999 |
> -------------------------------
> としたいのですが
>
> どのように結合すればいいのか

TableCell.ColumnSpan プロパティを使って調整できませんか?

あと、本題と関係ない話ですが、ヘッダには TableHeaderCell を使った方がいいかもしれません。

具体的な方法が分からなかったら聞いてください。

引用返信 編集キー/
■83419 / inTopicNo.3)  Re[1]: 動的に画面作成時のテーブルの結合
□投稿者/ WebSurfer (1177回)-(2017/03/22(Wed) 14:04:21)
No83415 (貴将 さん) に返信

サンプルコードを貼っておきます。

<%@ Page Language="C#" %>

<!DOCTYPE html>

<script runat="server">

    protected void Page_Load(object sender, EventArgs e)
    {
        TableRow row = new TableRow();
        TableHeaderCell headerCell = new TableHeaderCell();
        headerCell.Text = "名前";
        headerCell.ColumnSpan = 2;
        row.Cells.Add(headerCell);

        headerCell = new TableHeaderCell();
        headerCell.Text = "性別";
        row.Cells.Add(headerCell);

        headerCell = new TableHeaderCell();
        headerCell.Text = "郵便番号";
        headerCell.ColumnSpan = 2;
        row.Cells.Add(headerCell);

        Table1.Rows.Add(row);

        row = new TableRow();
        TableCell cell = new TableCell();
        cell.Text = "山田";
        row.Cells.Add(cell);
        
        cell = new TableCell();
        cell.Text = "太郎";
        row.Cells.Add(cell);
        
        cell = new TableCell();
        cell.Text = "男";
        row.Cells.Add(cell);
        
        cell = new TableCell();
        cell.Text = "999";
        row.Cells.Add(cell);

        cell = new TableCell();
        cell.Text = "9999";
        row.Cells.Add(cell);

        Table1.Rows.Add(row);
    }
</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <asp:Table ID="Table1" runat="server" GridLines="Both"></asp:Table>
    </form>
</body>
</html>


上記の aspx ページから出力される html ソースは以下の通りとなります。

<table id="Table1" rules="all" border="1">
  <tr>
    <th colspan="2">名前</th><th>性別</th><th colspan="2">郵便番号</th>
  </tr><tr>
    <td>山田</td><td>太郎</td><td>男</td><td>999</td><td>9999</td>
  </tr>
</table>

引用返信 編集キー/
■83422 / inTopicNo.4)  Re[2]: 動的に画面作成時のテーブルの結合
□投稿者/ 貴将 (2回)-(2017/03/22(Wed) 17:15:17)

No83419 (WebSurfer さん) に返信

返事が遅れましてすみません。

予定通りの画面ができました
ありがとうございました。

おこがましいのですか
CSSを追加したのですが、ききません。


//画面 aa.aspx
table.m777a {
border-collapse: collapse;
border: 2px #cc0000 solid;
font-size: 11px;
font-family: Verdana,sans-serif;
line-height: 1.2;
}
table.m777a th {
border-bottom: 3px double #cc0000;
background-color: #ffdddd;
letter-spacing: 0.15em;
}

table.m777a th,
table.m777a td {
padding: 0.3em;
border-style: solid dashed;
border-color: #cc0000;
border-width: 1px;
}

<asp:Table ID="Table4" class="m777a" runat ="server"></asp:Table>

宜しくお願い致します。

引用返信 編集キー/
■83424 / inTopicNo.5)  Re[3]: 動的に画面作成時のテーブルの結合
□投稿者/ WebSurfer (1178回)-(2017/03/22(Wed) 17:44:54)
No83422 (貴将 さん) に返信

> CSSを追加したのですが、ききません。

> <asp:Table ID="Table4" class="m777a" runat ="server"></asp:Table>

Table は html 要素ではなくサーバーコントロールなので CssClass="m777a" のように設定します。
引用返信 編集キー/
■83430 / inTopicNo.6)  Re[4]: 動的に画面作成時のテーブルの結合
□投稿者/ 貴将 (3回)-(2017/03/23(Thu) 09:50:05)
No83424 (WebSurfer さん) に返信
> ■No83422 (貴将 さん) に返信
>
>>CSSを追加したのですが、ききません。
>
>><asp:Table ID="Table4" class="m777a" runat ="server"></asp:Table>
>
> Table は html 要素ではなくサーバーコントロールなので CssClass="m777a" のように設定します。

返事が遅れまして、すみませんでした。

本当に、ありがとうございました。




解決済み
引用返信 編集キー/

このトピックをツリーで一括表示


トピック内ページ移動 / << 0 >>

このトピックに書きこむ