jquery选项卡和telerik以及ajax datepicker

时间:2013-01-21 12:16:05

标签: jquery asp.net ajax tabs datepicker

我正在使用jquery UI选项卡并向其添加telerik datepicker(不想使用jquery datepicker进行样式问题)..我可以在选项卡上看到控件但是当我单击它时,它不会打开并且网址更改为http://localhost/#

我尝试过ajax CalendarExtender,同样的事情发生了。

我没有这样的错误。

我使用的是jquery 1.5.1和jquery-ui-1.8.11.js。

编辑::

主页上的

我有:

    <link href="Content/jquery-ui-1.8.21.custom.css" rel="stylesheet" type="text/css" />
    <link rel="Shortcut Icon" href="favicon.ico" />
    <script src="Scripts/jquery-1.5.1.min.js" type="text/javascript"></script>
    <script src="Scripts/jquery-ui-1.8.11.js" type="text/javascript"></script>
    <script src="Scripts/jquery.qtip-1.0.0-rc3.min.js" type="text/javascript"></script>
    <script src="Scripts/cufon/cufon-yui.js" type="text/javascript"></script>
    <script src="Scripts/cufon/Lubalin_Graph_700.font.js" type="text/javascript"></script>
    <script src="Scripts/jquery.watermark.min.js" type="text/javascript"></script>
    <script src="Scripts/jquery.validator.js" type="text/javascript"></script>
    <script type="text/javascript" src="scripts/jquery.tablesorter.min.js"></script>
    <script src="Scripts/jquery.colorbox.js" type="text/javascript"></script>

我的标签结构是:

        <div id="tabs">
                <ul>
                    <li title=""><a href="FAQs.aspx">FAQ</a></li>
                    <li title=""><a href="Profile.aspx">Profile</a></li>
                    <li title=""><a href="Contact.aspx">Contact</a></li>
        </div>

和jquery是:

    $("#tabs").tabs({
        select: function (event, ui) {
            $(ui.panel).empty();
            $(ui.panel).append("preloader.gif' />");
        },
        cache: false,
        ajaxOptions: { cache: false }
    });

在配置文件aspx页面中我有这个ajax:

 <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox><br />
                        <asp:CalendarExtender ID="CalendarExtender1" runat="server" TargetControlID="TextBox1">
                        </asp:CalendarExtender>

和telerik:

<telerik:RadDatePicker runat="server" ID="date" Width="110px" ></telerik:RadDatePicker>

1 个答案:

答案 0 :(得分:0)

当加载页面的AJAX很重要时,要了解主页面上已经发生了所有加载事件。这意味着包含在加载处理程序中的任何代码或远程页面上的document.ready都会在加载后立即触发,并且不会在任何后续html中加载

如果远程页面中的脚本存在于他们引用的html之前,则会在该html存在之前触发它们。

在脚本之前放置html将解决此问题。

或者,您可以使用标签加载事件进行$.getScript调用

编辑:以下代码来自jQueryUI标签API,每次加载ajax标签时都会触发:

$( "#tabs" ).on( "tabsload", function( event, ui ) {
   var active = $(this).tabs('option','active');
    /* index starts at zero for first tab*/
   if(active==2){
     /* iniitalize datepicker here*/
   }

});