none
GridviewとDropDownListの使い方 RRS feed

  • 質問

  • 初投稿させていただきます。

    タイトルどおりについて相談を。

    結果として求めているのは

    Dropdownlistの選択項目(1,2とする)

    1を選択した場合、 ContentPlaceHolder1内のGrid及びBitmap画像を表示

    2を選択した場合、 ContentPlaceHolder2にGrid ContentPlaceHolder1にBitmap画像を表示という

    形をとりたいのです。

    VB開発は半年ほどですがASPは初心者ですので。どう触ればいいのかイメージができません

    ご教授願います。

    訂正いたします。

    Bitmap画像は忘れてください。

    ContentPlaceHolderをMaster上に1つ設置し、その中で、Grid、Bitmapの表示はなんとか自己解決しました。

    みなさん回答ありがとうございます。

    で、訂正した本題ですが、画像として貼れたらいいのですが、事情により難しいので。

    ○(bitmap画像)☆(Gridview)と仮定し、現状では○の真下に☆が表示されています。

    それを○☆のように隣合で表示させたいのです。

    BitmapはUpdatepanelでアップロードさせています。

    単純に座標計算でできるのではないか?と思い調べては見ましたが、Grid

    の座標取得ができるのかどうかわからず。

    よろしくお願いします。

    2012年2月15日 2:59

回答

  • ご質問の意味がはっきりわからないのですが、ContentPlaceHolder1の中身を切り替えたいということでよろしいでしょうか? であれば、MultiViewの使用を検討されてみてはいかがでしょうか?

    (参考)
    [ASP.NET]MultiView/Viewコントロールでマルチビューのページを作成するには?[2.0のみ、C#、VB]
    http://www.atmarkit.co.jp/fdotnet/dotnettips/399aspmultiview/aspmultiview.html


    ★良い回答には回答済みマークを付けよう! わんくま同盟 MVP - Visual C# http://d.hatena.ne.jp/trapemiya/

    • 回答の候補に設定 山本春海 2012年2月28日 7:44
    • 回答としてマーク 山本春海 2012年3月2日 8:17
    2012年2月15日 4:27
    モデレータ
  • こんにちは。

    まず「表示」が、何を意味しているかを明確にする必要があると思います。


    1)hiddenn(隠し属性)であったものを見えるようにする。
    2)DoropdownListの選択を機に、データを取得して表示する。
    3)DoropdownListの選択を機に、ページを遷移させる。
    4)両者の複合形
    5)その他


    といった事です。


    以下は、マルチビューのようなかっこよい方法ではなくて、もっとローテクな方法ですが(^^;参考までに。
    (3)の方法に当たります。

    MasterPageにDoropDownListを用意しておき、
    AutoPostBackを有効にし、
    MasterPageのDropDownList1.SelectedIndexChangedで、


        Protected Sub DropDownList1_SelectedIndexChanged(sender As Object, e As EventArgs) Handles DropDownList1.SelectedIndexChanged

            Select Case DropDownList1.SelectedIndex
                Case 1
                    Response.Redirect("WebForm1.aspx")
                Case 2
                    Response.Redirect("WebForm2.aspx")
                Case Else

            End Select

        End Sub


    と、Response.Redirectでページを遷移させる事でしょうか。


    この時のサイトマスターは、


    <body>
        <form id="form1" runat="server">
        <div>
            <asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="True">
                <asp:ListItem>選択してください</asp:ListItem>
                <asp:ListItem>1</asp:ListItem>
                <asp:ListItem>2</asp:ListItem>
            </asp:DropDownList>
        </div>
        <div>
            <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
            </asp:ContentPlaceHolder>
            <asp:ContentPlaceHolder ID="ContentPlaceHolder2" runat="server">
            </asp:ContentPlaceHolder>    </div>
        </form>
    </body>

    WebForm1.aspx,WebForm2.aspx はそれぞれ以下のような感じです。

    WebForm1.aspx------------------------------------

    <%@ Page Title="" Language="vb" AutoEventWireup="false" MasterPageFile="~/Site1.Master" CodeBehind="WebForm1.aspx.vb" Inherits="WebApplication3.WebForm1" %>

    <asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    </asp:Content>

    <asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <p>ContentPlaceHolder1 の内容</p>
    </asp:Content>

    <asp:Content ID="Content3" ContentPlaceHolderID="ContentPlaceHolder2" runat="server">
    <p>ContentPlaceHolder2 の内容 GRIDかなんか?</p>
    </asp:Content>


    WebForm2.aspx------------------------------------

    <%@ Page Title="" Language="vb" AutoEventWireup="false" MasterPageFile="~/Site1.Master" CodeBehind="WebForm2.aspx.vb" Inherits="WebApplication3.WebForm2" %>

    <asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    </asp:Content>

    <asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <p>ContentPlaceHolder1 の内容Gridか何か。</p>
    </asp:Content>

    <asp:Content ID="Content3" ContentPlaceHolderID="ContentPlaceHolder2" runat="server">
    <p>ContentPlaceHolder2 の内容 WebForm2</p>
    </asp:Content>


    こんな感じです。

    画像や表示内容は、各ページ(WebForm1.aspxなど)で適宜コードやコントロールを実装するなりすれば良いと思います。
    DropDownListは、各ページ(WebForm1.aspxなど)に配置する方法もあります。


    ※この方法は、一例であって最善のものでは無い可能性がありますので注意してください。

     

    • 回答の候補に設定 山本春海 2012年2月28日 7:44
    • 回答としてマーク 山本春海 2012年3月2日 8:17
    2012年2月15日 4:49
  • 質問からはやりたいことがよく分からないのでハズレかもしれま
    せんが・・・

    要するに、同じページ内で、DropDownList の 1 or 2 の選択によ
    って、異なる GridView と画像を切り替えて表示したいということ
    でしょうか?

    であれば ContentPlaceHolder は一つで済むはずです。以下のよう
    にすれば実現できると思います。

    (1) Master Page の ContentPlaceHolder は一つで可。

    (2) 子ページで、Master Page の ContentPlaceHolder に該当する
    Content の中に DropDownList を 1 つと Panel を 2 つ配置。

    (3) DropDownList には ListItem を 2 つ追加し、その Value を
    それぞれ 1 と 2 に設定する。

    (4) それぞれの Panel の中に表示する GridView と Image を配置。

    (5) DropDownList の AutoPostBack プロパティを true にする。

    (6) DropDownList の SelectedIndexChanged イベントのハンドラ
    を作る。

    (7) 上記 (6) のハンドラの中で、DropDownList の SelectedValue
    の値(1 または 2)を取得し、それに応じて Panel の表示/非表示
    を切り替える。

    上記や他の回答者の回答と自分がやりたいことが違う場合は、具体
    的にどうしたいのか書いてください。

    • 回答の候補に設定 山本春海 2012年2月28日 7:45
    • 回答としてマーク 山本春海 2012年3月2日 8:17
    2012年2月15日 12:35

すべての返信

  • ご質問の意味がはっきりわからないのですが、ContentPlaceHolder1の中身を切り替えたいということでよろしいでしょうか? であれば、MultiViewの使用を検討されてみてはいかがでしょうか?

    (参考)
    [ASP.NET]MultiView/Viewコントロールでマルチビューのページを作成するには?[2.0のみ、C#、VB]
    http://www.atmarkit.co.jp/fdotnet/dotnettips/399aspmultiview/aspmultiview.html


    ★良い回答には回答済みマークを付けよう! わんくま同盟 MVP - Visual C# http://d.hatena.ne.jp/trapemiya/

    • 回答の候補に設定 山本春海 2012年2月28日 7:44
    • 回答としてマーク 山本春海 2012年3月2日 8:17
    2012年2月15日 4:27
    モデレータ
  • こんにちは。

    まず「表示」が、何を意味しているかを明確にする必要があると思います。


    1)hiddenn(隠し属性)であったものを見えるようにする。
    2)DoropdownListの選択を機に、データを取得して表示する。
    3)DoropdownListの選択を機に、ページを遷移させる。
    4)両者の複合形
    5)その他


    といった事です。


    以下は、マルチビューのようなかっこよい方法ではなくて、もっとローテクな方法ですが(^^;参考までに。
    (3)の方法に当たります。

    MasterPageにDoropDownListを用意しておき、
    AutoPostBackを有効にし、
    MasterPageのDropDownList1.SelectedIndexChangedで、


        Protected Sub DropDownList1_SelectedIndexChanged(sender As Object, e As EventArgs) Handles DropDownList1.SelectedIndexChanged

            Select Case DropDownList1.SelectedIndex
                Case 1
                    Response.Redirect("WebForm1.aspx")
                Case 2
                    Response.Redirect("WebForm2.aspx")
                Case Else

            End Select

        End Sub


    と、Response.Redirectでページを遷移させる事でしょうか。


    この時のサイトマスターは、


    <body>
        <form id="form1" runat="server">
        <div>
            <asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="True">
                <asp:ListItem>選択してください</asp:ListItem>
                <asp:ListItem>1</asp:ListItem>
                <asp:ListItem>2</asp:ListItem>
            </asp:DropDownList>
        </div>
        <div>
            <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
            </asp:ContentPlaceHolder>
            <asp:ContentPlaceHolder ID="ContentPlaceHolder2" runat="server">
            </asp:ContentPlaceHolder>    </div>
        </form>
    </body>

    WebForm1.aspx,WebForm2.aspx はそれぞれ以下のような感じです。

    WebForm1.aspx------------------------------------

    <%@ Page Title="" Language="vb" AutoEventWireup="false" MasterPageFile="~/Site1.Master" CodeBehind="WebForm1.aspx.vb" Inherits="WebApplication3.WebForm1" %>

    <asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    </asp:Content>

    <asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <p>ContentPlaceHolder1 の内容</p>
    </asp:Content>

    <asp:Content ID="Content3" ContentPlaceHolderID="ContentPlaceHolder2" runat="server">
    <p>ContentPlaceHolder2 の内容 GRIDかなんか?</p>
    </asp:Content>


    WebForm2.aspx------------------------------------

    <%@ Page Title="" Language="vb" AutoEventWireup="false" MasterPageFile="~/Site1.Master" CodeBehind="WebForm2.aspx.vb" Inherits="WebApplication3.WebForm2" %>

    <asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    </asp:Content>

    <asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <p>ContentPlaceHolder1 の内容Gridか何か。</p>
    </asp:Content>

    <asp:Content ID="Content3" ContentPlaceHolderID="ContentPlaceHolder2" runat="server">
    <p>ContentPlaceHolder2 の内容 WebForm2</p>
    </asp:Content>


    こんな感じです。

    画像や表示内容は、各ページ(WebForm1.aspxなど)で適宜コードやコントロールを実装するなりすれば良いと思います。
    DropDownListは、各ページ(WebForm1.aspxなど)に配置する方法もあります。


    ※この方法は、一例であって最善のものでは無い可能性がありますので注意してください。

     

    • 回答の候補に設定 山本春海 2012年2月28日 7:44
    • 回答としてマーク 山本春海 2012年3月2日 8:17
    2012年2月15日 4:49
  • 質問からはやりたいことがよく分からないのでハズレかもしれま
    せんが・・・

    要するに、同じページ内で、DropDownList の 1 or 2 の選択によ
    って、異なる GridView と画像を切り替えて表示したいということ
    でしょうか?

    であれば ContentPlaceHolder は一つで済むはずです。以下のよう
    にすれば実現できると思います。

    (1) Master Page の ContentPlaceHolder は一つで可。

    (2) 子ページで、Master Page の ContentPlaceHolder に該当する
    Content の中に DropDownList を 1 つと Panel を 2 つ配置。

    (3) DropDownList には ListItem を 2 つ追加し、その Value を
    それぞれ 1 と 2 に設定する。

    (4) それぞれの Panel の中に表示する GridView と Image を配置。

    (5) DropDownList の AutoPostBack プロパティを true にする。

    (6) DropDownList の SelectedIndexChanged イベントのハンドラ
    を作る。

    (7) 上記 (6) のハンドラの中で、DropDownList の SelectedValue
    の値(1 または 2)を取得し、それに応じて Panel の表示/非表示
    を切り替える。

    上記や他の回答者の回答と自分がやりたいことが違う場合は、具体
    的にどうしたいのか書いてください。

    • 回答の候補に設定 山本春海 2012年2月28日 7:45
    • 回答としてマーク 山本春海 2012年3月2日 8:17
    2012年2月15日 12:35
  • こんにちは、初心者でごめんなさい さん。

    フォーラムのご利用ありがとうございます。オペレーターの山本です。
    しばらく経ちましたが、その後いかがでしょうか。

    みなさんから、参考になる情報をいただいているかと思われましたので、一旦私のほうで回答としてマークさせていただきました。
    情報くださったみなさん、ありがとうございます。

    いただいた情報の中で解決に役立った投稿や、参考になる情報など有効な情報には回答としてマークすることをお願いしています。
    今後、同じ問題でこのスレッドを参照される方にも、有効な情報を活用いただけるかと思いますので、ご協力よろしくお願いいたします。

    初心者でごめんなさい さん、もしまだ不明点があるようであれば、みなさんからアドバイスいただいているように、やりたいことの詳細情報や現時点での不明点など情報更新をしていただけるとうれしいです。
    よろしくお願いいたします。
    _____________________
    日本マイクロソフト株式会社 フォーラム オペレーター 山本 春海

    2012年3月2日 8:17