Выбор даты не работает после переключения вкладок

Я использую основной ввод даты ввода на моей странице. На моей странице я использую вкладки Jquery для отображения содержимого. Когда я перехожу на другую вкладку, а затем обратно на страницу с входами выбора даты, календарь не отображается.Выбор даты не работает после переключения вкладок

Вот мой мастер код страницы, где у меня есть вкладки:

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> 
<head runat="server"> 
<title></title> 
<link href="~/Styles/Site.css" rel="stylesheet" type="text/css" /> 
<link href="Styles/jquery-ui-1.10.3.custom.css" rel="stylesheet" type="text/css" /> 

<script src="Scripts/jquery-2.0.3.js" type="text/javascript"></script> 
<script src="Scripts/jquery-ui-1.10.3.js" type="text/javascript"></script> 
<link href="Styles/jquery-ui-1.10.3.custom.css" rel="stylesheet" type="text/css" /> 


<asp:ContentPlaceHolder ID="HeadContent" runat="server"> 
</asp:ContentPlaceHolder> 

<script type="text/javascript"> 

    $(function() { 
     $(".tabs").tabs({ 

         }); 




    }); 



    </script> 
</head> 
<body> 
<form runat="server"> 
<div class="page"> 
    <div class="header"> 
     <div class="title"> 
      <h1> 
       &nbsp;<asp:Image ID="Image1" runat="server" ImageUrl="~/Content/CCLogo.jpg" /> 
      </h1> 
     </div> 
     <div class="loginDisplay"> 
      <asp:LoginView ID="HeadLoginView" runat="server" EnableViewState="false"> 
       <AnonymousTemplate> 
        [ <a href="~/Account/Login.aspx" ID="HeadLoginStatus" runat="server">Log In</a> ] 
       </AnonymousTemplate> 
       <LoggedInTemplate> 
        Welcome <span class="bold"><asp:LoginName ID="HeadLoginName" runat="server" /></span>! 
        [ <asp:LoginStatus ID="HeadLoginStatus" runat="server" LogoutAction="Redirect" LogoutText="Log Out" LogoutPageUrl="~/"/> ] 
       </LoggedInTemplate> 
      </asp:LoginView> 
     </div> 
     <div class="clear hideSkiplink"> 


      <div id="tabs" class="tabs"> 
        <ul> 
        <li><a href="My Audits.aspx">My Audits</a></li> 
        <li><a href="My Claims.aspx">My Claims</a></li> 
        <li><a href="Reports.aspx">Reports</a></li> 
        <li><a href="Maintenance.aspx">Maintenance</a></li> 
        </ul> 

       </div> 
     </div> 
    </div> 
    <div class="main"> 
     <asp:ContentPlaceHolder ID="MainContent" runat="server"/> 
    </div> 
    <div class="clear"> 
    </div> 
</div> 
<div class="footer"> 

</div> 
</form> 
</body> 
</html>

Вот моя страница с датой сборщиков:

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
<title></title> 
<script src="Scripts/jquery-2.0.3.js" type="text/javascript"></script> 
<link href="Styles/jquery-ui-1.10.3.custom.css" rel="stylesheet" type="text/css" /> 
<script src="Scripts/jquery-ui-1.10.3.js" type="text/javascript"></script> 


<script type="text/javascript"> 
$(document).ready(function() { 

    $('.datepicker').datepicker(); 

    $.ajax({ 
     type: "POST", 
     contentType: "application/json; charset=utf-8", 
     data: "{}", 
     url: "WebService1.asmx/GetCompanies", 
     dataType: "json", 
     success: ajaxSucceess, 
     error: ajaxError 
    }); 

    function ajaxSucceess(data) { 

     $.each(data.d, function (index, elem) { 
      $("<option />") 
       .text(elem.CompanyDesc) 
       .val(elem.CompanyCode) 
       .appendTo("#Select1"); 
     }); 
    } 

    function ajaxError(response) { 
     alert(response.status + ' Fail' + response.statusText); 
    } 
    }); 


var count = 0; 
function changeValue() { 

    count += 1; 
    if (count == 1) { 
     var $node = '<tr><td>Index Number:</td><td><input id="inputnumber"/></td></tr>'; 
     $('#MyAuditsSearch').append($node) 
    }; 
} 






</script> 
</head> 
<body> 
<form id="form1" runat="server"> 
<table id="MyAuditsSearch"> 
<tr> 
<td>Date Range: </td> 
<td><input type="text" id ="datepicker" class="datepicker"/></td> 
<td>to</td> 
<td><input type="text" id ="datepicker2" class="datepicker"/></td> 
</tr> 
<tr> 
<td>Audit Program</td> 
<td><select id="Select1" class="select" onchange="changeValue()"><option>---Select------</option> </select></td> 
</tr> 


</table> 

</form> 
</body> 
</html>

источник

2013-09-17 Steven Ackley

Есть ли ошибки в консоли браузера? И вы включаете jquery ui css дважды. – Fals

Ха-ха, вы его исправили. Я даже не думал, что это проблема, но как только я удалил дубликаты, он работал так, как предполагается. благодаря –

Я предлагаю вместо связывания DatePicker на странице загрузки или документа ready just invoke datepicker на событие clickbox в текстовом поле, как показано ниже

<input type="text" id="txtFWCDate" name="txtFWCDate" style="width: 100" onclick="showDatePicker(this);" 
                onblur="Validate_Date(this);" class="txtDatePicker" /> 

function showDatePicker(varCont) { 

     $(varCont).datepick({ dateFormat: 'm/d/yyyy' 
     }); 

     $(varCont).datepick({ dateFormat: 'm/d/yyyy' }).datepick("show"); 
    }

источник

2013-09-17 17:20:17

Выбор даты не работает после переключения вкладок

ответ

Смежные вопросы