none
Visual Web Developer 2010 Express EditionでAJAX Control Toolkit を利用 RRS feed

  • 質問

  • [日付]のテキストボックスでカレンダーを利用するため、CalendarExtenderを追加したのですが、デバック後、[日付]テキストボックスをクリックしてもカレンダーが表示されません。

    下記の手順で追加したのですが、なにか間違っておりますでしょうか。

    [デザイナ] → [デザイン] → [日付]テキストボックス → [エクステンダの追加] → [CalendarExtender] を追加

    [プロパティ] の [format] にyyyy/MM/dd と入力

    どうぞよろしくお願いいたします。

     

    2010年7月23日 13:59

回答

  • 先週、下記のサイトからAjaxControlToolkit.Binary.NET35.zipダウンロードしました。

    Version 40412とサイトに記載がありました。

    http://ajaxcontroltoolkit.codeplex.com/releases/view/43475

     


    さらに確認をしたいのですが、プロジェクトの対象フレームワークは .NET Framework 3.5 でしょうか?
    .NET Framework 4 が対象の場合なら AjaxControlToolkit.Binary.NET4.zip の方を使うべきです。

    また、ダウンロード ページに注釈として次のように記述されています。

     - Pages using controls from AJAX Control Tookit .NET 3.5 must use the ToolkitScriptManager, rather than the ASP.NET ScriptManager.

    この点については正しく指定されていますでしょうか?

    軽く手元で試したのですが、

     ・対象フレームワークを .NET Framework 4 にする
     ・AjaxControlToolkit.dll は 3.5 を使う(AjaxControlToolkit.Binary.NET35.zip
     ・ToolkitScriptManager ではなく、ScriptManager を使う

    とすると、同じように Extender が動かない状態にはなりました。ただ、クライアント側のスクリプト エラーは発生していますけれども。
    • 回答としてマーク 山本春海 2010年7月30日 5:16
    2010年7月29日 1:18

すべての返信


  • あかん さんに返信

    手順は間違っていないように思います。
    .NET の実行時例外、もしくは JavaScript のエラーは何か発生しますか?
    2010年7月24日 21:35
  • もりおさん ありがとうございます。

    デバック開始で試していますが、エラーは発生しておりません。

    ちなみに上記では、 [CalendarExtender] を追加のみを書いていますが、

    その他のテキストボックスで[FilteredTextBoxExtender]を追加し、

    [filter type]に【number】、[invalid chars]に【-】を設定しても

    設定前と設定後では変化がありません。

     

    ソリューションエクスプローラーをみると、【bin】フォルダの中には以下のものがあります。

    ・AjaxControlToolkit.dll

    ・jaフォルダ→AjaxControlToolkit.resources.dll (その他にも【ar】フォルダ ~ 【zh-CHT】フォルダがある)

    ・AjaxControlToolkit.pdb

    2010年7月25日 14:56

  • あかん さんに返信

    > デバック開始で試していますが、エラーは発生しておりません。

    あら、そうすると JavaScript そのものが動作しないか、もしくは CalendarExtender コントロールと
    TextBox の関連付けが行われないのかしら。
    こんな感じで確認してみてはいかがでしょうか。

      <script type="text/javascript">
         function pageLoad() {
           var CalendarExtender1 = $find("<%= CalendarExtender1.ClientID %>");
           alert("CalendarExtender1.get_element():" + CalendarExtender1.get_element().id);
           var TextBox1 = $get("<%= TextBox1.ClientID %>");
           alert("TextBox1:" + TextBox1.id);
           if (CalendarExtender1.get_element() === TextBox1) {
             alert("同一であります");
           } else {
             alert("違っているであります");
           }
         }
      </script>
    </body>
    2010年7月26日 4:24
  • もりおさん ありがとうございます。

     

    textboxのスマートタグで[エクステンダーの削除]から確認をしましたら、

    下記のようになっていました。

    ------------------------------------------------------

    first_action_dateTextboxにアタッチされたエクステンダー

    種類:CalendarExtender

    ID:first_action_dateTextBox_CalendarExtender

    -------------------------------------------------------

    CalendarExtender コントロールとTextBox(first_action_dateTextBox) の関連付けはできているように思いますが、いかがでしょうか?

     

    上記に記載いただいた <script type="text/javascript">はまだ試していません。

    やり方がよくわかりませんでした。すみません。。




    2010年7月26日 12:12

  • あかん さんに返信

    > CalendarExtender コントロールとTextBox(first_action_dateTextBox) の関連付けはで
    > きているように思いますが、いかがでしょうか?

    多分大丈夫だと思います。そして私は少し間違っていました。
    クライアント側のプロパティ CalendarExtender.get_element() で取得されるのは Calendar で
    日付を選択したときの入力先のコントロール。確認すべきは Calendar を表示するトリガーなコント
    ロールが TextBox か否か。
    サーバー側のプロパティ CalendarExtender.PopupButtonID が無指定の場合 TextBox がトリガ
    ーになりますよーという CalendarExtender コントロールの仕様に基づいて
    CalendarExtender.get_button() が null であることを確認するとよいのかなと思います。

        <script type="text/javascript">
            function pageLoad() {
                var CalendarExtender1 = $find("<%= CalendarExtender1.ClientID %>");
                if (CalendarExtender1.get_button() === null) {
                    alert("OK:button is null");
                } else {
                    alert("NG:button is not null");
                }
            }
        </script>
    </body>

    > 上記に記載いただいた <script type="text/javascript">はまだ試していません。
    > やり方がよくわかりませんでした。すみません。。

    [WebForm.aspx] における表示モードを [デザイン] から [ソース] に切り替えると記述することが
    できます。記述場所は body タグ内であればどこでも良いような、良くないような。私は body の閉
    じタグの直前に記述するようにしています。
    2010年7月26日 21:40

  •  

    もりお さん 返信ありがとうございます。

    > [WebForm.aspx] における表示モードを [デザイン] から [ソース] に切り替えると記述することが
    > できます。記述場所は body タグ内であればどこでも良いような、良くないような。私は body の閉
    > じタグの直前に記述するようにしています。

    [ソース]はおおまかに以下のようになっています。

    <script runat="server">

    </script>

     

    <asp:Content ID="Content1"・・・・・>

    </asp:Content>

     

    <asp:Content ID="Content2"・・・・・>

    </asp:Content>

     

    bodyタグはありませんので、<script runat="server"> ~ </script>の後に記述したのですが、

    デバック時に【ビルドエラー】が発生してしまいます。

    2010年7月27日 10:23

  • あかん さんに返信

    マスターページを利用されていらっしゃるのですか。
    <asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    のタグ内に記述するとよいかと思います。

    > デバック時に【ビルドエラー】が発生してしまいます。

    何というエラーが発生するのでしょうか。
    2010年7月27日 11:37
  • もりおさん 返信ありがとうございます。

    > <asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    > のタグ内に記述するとよいかと思います。

    2パターンで記述してみましたが、2つともエラーが出ます。


    ■1つ目(そのまま記述)

        <script type="text/javascript">
            function pageLoad() {
                var CalendarExtender1 = $find("<%= CalendarExtender1.ClientID %>"); → この行でエラーが発生しました。
                if (CalendarExtender1.get_button() === null) {
                    alert("OK:button is null");
                } else {
                    alert("NG:button is not null");
                }
            }
        </script>

    エラー 1 'CalendarExtender1' は宣言されていません。保護レベルが原因でアクセスできない可能性もあります。


    ■2つ目(CalendarExtender1をCalendarExtenderに変更)
        <script type="text/javascript">
            function pageLoad() {
                var CalendarExtender = $find("<%= CalendarExtender.ClientID %>"); → この行でエラーが発生しました。
                if (CalendarExtender.get_button() === null) {
                    alert("OK:button is null");
                } else {
                    alert("NG:button is not null");
                }
            }
        </script>
    ※エラー 1 非共有メンバーを参照するには、オブジェクト参照が必要です。

    度々ですみません。 よろしくお願いいたします。

    2010年7月27日 14:08

  • あかん さんに返信

    > 1 'CalendarExtender1' は宣言されていません。保護レベルが原因でアクセスできない可能性もあります。
    CalendarExtender1 を参照できないですよーという意味です。
    $find("<%= CalendarExtender1.ClientID %>");
    の部分はページに配置しているサーバーコントロールを参照しなければいけないので、前回ご掲示いた
    だいた情報を見る限りではこのようにする必要があります。
    $find("<%= first_action_dateTextBox_CalendarExtender.ClientID %>");
    2010年7月27日 14:23
  • もりおさん 返信ありがとうございます。

    > 前回ご掲示いただいた情報を見る限りではこのようにする必要があります。
    > $find("<%= first_action_dateTextBox_CalendarExtender.ClientID %>");

    下記のように変更しましたが、やはりエラーが出てしまいます。

        <script type="text/javascript">
            function pageLoad() {
                var CalendarExtender = $find("<%= first_action_dateTextBox_CalendarExtender.ClientID %>");
                if (CalendarExtender.get_button() === null) {
                    alert("OK:button is null");
                } else {
                    alert("NG:button is not null");
                }
            }

    ※エラー1 'first_action_dateTextBox_CalendarExtender' は宣言されていません。保護レベルが原因でアクセスできない可能性もあります。
    2010年7月28日 10:20
  • var CalendarExtender = $find("<%= first_action_dateTextBox_CalendarExtender.ClientID %>");

    ここで指定している「first_action_dateTextBox_CalendarExtender」には CalenderExtender の ID を指定する必要があります。
    コントロールを貼り直したりして ID が変わってしまったことも考えられるので、再度 ID を確認しなおしてみてください。

    動きを見ていると JavaScript 自体が動いていないことも想定されるので、もう少しシンプルに JavaScript が動いていることを確認するのもありかと。

    <script type="text/javascript">
    function pageLoad() {
      alert("JavaScript は有効");
    }
    </script>

    このコードを入れて alert が出なければ、そもそも JavaScript が動いていないので、この場合には対処が異なってきます。

    あと、参考までに AjaxControlToolkit.dll のバージョンはいくつですか?
    2010年7月28日 12:04
  • totojoさん ありがとうございます。

     

    下記のコードでJavaScript確認できました。 【JavaScriptは有効】と表示されました。

    <script type="text/javascript">
    function pageLoad() {
      alert("JavaScript は有効");
    }
    </script>

     

    先週、下記のサイトからAjaxControlToolkit.Binary.NET35.zipダウンロードしました。

    Version 40412とサイトに記載がありました。

    http://ajaxcontroltoolkit.codeplex.com/releases/view/43475

     

    2010年7月28日 14:49

  • あかん さんに返信

    > 下記のコードでJavaScript確認できました。 【JavaScriptは有効】と表示されました。
    > 先週、下記のサイトからAjaxControlToolkit.Binary.NET35.zipをダウンロードしました。

    動作環境は問題なさそうですね。
    何が原因でカレンダーが表示されないのかとても気になります。
    記述されているコードを丸ごとお教えいただくわけにはいかないでしょうか。
    2010年7月28日 21:04
  • 先週、下記のサイトからAjaxControlToolkit.Binary.NET35.zipダウンロードしました。

    Version 40412とサイトに記載がありました。

    http://ajaxcontroltoolkit.codeplex.com/releases/view/43475

     


    さらに確認をしたいのですが、プロジェクトの対象フレームワークは .NET Framework 3.5 でしょうか?
    .NET Framework 4 が対象の場合なら AjaxControlToolkit.Binary.NET4.zip の方を使うべきです。

    また、ダウンロード ページに注釈として次のように記述されています。

     - Pages using controls from AJAX Control Tookit .NET 3.5 must use the ToolkitScriptManager, rather than the ASP.NET ScriptManager.

    この点については正しく指定されていますでしょうか?

    軽く手元で試したのですが、

     ・対象フレームワークを .NET Framework 4 にする
     ・AjaxControlToolkit.dll は 3.5 を使う(AjaxControlToolkit.Binary.NET35.zip
     ・ToolkitScriptManager ではなく、ScriptManager を使う

    とすると、同じように Extender が動かない状態にはなりました。ただ、クライアント側のスクリプト エラーは発生していますけれども。
    • 回答としてマーク 山本春海 2010年7月30日 5:16
    2010年7月29日 1:18

  • totojo さんに返信

    > .NET Framework 4 が対象の場合なら AjaxControlToolkit.Binary.NET4.zip の方を使うべきです。

    げふ、気づきませんでした。
    2010年7月29日 3:09
  • totojo さん もりおさん  ありがとうございます。

    > .NET Framework 4 が対象の場合なら AjaxControlToolkit.Binary.NET4.zip の方を使うべきです。

    AjaxControlToolkit.Binary.NET4.zipをダウンロードしたところ、無事使えるようになりました。

     

    この度は、いろいろとアドバイスをいただき、本当にありがとうございました。

    大変、勉強になりました。

    2010年7月29日 10:43
  • こんにちは、あかん さん。

    MSDN フォーラムをご利用いただき、ありがとうございます。フォーラム オペレーターの 山本です。

    解決されたようで、よかったですね。
    アドバイスくださった回答者のみなさんもありがとうございました。

    フォーラムでは、今後同じ問題でこのスレッドを参照された方のためにも、有効な情報が目にとまりやすくなり、情報の有効活用ができるかと思いますので、解決策や参考になった情報などには、回答としてマークすることをお願いしています。
    今回は私のほうで回答としてマークさせていただきましたが、次回は あかん さんも回答としてマークしてみてくださいね。

    今後とも MSDN フォーラムのご利用をよろしくお願いいたしますね。それでは。
                                                         
    マイクロソフト株式会社 フォーラム オペレーター 山本 春海

    2010年7月30日 5:18