0

http://www.eyecon.ro/datepicker/#download/datepicker.zipで入手できる既製のカレンダー コントロールを使用しています。

日付ピッカーのオブジェクトはすぐに提供されます。

カレンダーコントロールがテキストボックスに添付されていることを示す1つの例がありますが、私の問題はHTMLテキストボックスで正常に動作することですが、ASPで実行しようとするとasp:textboxに添付されません.

私のコードは次のとおりです。

<head runat="server">
     <title></title>
     <link rel="stylesheet" media="screen" type="text/css" href="DatePicker/cssdatepicker.css" />
     <script type="text/javascript" src="DatePicker/js/datepicker.js"></script>
     <script type="text/javascript">


        $('#TextBox1').DatePicker({
            flat: true,
            date: '2008-07-31',
            current: '2008-07-31',
            calendars: 1,
            starts: 1
        });

  </script>
  </head> 
<body>
     <form id="form1" runat="server">
     <div>

         <asp:TextBox ID="TextBox1" runat="server">   </asp:TextBox>
    </div>
    </form>
</body>
4

4 に答える 4

0

回避策。この日付ピッカーは、フォームに入力フィールドが存在するのが好きなようです。奇妙です。そこで、ちょっとしたトリックを実行しました。IDとクラスを使用してダミーの入力ボックスを作成し、cssを介して非表示にして、テキストボックスを作成します。日付ピッカーに取り付けられています。このように強制されたときになぜ機能しなければならないのか、まだ説明がありません。テキストボックスが入力ボックスとしてレンダリングされるため、デフォルトで機能するはずです。それを理解するための宿題...

   <link rel="stylesheet" media="screen" type="text/css" href="css/datepicker.css" />
   <script type="text/javascript" src="js/jquery.js"></script>
   <script type="text/javascript" src="js/datepicker.js"></script>
   <script type="text/javascript" src="js/eye.js"></script>
   <script type="text/javascript" src="js/utils.js"></script>
   <script type="text/javascript" src="js/layout.js?ver=1.0.2"></script>



        $('.inputDate').DatePicker({
            format: 'm/d/Y',
            date: $('.inputDate').val(),
            current: $('.inputDate').val(),
            starts: 1,
            position: 'r',
            onBeforeShow: function () {
                $('.inputDate').DatePickerSetDate($('.inputDate').val(), true);
            },
            onChange: function (formated, dates) {
                $('.inputDate').val(formated);
                if ($('#closeOnSelect input').attr('checked')) {
                    $('.inputDate').DatePickerHide();
                }
            }
        });




 <form id="form1" runat="server">
 <div>
     <input id="inputDate2" class="inputDate" type="text" value="06/14/2008"   style="display:none" />
     <asp:TextBox  ID="inputDate" runat="server" CssClass="inputDate" Text="06/14/2008" >   </asp:TextBox>
 <label id="closeOnSelect"><input type="checkbox" /> Close on selection</label>
</div>
    </form>

ここに画像の説明を入力してください

于 2013-01-29T10:44:35.857 に答える
0

Scripts タグを HTML 要素の下に移動してみてください。$(function(){ ... });また、スクリプトの前後に a を追加します。jQuery .ready()でこれを読んでください

.ready() に渡されたハンドラーは、DOM の準備が整った後に実行されることが保証されているため、これは通常、他のすべてのイベント ハンドラーをアタッチして他の jQuery コードを実行するのに最適な場所です。

次に、 を使用<%=(TextBox1.ClientID)%>して、常に正しい ID を取得していることを確認します。これはプロジェクトに大きな違いをもたらすことはありませんが、知っておくとよいでしょう。

また、プラグインと互換性のあるプラグインの前に、 jQuery のバージョンを含めていることを確認してください。

<head runat="server">
     <title></title>
     <link rel="stylesheet" media="screen" type="text/css" href="DatePicker/cssdatepicker.css" />     
  </head> 
<body>
     <form id="form1" runat="server">
     <div>

         <asp:TextBox ID="TextBox1" runat="server">   </asp:TextBox>
    </div>

<script type="text/javascript" src="{PATH TO YOUR jQuery file}"></script>
<script type="text/javascript" src="DatePicker/js/datepicker.js"></script>
     <script type="text/javascript">

     $(function(){

        $('#<%=(TextBox1.ClientID)%>').DatePicker({
            flat: true,
            date: '2008-07-31',
            current: '2008-07-31',
            calendars: 1,
            starts: 1
        });
     });

  </script>

    </form>

</body>
于 2013-01-29T10:27:51.953 に答える
-1

コードによると、jqueryファイルが含まれていないようです。

于 2013-01-29T09:54:25.407 に答える
-1

以下のコードを使用してみてください

 $("#MainContent_txtCopyrightYear").datepicker({
                dateFormat: 'yy',
                changeMonth: true,
                changeYear: true,
                showOn: 'button',
                readonly: 'true',
                buttonImage: 'References/Images/calendar.gif',
                buttonImageOnly: true
            });

あなたがしなければならないことは、ブラウザでページのソースに移動し、その ID を見つけて、MainContent_txtCopyrightYear をその ID に置き換えるだけです。

于 2013-01-29T09:15:51.137 に答える