个人中心
gpt4 book ai didi

c# - 切换选项卡后日期选择器不起作用

转载 作者：行者123 更新时间：2023-12-01 05:53:23 25 4
gpt4 key购买 nike

我在页面上使用基本的日期选择器输入。在我的页面上，我使用 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>
</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>

最佳答案

我建议不要在页面加载或文档就绪时绑定(bind)日期选择器，只需在文本框单击事件上调用日期选择器，如下所示

<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");
    }

关于c# - 切换选项卡后日期选择器不起作用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/18855888/

25 4 0
文章推荐： jquery - 删除jquery中@符号后面的文本
文章推荐： Azure 云全面运营管理，无需所有权
文章推荐： 用于选择具有特定成员的组的 LDAP 搜索过滤器
文章推荐： java - 如何为java创建用户表，如asp.net中的aspnet_regsql？
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com