QA@IT

visualstudio2015:asp.netでダイアログ表示 言語VB,C

5884 PV

開発環境visualstudio2015
sqlserver

sqlをopenしselectしたデータをdatasetテーブルに格納しgridviewのdatasourceにdatasetテーブル設定し、bindして表示させています。
そのgridviewにテンプレートフィールドを追加し
削除ボタンを追加しています
削除ボタンを押したときにダイアログを表示させ、(OnClientClick="return confirm('削除してもよろしいですか');" )

このダイアログメッセージの内容を「○○を削除してもよろしいですか?」という風にプログラムしたいのですが
どのようなロジックを書けばいいのかがわかりません

現在は
Protected Sub GridView1_RowCreated(sender As Object, e As GridViewRowEventArgs) Handles GridView1.RowCreated
If (e.Row.RowType = DataControlRowType.DataRow) Then
Dim dltButton As Button = CType(e.Row.FindControl("Btn_delete"), Button)
dltButton.CommandArgument = e.Row.RowIndex.ToString
End If

rowcommandイベントでe.CommandArgumentをrowとして、テーブルからRemoveとしているのでサーバー側ですべて処理されています。

言語追記タイトル

  • 「○○を削除してもよろしいですか?」の○○には何を表示したいのですか? DB から取得して GridView に表示される何かですか? 具体的には? -

回答

「○○を削除してもよろしいですか?」の○○には DB から取得して GridView に表示する主キーとか名前だろうと想像してとりあえず回答します。

SQL Server からデータを取得して DataSet を作成するメソッド CreateDataTable()、主キーを引数として受け取って当該レコードを削除するメソッド DeleteRecord(int ProductID) は以下のようにクラスファイルにまとめます。DB は Microsoft が提供するサンプルデータベース Northwind の Products テーブルを使ってみました。DeleteRecord メソッドは 1 を返すだけで実際にレコードを削除するコードは書いていません。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Data;
using System.Data.SqlClient;
using System.Web.Configuration;

public class NorthwindProductsDataTable
{
    public DataTable CreateDataTable()
    {
        string connString = WebConfigurationManager.
            ConnectionStrings["NORTHWINDConnectionString"].ConnectionString;
        string query = "SELECT * FROM Products";
        DataTable table = new DataTable();

        using (SqlConnection conn = new SqlConnection(connString))
        {
            SqlDataAdapter adapter = new SqlDataAdapter();
            adapter.SelectCommand = new SqlCommand(query, conn);
            adapter.Fill(table);
            return table;
        }
    }

    public int DeleteRecord(int ProductID)
    {
        return 1;
    }
}

上記 DataTable を直接 GridView の DataSource にバインドするといろいろ面倒なので、ObjectDataSource を利用します。○○ に表示するのは ProductID と ProductName にします。それらの値を取得するのは RowDataBound のハンドラで可能なので、そこで行います。以下のようになります。

<%@ Page Language="C#" %>
<%@ Import Namespace="System.Data" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script runat="server">

    protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        if (e.Row.RowType == DataControlRowType.DataRow)
        {
            Button btn = (Button)e.Row.FindControl("Button1");
            DataRowView view = (DataRowView)e.Row.DataItem;
            int productId = (int)view["ProductID"];
            string productName = (string)view["ProductName"];
            btn.OnClientClick = "return confirm(\"" + 
                productId.ToString() + ". " + 
                productName + " を削除してもよろしいですか?\")";
        }
    }
</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:ObjectDataSource ID="ObjectDataSource1" runat="server" 
            DeleteMethod="DeleteRecord" 
            SelectMethod="CreateDataTable" 
            TypeName="NorthwindProductsDataTable">
            <DeleteParameters>
                <asp:Parameter Name="ProductID" Type="Int32" />
            </DeleteParameters>
        </asp:ObjectDataSource>
        <asp:GridView ID="GridView1" runat="server" 
            DataKeyNames="ProductID"
            DataSourceID="ObjectDataSource1" 
            OnRowDataBound="GridView1_RowDataBound">
            <Columns>
                <asp:TemplateField ShowHeader="False">
                    <ItemTemplate>
                        <asp:Button ID="Button1" runat="server" 
                            CausesValidation="False" 
                            CommandName="Delete" Text="削除">
                        </asp:Button>
                    </ItemTemplate>
                </asp:TemplateField>
            </Columns>
        </asp:GridView>
    </div>
    </form>
</body>
</html>

実行結果は以下の画像のようになります。

http://surferonwww.info/BlogEngine/image.axd?picture=2016%2f9%2freturnConfirm.jpg

編集 履歴 (1)
  • ○○を削除してもよろしいですかの部分に関して、キーと名前での解釈でよかったです、こちらの記述がなく申し訳ありません。
    ソースまで書いていただきありがとうございます。
    SurferOnWwwさんの書いていただいたソースでうまく動作することができました!
    -
  • ひとつ質問なんですが、
    上記 DataTable を直接 GridView の DataSource にバインドするといろいろ面倒
    この部分に関して簡単な説明か、参考サイトでも教えていただけたらありがたいです。
    -
  • MSDN ライブラリの GridView の「データへのバインド」セクションの説明を読みましょう。
    https://msdn.microsoft.com/ja-jp/library/system.web.ui.webcontrols.gridview(v=vs.100).aspx
    -
  • データーソースコントロール(SqlDataSource, ObjectDataSource など)を利用ないと、並べ替え、更新、削除、ページングは自力でコードを書いて実装しなければなりません。 -
  • あーなるほど。ありがとうございます。
    並び替えでDatatableのままだとsqlで並び替えしてからまた格納でbindという形になったりするわけですね。助かりました。
    -
  • 並べ替えだけではないです。一度、並べ替え、更新、削除、ページングをデーターソースコントロール無しで自力でコードを書いて実装してみてください。いかに大変か分かると思います。 -
  • 例えば並び替えは以下のスレッドに書いてあるようなコードを自力で実装することになります。
    https://social.msdn.microsoft.com/Forums/ja-JP/0553066d-0151-4c86-91e1-cd0d33b678fd/sqldatasourcegridview?forum=vsgeneralja
    -
ウォッチ

この質問への回答やコメントをメールでお知らせします。