2011-02-16 56 views
1

所有,爲什麼Datepicker不起作用?

我有這個頁面,

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

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/base/jquery-ui.css" 
     rel="stylesheet" type="text/css" /> 
    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/blitzer/jquery-ui.css" 
     rel="Stylesheet" type="text/css" /> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js" type="text/javascript"></script> 
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.0/jquery-ui.js" type="text/javascript"></script> 
    <script type="text/javascript"> 


     $(function() { 
      $("#tabs").tabs({ collapsible: true }); 

      $("#tabs").tabs({ event: "mouseover" });  
      $('#datepicker').datepicker({ 
       minDate: "0", 
       changeMonth: true, 
       changeYear: true 

      }); 

     }); 

    </script> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <!-- all tabs --> 
    <div id="tabs" class="ui-tabs ui-widget ui-widget-content ui-corner-all"> 
     <!-- tab definitions --> 
     <ul> 
      <li><a href="#tabs-1" class="dynamic">foo</a></li> 
      <li><a href="#tabs-2">bar</a></li> 
     </ul> 
     <div id="tabs-1" style="width: 100%;"> 
      <div> 
       <p> 
        Date: 
        <input type="text" id="datepicker" /></p> 
      </div> 
     </div> 
     <div id="tabs-2"> 
      <table style="width: 100%;"> 
       <tr valign="top" align="center"> 
        <td style="width: 100%;" colspan="4"> 
         bar 
        </td> 
       </tr> 
      </table> 
     </div> 
    </div> 
    </form> 
</body> 
</html> 

的Tabing工作正常,但沒有日期選擇器

回答

2

當前版本的jQuery UI是1.8.9。只是改變這一行:

<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.js" type="text/javascript"></script> 

在這裏工作:http://jsfiddle.net/9XC67/

2

沒有足夠的信息來知道這是爲什麼壞了。我可以走你,但我將如何調試此..

  • 打開螢火蟲控制檯。有沒有錯誤?
  • 使用螢火蟲看看身體標籤的底部,看看是否存在datapicker hidden div。
  • 如果div存在,使用螢火蟲設置顯示來阻止隱藏。你看到日期選擇器了嗎?切換到不同的選項卡並嘗試此過程。
  • 這可能是因爲在日期選擇器是背後的東西,隱藏在Firebug的所有標籤,並在日期選擇器可見
+1

我要在這裏不同意。他提供了所有必要的標記以證明爲什麼它被打破。我可以將除Page指令外的所有內容複製到一個新的.html文件中並複製他的問題。 – Brandon 2011-02-16 15:51:13

+0

datepicker是visibkle作爲簡單的文本輸入字段..但不作爲calander ..謝謝 – TonyP 2011-02-16 15:51:28

+0

公平不夠,但我無法告訴它爲什麼它被打破了,只是看着它,而我沒有足夠的收入做更多 – mkoryak 2011-02-16 16:03:32

2

你有一個問題,這條線在你的腦袋。刪除它,它似乎工作。

<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/base/jquery-ui.css" 
    rel="stylesheet" type="text/css" /> 

你在拉錯css。將其更改爲1.8.0主題,它將起作用。

或者你可以改變JavaScript引用,如Shane指出的那樣。