DataGridView:セルの右端にエラーアイコンを表示する方法(サンプルあり)

📋 目次(クリックで展開)

DataGridView でユーザーの入力値に問題がある場合、メッセージボックスを表示する代わりに、セルの右端に赤いエラーアイコン(!)を表示してユーザーに通知することができます。

入力ミスをスマートに伝えたい場合に非常に便利な機能です。

今回は、特定のセルにエラーアイコンを表示し、マウスホバーでエラー理由をポップアップ表示させる基本手順について解説します。

エラーアイコンを表示する基本手順

DataGridView の各セルには ErrorText というプロパティが用意されています。このプロパティにエラー理由となる文字列を設定するだけで、対象セルの右端に赤いエラーアイコンが自動的に描画されます。

標準ではエラーアイコンが表示される設定になっていますが、もし表示されない場合は、DataGridView コントロール自体の ShowCellErrors プロパティが true になっているか確認してください(デフォルトは true です)。

// 画面全体でセルエラーの表示を許可する(通常は初期値のままでOKです)
dataGridView1.ShowCellErrors = true;
// 対象のセルにエラーメッセージを設定する
dataGridView1.Rows[0].Cells[1].ErrorText = "この項目は必須入力です。";

実装コード

実務では、ユーザーがセルの入力を終えて移動しようとしたタイミング(CellValidating イベント)で入力チェックを行い、動的にエラーアイコンを切り替える実装が一般的です。

以下は、「商品名(Name)」列が空文字のまま次のセルへ移動しようとした際に、そのセルにエラーアイコンを表示するサンプルコードです。

Form1.cs
using System.ComponentModel;
namespace DataGridView_Validation_Cell_Error
{
public partial class Form1 : Form
{
private BindingList<ProductModel> _products = new();
public Form1()
{
InitializeComponent();
InitializeDataGridView();
}
private void InitializeDataGridView()
{
// サンプルデータの追加
_products.Add(new ProductModel("P001", "ノートパソコン"));
_products.Add(new ProductModel("P002", "USBメモリ"));
dataGridView1.DataSource = _products;
dataGridView1.AutoSizeColumnsMode = DataGridViewAutoSizeColumnsMode.Fill;
// セルの検証イベントを購読
dataGridView1.CellValidating += DataGridView1_CellValidating;
}
// セルの入力検証イベント
private void DataGridView1_CellValidating(object sender, DataGridViewCellValidatingEventArgs e)
{
// 「商品名」列のみを対象にする
var columnName = dataGridView1.Columns[e.ColumnIndex].DataPropertyName;
if (columnName == "Name")
{
// ユーザーが入力した値を取得
string inputValue = e.FormattedValue?.ToString()?.Trim() ?? "";
var cell = dataGridView1.Rows[e.RowIndex].Cells[e.ColumnIndex];
if (string.IsNullOrEmpty(inputValue))
{
// エラーテキストを設定(自動的に赤いアイコンが表示されます)
cell.ErrorText = "商品名を入力してください。";
}
else
{
// 正しい値が入力されたら空文字を設定してエラーをクリア
cell.ErrorText = string.Empty;
}
}
}
}
}

モデルクラス(ProductModel.cs)

ProductModel.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
namespace DataGridView_Validation_Cell_Error
{
// データモデルクラス
public class ProductModel
{
public string Code { get; set; }
public string Name { get; set; }
public ProductModel(string code, string name)
{
Code = code;
Name = name;
}
}
}

注意点:編集モード中の表示について

DataGridView の仕様上、セルが「入力編集モード」になっている間(テキストボックスがセルを覆っている最中)は、ErrorText を設定しても赤いエラーアイコンはテキストボックスの裏に隠れて表示されません。
ユーザーが Enter キーや Tab キーを押してセルの編集モードを抜けた(確定した)瞬間に、エラーアイコンが表面に現れる挙動になります。
そのため、セルの ErrorText は、「エラーであってもフォーカスをそのセルに強制ロックせず、次のセルの入力を許可する(すれ違いざまにエラーマークを残していく)」フリーフォーカス形式の入力画面で最も綺麗に機能します。

ソースコード

サンプルアプリケーション

DataGridView_Validation_Cell_Error.zip
※ サンプルアプリケーションは、.NET 9 をターゲットに作成しています。

まとめ

今回は、DataGridView のセル単体にエラーアイコンを表示する方法について解説しました。

cell.ErrorText は、文字列の未入力チェックや文字数制限など、データの検証結果を画面を汚さずに表現できる非常にシンプルな機能です。

「エラーがある場合は入力を一時的に受け付けるが、最後の確定ボタンを押すタイミングでグリッド全体を走査してエラーテキストが残っているセルがあれば弾く」といった設計と組み合わせることで、ユーザーにストレスを与えない快適な入力画面を作成することができます。

DataGridView を用いたバリデーション実装の参考になりましたら幸いです。

関連記事


💬 コメント