デモアプリケーショントップ
ナビゲーション リンクのスキップ
 新機能 の展開 新機能
 InputMan連携 の展開 InputMan連携
 マルチタッチ機能 の展開 マルチタッチ機能
 セル、行、列、ヘッダ の展開 セル、行、列、ヘッダ
 シート の展開 シート
 スタイル の展開 スタイル
 選択 の展開 選択
 セル型 の展開 セル型
 編集 の縮小 編集
 ソート の展開 ソート
 フィルタリング の展開 フィルタリング
 グループ化 の展開 グループ化
 ページング の展開 ページング
 スクロール の展開 スクロール
 データ連結 の展開 データ連結
 階層表示 の展開 階層表示
 コマンドバー の展開 コマンドバー
 チャート の展開 チャート
 数式 の展開 数式
 インポート／エクスポート の展開 インポート／エクスポート
 クライアント側スクリプト の展開 クライアント側スクリプト

行編集テンプレート

指定のテンプレートを使用して、行全体の内容を編集することができます。 操作モード（OperationMode）を行モード（RowMode）に設定した場合に有効です。

このサンプルではセルをダブルクリックすることで、指定したテンプレートにて 行の編集が行えます。
 製品ID製品分類製品名第1Q第2Q第3Q第4Q
110001乳製品酪農ミルク5,5005,0004,5006,000
220001清涼飲料水いよかんドリンク1,0003,0002,7002,700
320002清涼飲料水ぶどうジュース3,0003,5004,8004,800
420003清涼飲料水マンゴードリンク2,0001,0005001,050
530001ビール激辛ビール5,5008,0008,50010,000
630002ビールモルトビール3,0003,5002,7804,000
720004清涼飲料水ぶどうの街500300200700
830003ビールオリエントの村8,0009,5009,5809,000
940002焼酎吟醸 ほめごろし6,0007,0009,0009,500
1040003焼酎大吟醸 オリエント1,0005,0006,0005,000
   

ソースコード

別ウィンドウで表示 
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class edit_rowedittemplate : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if (IsPostBack)
        {
            return;
        }

        // SPREADの設定
        InitSpread(FpSpread1);

        // シート設定
        InitSpreadStyles(FpSpread1.Sheets[0]);
    }

    private void InitSpread(FarPoint.Web.Spread.FpSpread spread)
    {
        spread.CssClass = "spreadStyle";
        spread.UseClipboard = false;

        // データ連結
        System.Data.DataSet ds = new System.Data.DataSet();
        ds.ReadXml(MapPath("../App_Data/datanum2.xml"));
        spread.DataSource = ds;
    }

    private void InitSpreadStyles(FarPoint.Web.Spread.SheetView sheet)
    {
        // フォントサイズの設定
        sheet.DefaultStyle.Font.Size = FontUnit.Parse("80%");
        sheet.ColumnHeader.DefaultStyle.Font.Size = FontUnit.Parse("80%");
        sheet.RowHeader.DefaultStyle.Font.Size = FontUnit.Parse("80%");
        sheet.SheetCorner.DefaultStyle.Font.Size = FontUnit.Parse("80%");

        // 列幅の設定
        sheet.Columns[0].Width = 50;
        sheet.Columns[1].Width = 100;
        sheet.Columns[2].Width = 141;
        sheet.Columns[3].Width = 80;
        sheet.Columns[4].Width = 80;
        sheet.Columns[5].Width = 80;
        sheet.Columns[6].Width = 80;

        // セル型の設定
        sheet.Columns[1].CellType = new FarPoint.Web.Spread.LabelCellType();
        sheet.Columns[2].CellType = new FarPoint.Web.Spread.LabelCellType();

        //整数型セルの設定
        FarPoint.Web.Spread.IntegerCellType ic = new FarPoint.Web.Spread.IntegerCellType();
        System.Globalization.NumberFormatInfo ninfo = 
            (System.Globalization.NumberFormatInfo)System.Globalization.CultureInfo.CurrentCulture.NumberFormat.Clone();
        ninfo.NumberGroupSizes = new Int32[] { 3 };
        ic.NumberFormat = ninfo;

        sheet.Columns[3].CellType = ic;
        sheet.Columns[4].CellType = ic;
        sheet.Columns[5].CellType = ic;
        sheet.Columns[6].CellType = ic;

        // 縦方向の揃え位置を中央に設定
        sheet.DefaultStyle.VerticalAlign = VerticalAlign.Middle;

        sheet.OperationMode = FarPoint.Web.Spread.OperationMode.RowMode;
        sheet.EnableRowEditTemplate = true;
    }
}

Imports System.Globalization
Partial Class edit_rowedittemplate
    Inherits System.Web.UI.Page

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        If IsPostBack Then
            Return
        End If

        ' SPREADの設定
        InitSpread(FpSpread1)

        ' シート設定
        InitSpreadStyles(FpSpread1.Sheets(0))
    End Sub

    Private Sub InitSpread(ByVal spread As FarPoint.Web.Spread.FpSpread)
        spread.CssClass = "spreadStyle"
        spread.UseClipboard = False

        ' データ連結
        Dim ds As New System.Data.DataSet()
        ds.ReadXml(MapPath("../App_Data/datanum2.xml"))
        spread.DataSource = ds
    End Sub

    Private Sub InitSpreadStyles(ByVal sheet As FarPoint.Web.Spread.SheetView)
        ' フォントサイズの設定
        sheet.DefaultStyle.Font.Size = FontUnit.Parse("80%")
        sheet.ColumnHeader.DefaultStyle.Font.Size = FontUnit.Parse("80%")
        sheet.RowHeader.DefaultStyle.Font.Size = FontUnit.Parse("80%")
        sheet.SheetCorner.DefaultStyle.Font.Size = FontUnit.Parse("80%")

        ' 列幅の設定
        sheet.Columns(0).Width = 50
        sheet.Columns(1).Width = 100
        sheet.Columns(2).Width = 141
        sheet.Columns(3).Width = 80
        sheet.Columns(4).Width = 80
        sheet.Columns(5).Width = 80
        sheet.Columns(6).Width = 80

        ' セル型の設定
        sheet.Columns(1).CellType = New FarPoint.Web.Spread.LabelCellType()
        sheet.Columns(2).CellType = New FarPoint.Web.Spread.LabelCellType()

        '整数型セルの設定
        Dim ic As New FarPoint.Web.Spread.IntegerCellType()
        Dim ninfo As NumberFormatInfo = DirectCast(CultureInfo.CurrentCulture.NumberFormat.Clone(), NumberFormatInfo)
        ninfo.NumberGroupSizes = New Int32() {3}
        ic.NumberFormat = ninfo

        sheet.Columns(3).CellType = ic
        sheet.Columns(4).CellType = ic
        sheet.Columns(5).CellType = ic
        sheet.Columns(6).CellType = ic

        ' 縦方向の揃え位置を中央に設定
        sheet.DefaultStyle.VerticalAlign = VerticalAlign.Middle

        sheet.OperationMode = FarPoint.Web.Spread.OperationMode.RowMode
        sheet.EnableRowEditTemplate = True
    End Sub
End Class


<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" 
         CodeFile="rowedittemplate.aspx.cs" Inherits="edit_rowedittemplate" %>

<%@ Register Assembly="FarPoint.Web.SpreadJ" Namespace="FarPoint.Web.Spread" TagPrefix="FarPoint" %>

<asp:Content ID="Content1" ContentPlaceHolderID="HeaderPlaceHolder1" Runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
    <FarPoint:FpSpread ID="FpSpread1" runat="server">
        <CommandBar BackColor="Control" ButtonFaceColor="Control" ButtonHighlightColor="ControlLightLight"
            ButtonShadowColor="ControlDark">
<Background BackgroundImageUrl="SPREADCLIENTPATH:/img/cbbg.gif"></Background>
        </CommandBar>
        <Sheets>
            <FarPoint:SheetView SheetName="Sheet1">
                <RowEditTemplate>
                    <table style="width:400px; margin: 10px 20px 10px 20px;"
                     border="0" cellspacing="0">
                        <tr>
                            <td style="background-color: #99CCFF; color: #0000CC">
                                製品分類</td>
                            <td>
                                <FarPoint:FpSpreadTemplateReplacement ID="FpSpreadTemplateReplacement1" 
                                    runat="server" ColumnIndex="1" Height="23" />
                            </td>
                            <td style="color: #0000CC; background-color: #99CCFF">
                                製品名</td>
                            <td>
                                <FarPoint:FpSpreadTemplateReplacement ID="FpSpreadTemplateReplacement2" 
                                    runat="server" ColumnIndex="2" Height="23" />
                            </td>
                        </tr>
                        <tr>
                            <td style="color: #0000CC; background-color: #99CCFF">
                                第１Q</td>
                            <td>
                                <FarPoint:FpSpreadTemplateReplacement ID="FpSpreadTemplateReplacement5" 
                                    runat="server" ColumnIndex="3" Height="23" />
                            </td>
                            <td style="color: #0000FF; background-color: #99CCFF">
                                第2Q</td>
                            <td>
                                <FarPoint:FpSpreadTemplateReplacement ID="FpSpreadTemplateReplacement6" 
                                    runat="server" ColumnIndex="4" Height="23" />
                            </td>
                        </tr>
                        <tr>
                            <td style="color: #0000CC; background-color: #99CCFF">
                                第3Q</td>
                            <td>
                                <FarPoint:FpSpreadTemplateReplacement ID="FpSpreadTemplateReplacement7" 
                                    runat="server" ColumnIndex="5" Height="23" />
                            </td>
                            <td style="color: #0000FF; background-color: #99CCFF">
                                第4Q</td>
                            <td>
                                <FarPoint:FpSpreadTemplateReplacement ID="FpSpreadTemplateReplacement8" 
                                    runat="server" ColumnIndex="6" Height="23" />
                            </td>
                        </tr>
                        <tr>
                            <td align="center" colspan="2">
                                <FarPoint:FpSpreadTemplateReplacement ID="FpSpreadTemplateReplacement3" 
                                    runat="server" Height="23" ReplacementType="UpdateButton" />
                            </td>
                            <td align="center" colspan="2">
                                <FarPoint:FpSpreadTemplateReplacement ID="FpSpreadTemplateReplacement4" 
                                    runat="server" Height="23" ReplacementType="CancelButton" />
                            </td>
                        </tr>
                    </table>
                </RowEditTemplate>
            </FarPoint:SheetView>
        </Sheets>

<TitleInfo BackColor="#E7EFF7" ForeColor="" HorizontalAlign="Center" VerticalAlign="NotSet" Font-Size="X-Large"></TitleInfo>
    </FarPoint:FpSpread>
</asp:Content>