none
請問 CssClass="date" 如何觸發 jQuery UI Datepicker? RRS feed

  • 問題

  • 請問 CssClass="date" 如何觸發 jQuery UI Datepicker?

    https://jqueryui.com/datepicker/
    但參考官方範例,使用的 Control 必須另外有一段相對應的 JavaScript去指名哪一個 ID (TextBox1) 去執行 datepicker()
    ,這樣每一個 ID 要寫一小段 JavaScript

      $( function() {
        $( "#TextBox1" ).datepicker();
      } );
      </script>

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

    ***************

    小弟知道有人使用 

    <asp:TextBox ID="TextBox_MyDate" runat="server"></asp:TextBox>
    改為
    <asp:TextBox ID="TextBox_MyDate" runat="server" CssClass="date"></asp:TextBox>

    就可以使用 jquery ui datepicker

    ***************

    不知 CssClass="date" 是如何讓該 Control 就可以叫出月曆?

    謝謝 ~


    ******************** 孔子說:問有三種 不懂則問; 雖懂而有疑惑則問; 雖懂而想更了解則問; ********************

    2017年7月7日 上午 07:37

解答

  • 應該是說 jquery 取得元素有用

    用 id 就像是 $('#TextBox')

    用 class 就像是 $('.date')

    所以你應該這樣就好了,試試看。 記得該引入的 js 、css 都要引入。

    <script> 

    $( function() {
        $( ".date" ).datepicker();
      } );
      </script>

    <asp:TextBox ID="TextBox_MyDate" runat="server" class="date"></asp:TextBox>




    2017年7月7日 上午 09:00
  • 你 jQuery 要在 jQuery ui 之前引入。






    2017年7月7日 上午 10:43

所有回覆

  • 應該是說 jquery 取得元素有用

    用 id 就像是 $('#TextBox')

    用 class 就像是 $('.date')

    所以你應該這樣就好了,試試看。 記得該引入的 js 、css 都要引入。

    <script> 

    $( function() {
        $( ".date" ).datepicker();
      } );
      </script>

    <asp:TextBox ID="TextBox_MyDate" runat="server" class="date"></asp:TextBox>




    2017年7月7日 上午 09:00
  • 不行耶,請教哪裡錯誤?

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication4.Default" %>

    <!DOCTYPE html>

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title></title>
        <script src="Scripts/jquery-ui-1.12.1.js"></script>
        <script src="Scripts/jquery-1.12.4.js"></script>
        <link href="Content/themes/base/jquery-ui.css" rel="stylesheet" />
        <script> 

            $(function () {
                $(".date").datepicker();
            });
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
            <div>
                <asp:TextBox ID="TextBox1" runat="server" CssClass="date"></asp:TextBox>
            </div>
        </form>
    </body>
    </html>


    ******************** 孔子說:問有三種 不懂則問; 雖懂而有疑惑則問; 雖懂而想更了解則問; ********************

    2017年7月7日 上午 10:38
  • 你 jQuery 要在 jQuery ui 之前引入。






    2017年7月7日 上午 10:43
  • 成功了,感謝 :)

    ******************** 孔子說:問有三種 不懂則問; 雖懂而有疑惑則問; 雖懂而想更了解則問; ********************

    2017年7月7日 上午 11:08