- PR -

ASP.NET チェックボックスの処理

1|2|3 次のページへ»
投稿者投稿内容
ぷり
ベテラン
会議室デビュー日: 2008/02/22
投稿数: 60
投稿日時: 2008-05-08 11:51
宜しくお願いします。

現在、ASP.NET WEBアプリケーションでの作成をしています。

SQL SERVERと接続して更新処理などさせているのですが、

チェックボックスの部分で希望の処理ができないのでご助言お願いします。

チェックボックスがフォーム内に４つあります。

（SQL SERVERのデータと接続しています。）

仮にチェックボックス名を「あ」「1」「2」「3」とすると、

「1」でチェックをつけた場合に「あ」にも自動的にチェックが入る様にしたいのです。

「2」「3」にチェックが入った場合は、「あ」にはチェックがつかない。

データベースの関係上、ラジオボタンは使用できません。

どの箇所にどの様なコードを記入すれば、

希望する動作になるかご助言お願い致します。
pt
会議室デビュー日: 2004/11/05
投稿数: 14
投稿日時: 2008-05-08 12:16
サーバ側で処理したいですか？？
それともクライアント側で処理したいですか？？
それによって、答えもかわってきます。

＞データベースの関係上、ラジオボタンは使用できません。
興味本位ですが、ここだけわかりません。
もう少し詳しく説明願えないでしょうか？？
完全な排他処理ではないので、どちらにせよラジオボタンじゃ厳しい気がしますが。
RapidExpress
常連さん
会議室デビュー日: 2007/11/11
投稿数: 42
お住まい・勤務地: おおさか
投稿日時: 2008-05-08 12:34
各ボックスのAutoPostBackをTrueにすれば、チェック操作の度にCheckedChangedイベントが
走るので、簡単ではありますけど操作性は著しく損なわれます。これと同等のことをクライアント側でやるとしたら。。。

コード:
    // クライアント側コード
    <script type="text/javascript">
    function Change()
    {
        var chk1 = document.getElementById('<%= CheckBox1.ClientID %>');
        var chk2 = document.getElementById('<%= CheckBox2.ClientID %>');
        var chk3 = document.getElementById('<%= CheckBox3.ClientID %>');
        var chk4 = document.getElementById('<%= CheckBox4.ClientID %>');

        if (chk2.checked)
        {
            // 2番目のチェックボックスがオンなら1番目もオンにする
            chk1.checked = true;
        }  

        // ...以下は、ほかの条件などがあれば
        
    }
    </script>

    'サーバ側コード
    Protected Sub CheckBox1_Load(ByVal sender As Object, ByVal e As System.EventArgs) _
        Handles CheckBox1.Load, CheckBox2.Load, CheckBox3.Load, CheckBox4.Load
        
        Dim ctrl As CheckBox = CType(sender, CheckBox)
        ctrl.Attributes.Add("onclick", "Change();")
    End Sub
ぷり
ベテラン
会議室デビュー日: 2008/02/22
投稿数: 60
投稿日時: 2008-05-08 14:42
pt様、RapidExpress様　ありがとうございます。

pt様

クライアント側で行いたいです。

＞興味本位ですが、ここだけわかりません。

申し訳ありません。

ただ、データベースのテーブル構成が各フィールド事に

bit型で作成されているもので、

チェックボックスしか使用できないのかなと思いまして・・・。


RapidExpress様

コードありがとうございます。

とても参考になりました。

一度試してみて、再度ご報告致します。
ぷり
ベテラン
会議室デビュー日: 2008/02/22
投稿数: 60
投稿日時: 2008-05-08 15:49
先程、RapidExpress様から頂いたコードを試してみたのですが、

クライアント側では、
「名前'CheckBox1'は宣言されていません。」とエラーが出てしまい（4つとも）、

サーバ側では、
「Handles CheckBox1.Load, CheckBox2.Load, CheckBox3.Load, CheckBox4.Load」の
部分に波線が出てエラーになりました。


IDが「CheckBox1」から「CheckBox4」とそのままのIDなので、

[ClientID]の部分を変えてみたのですが、エラーがでます。

入力方法や入力場所が間違っていると思うのですが、どこが間違いか教えて下さい。

入力場所：チェックボックスが置いてあるフォームのソース

入力内容：
　　クライアント側
　　<script type="text/javascript">
function Change()
{
var chk1 = document.getElementById('<%= CheckBox1.CheckBox1 %>');
var chk2 = document.getElementById('<%= CheckBox2.CheckBox2 %>');
var chk3 = document.getElementById('<%= CheckBox3.CheckBox3 %>');
var chk4 = document.getElementById('<%= CheckBox4.CheckBox4 %>');

if (chk2.checked)
{
// 2番目のチェックボックスがオンなら1番目もオンにする
chk1.checked = true;
}
}
</script>

　　サーバ側
Protected Sub CheckBox1_Load(ByVal sender As Object, ByVal e As　System.EventArgs) _
Handles CheckBox1.Load, CheckBox2.Load, CheckBox3.Load, CheckBox4.Load

Dim ctrl As CheckBox = CType(sender, CheckBox)
ctrl.Attributes.Add("onclick", "Change();")
End Sub


宜しくお願い致します。



RapidExpress
常連さん
会議室デビュー日: 2007/11/11
投稿数: 42
お住まい・勤務地: おおさか
投稿日時: 2008-05-08 16:46
説明不足で申し訳ありません。ちょっと書き換えました。
{ボックス1}〜{ボックス4}のところを、実際に使用されている
チェックボックスのIDに差し替えてください。
（クライアント側、サーバ側それぞれ4か所ずつ）

コード:
    // クライアント側コード
    <script type="text/javascript">
    function Change()
    {
        var chk1 = document.getElementById('<%= {ボックス1}.ClientID %>');
        var chk2 = document.getElementById('<%= {ボックス2}.ClientID %>');
        var chk3 = document.getElementById('<%= {ボックス3}.ClientID %>');
        var chk4 = document.getElementById('<%= {ボックス4}.ClientID %>');

        if (chk2.checked)
        {
            // 2番目のチェックボックスがオンなら1番目もオンにする
            chk1.checked = true;
        }  

        // ...以下は、ほかの条件などがあれば
        
    }
    </script>

    'サーバ側コード
    Protected Sub CheckBox_Load(ByVal sender As Object, ByVal e As System.EventArgs) _
        Handles {ボックス1}.Load, {ボックス2}.Load, {ボックス3}.Load, {ボックス4}.Load
        
        Dim ctrl As CheckBox = CType(sender, CheckBox)
        ctrl.Attributes.Add("onclick", "Change();")
    End Sub


そちらで起こったエラーについてですが、まずクライアント側。
"ClientID"のところを変更してはいけません。これは各ボックスをクライアント上で
識別するためのIDをサーバ側より取得しています。（<%= 〜〜〜 %> の部分）
なお、すべてのサーバコントロールはこのClientIDというプロパティを持っています。

次にサーバ側。
"CheckBox_Load"は、各チェックボックスがロードされたときに実行され、
自身がクリックされたときにスクリプト(Change)が走るよう登録します。
そして、どのチェックボックスがロードされたときにこの登録を行うのかというのを
"Handles"以降で指定しています。なので、Handles以降に関しても、実際使用
されているコントロールのIDに変更してやらなければなりません。
ぷり
ベテラン
会議室デビュー日: 2008/02/22
投稿数: 60
投稿日時: 2008-05-12 06:45
RapidExpress様

丁寧なご指導ありがとうございます。
コンピュータが動かなくなり、再インストールして時間がかかってしまいました。

ご指導通りに、ＩＤを差し替えたのですが、

先程記載したエラー（「宣言されていない」というエラー）が出てしまいます。

後付で大変申し訳ないのですが、チェックボックスがGridView内にあることが、
何かエラーの原因なのでしょうか？

各ＩＤは「CheckBox1」〜「CheckBox4」というＩＤになっています。
（「Item」や「Edit」で表記されているＩＤです。）

それとも、コードを記入する場所が違うのでしょうか？
クライアント側コードはチェックボックスがあるフォームのソース部分に、
サーバ側コードはチェックボックスがあるフォームのＶＢに、
それぞれ記入しています。

GridView内にあるチェックボックスは希望する動きはできないのでしょうか？

よろしくお願いいたします。
RapidExpress
常連さん
会議室デビュー日: 2007/11/11
投稿数: 42
お住まい・勤務地: おおさか
投稿日時: 2008-05-12 10:17
こんにちわ。

コードの記述場所については問題ありません。

引用:

後付で大変申し訳ないのですが、チェックボックスがGridView内にあることが、
何かエラーの原因なのでしょうか？

その通りです。GridViewの中にあるコントロールを直接参照することはできません。
私が示したコードを適用できるのは、ページ直下にあるコントロールだけになります。
各列に4つずつボックスがあるのだとすれば、こんな感じになると思います。

コード:
 
    // クライアント側コード
    <script type="text/javascript">
    function Change(box1, box2, box3, box4)
    {
        var chk1 = document.getElementById(box1);
        var chk2 = document.getElementById(box2);
        var chk3 = document.getElementById(box3);
        var chk4 = document.getElementById(box4);

        if (chk2.checked)
        {
            // 2番目のチェックボックスがオンなら1番目もオンにする
            chk1.checked = true;
        }  

        // ...以下は、ほかの条件などがあれば
        
    }
    </script>

    'サーバ側コード
    Protected Sub GridView1_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles GridView1.RowDataBound
        Dim row As GridViewRow = e.Row
        If row.RowType = DataControlRowType.DataRow Then
            '各ボックスを取得
            Dim box1 As CheckBox = row.FindControl("CheckBox1")
            Dim box2 As CheckBox = row.FindControl("CheckBox2")
            Dim box3 As CheckBox = row.FindControl("CheckBox3")
            Dim box4 As CheckBox = row.FindControl("CheckBox4")

            'IDをスクリプトに渡す
            Dim script As String
            script = String.Format("Change('{0}', '{1}', '{2}', '{3}');", box1.ClientID, box2.ClientID, box3.ClientID, box4.ClientID)

            '各ボックスにスクリプトを登録
            box1.Attributes.Add("onclick", script)
            box2.Attributes.Add("onclick", script)
            box3.Attributes.Add("onclick", script)
            box4.Attributes.Add("onclick", script)
        End If
    End Sub

デザイナでは「CheckBox1」などと指定していても、どの4つを1つのグループとみなすのか、
IDは全て指定してやらねばなりません。そしてそれは列ごとに行う必要があります。
（うまく説明できなくてすみません。。。）
_________________
//---
　あやのこうじ＠RapidExpress
1|2|3 次のページへ»

スキルアップ／キャリアアップ（JOB@IT）