y-matsui::weblog

電子楽器、音楽、コンピュータ、プログラミング、雑感。面倒くさいオヤジの独り言

GridViewに複数選択削除機能を追加する

GridViewのID列にチェックボックスを追加して、複数選択したレコードを一括削除する機能について。
■方法
・グリッドビューのイベント"GridView1_RowDataBound(object sender, GridViewRowEventArgs e)"で、ヘッダのID列に”全選択/解除”チェックボックスと、データ行ID列に選択チェックボックスを追加する。
Javascript関数"AllCheck_onclick()”の追加
・選択削除ボタン"btn_DeleteSelectedRecord"の追加と、削除処理”btn_DeleteSelectedRecord_Click(object sender, EventArgs e)”の追加
・削除処理”deleteRecord(string tablename, string idfield,string ids)”の追加

■処理の流れ
・検索結果一覧フォーム読み込み
 Javascriptのロード
 選択削除ボタンの描画
 全選択/解除チェックボックスの描画
 行選択チェックボックスの描画

・レコード選択
 グリッドの行チェックボックスをクリック
          or
 ヘッダの全選択/解除ボタンをクリック→全行のID列チェックボックスの状態を反転

・選択削除ボタンのクリック
 フォームのPOST
 チェックボックスの選択状態(string ids=Request.Form["Check"].ToString())を取得
 deleteRecordメソッドの引数としてidsと対象テーブル名、ID列名を渡す

・削除処理
 テーブル名、id列名、idsを元に削除用クエリを生成
 string sql = "DELETE FROM " + tablename + " WHERE " + idfield + " in (" + ids + ")"; 
削除した結果の件数を返却する。

・画面の再描画
 グリッドビューの再描画を行う


■webui.jsに下記のJavascriptを追加

//全選択・解除
function AllCheck_onclick() {
var n;
n = document.all.Check.length;
if (isNaN(n) == true) {
//レコードが1件の場合
document.all.Check.checked = document.all.checktitle.checked;
} else {
//レコードが2件以上の場合
for (i = 0; i < n; i++) {
document.all.Check[i].checked = document.all.checktitle.checked;
}
}
}

※このJavascript関数は、FireFoxで動作しない。(document.allがIE専用だから)

                                                                                                                                1. +

//document.allを書き替えたバージョン
//全選択・解除
function AllCheck_onclick() {
var n;
n = document.form1.elements.Check.length;
if (isNaN(n) == true) {
//レコードが1件の場合
document.form1.elements.Check.checked = document.getElementById("checktitle").checked;
} else {
//レコードが2件以上の場合
for (i = 0; i < n; i++) {
document.form1.elements.Check[i].checked = document.getElementById("checktitle").checked;
}
}
}

※一応、上記で動くが、”form1”直接指定ってダサいなぁ。ボソ

                                                                                                                                1. +
                                                                                                                                1. +

■aspx.csファイルに追加する

//選択削除ボタンをクリックした
protected void btn_DeleteSelectedRecord_Click(object sender, EventArgs e)
{
int reccnt = 0;
string ids="";
if *1
{
ids = Request.Form["Check"].ToString();
reccnt=common.deleteRecord("tbl_systemlog","n_logmessageid",ids);
}
if(reccnt>0)
{
common.WriteLog("履歴削除", "成功", reccnt.ToString()+"件のレコードを削除しました。ID:" +ids);
Page_Load(sender, e);
}
}


//グリッドに行がバインドされる際に値を加工する
protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{

//ヘッダ行ID列に”全選択/解除”チェックボックスを追加する
if (e.Row.RowType == DataControlRowType.Header)
{
e.Row.Cells[0].Text = "<input type='checkbox' id='checktitle' name='CheckTitle' onclick='AllCheck_onclick()' />ID";
}

if (e.Row.RowType == DataControlRowType.DataRow)
{
DataRowView drv = (DataRowView)e.Row.DataItem;
//先頭に削除用チェックボックスを追加する
str = drv["n_logmessageid"].ToString();
if (str != "")
{
e.Row.Cells[0].Text="<input type='checkbox' name='Check' id='Check' value='" + str + "'>"+ str;
}
}

■.aspxファイル(インタフェース)への追加

・Jacvascriptのインクルード
<script type="text/javascript" src="webui.js"></script>


・ボタン追加
  
<asp:Button ID="btn_DeleteSelectedRecord" runat="server" onclick="btn_DeleteSelectedRecord_Click"
style="width: 115px" Text="選択削除" BackColor="#FF9999" />
<br/>


■common.deleteRecord

//データベースに接続して指定されたテーブルから、指定したidに該当するレコードを削除します
public static int deleteRecord(string tablename, string idfield,string ids)
{
int cnt = -1;
if *2
{
return cnt;
}

string sql = "DELETE FROM " + tablename + " WHERE " + idfield + " in (" + ids + ")";
ConnectionStringSettings settings = ConfigurationManager.ConnectionStrings["ConnectionString_Webadmin"];
string connectionString = settings.ConnectionString;
using (OdbcConnection connection = new OdbcConnection(connectionString))
{
OdbcCommand command = new OdbcCommand(sql);
command.Connection = connection;
try
{
connection.Open();
cnt=command.ExecuteNonQuery();
}
catch (OdbcException ex)
{
common.WriteLog("common.deleteRecord()", "失敗", "レコードの削除中にエラーが発生。条件:"+sql+"、ODBCの例外" + ex.Message.ToString());
return -1;
}
catch (Exception ex)
{
common.WriteLog("common.deleteRecord()", "失敗", "レコードの削除中にエラーが発生。条件:"+sql+"、例外:" + ex.Message.ToString());
return -1;
}
return cnt;
}
}

*1:Request.Form["Check"]!=null)&&(Request.Form["Check"].ToString()!=""

*2:tablename == "") || (idfield == "")|| (ids == ""