jQuery的DatePicker的不工作的母版 [英] jQuery DatePicker not working with Masterpage
问题描述
这是从<一个跟进的问题href=\"http://stackoverflow.com/questions/23785806/asp-net-with-jquery-datepicker/23786022?noredirect=1#23786022\">ASP.NET使用jQuery的DatePicker
我尝试使用jQuery UI的DatePicker的在这个页面上提示：的http://www.aspsnippets.com/Articles/jQuery-UI-DatePicker-Calendar-Example-in-ASPNet.aspx
I tried to use the jQuery UI DatePicker as suggested in this page: http://www.aspsnippets.com/Articles/jQuery-UI-DatePicker-Calendar-Example-in-ASPNet.aspx
当我在测试codeS单表单，它的工作原理就像一个魅力。
When I tested the codes in a SINGLE webform, it works like a charm.
然而，当我试图用母版和 Contentpage 将其纳入，我似乎无法使日历再次合作。
However, when I tried to incorporate them with Masterpage and Contentpage, I can't seem to make the calender working again.
这是我迄今为止尝试：
在母版，我添加了脚本SCR 和链接在头：
<head runat="server">
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title><%: Page.Title %> - My ASP.NET Application</title>
<asp:PlaceHolder runat="server">
<%: Scripts.Render("~/bundles/modernizr") %>
</asp:PlaceHolder>
<webopt:bundlereference runat="server" path="~/Content/css" />
<link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
<%--added below--%>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js" type="text/javascript"></script>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="Stylesheet" type="text/css" />
</head>
下面是我的codeS中的一部分 Contentpage
Here is part of my codes in the Contentpage
<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Test2._Default" %>
<asp:Content ID="BodyContent" ContentPlaceHolderID="MainContent" runat="server">
<script type="text/javascript">
$(function () {
$("[id$=txtDate]").datepicker({
showOn: 'button',
});
});
</script>
<asp:TextBox ID="txtDate" runat="server" ReadOnly="true" Width="250px"></asp:TextBox>
究竟有我错过了什么？
推荐答案
当您使用母版页，这与 =服务器指定的各个控制不会真的有你给它分配的ID。你可以看到它有ID，如果你查看生成的页面的源代码。
When you use master pages, each control that is specified with runat="server" will not actually have the ID you assign it. You can see the ID it has if you view the generated page source.
要获得实际的ID，试试这样做：
To get the actual ID, try doing this:
<script type="text/javascript">
$(document).ready(function () {
$("#<%= txtDate.ClientID %>").datepicker({
showOn: 'button',
});
});
</script>
<asp:TextBox ID="txtDate" runat="server" ReadOnly="true" Width="250px"></asp:TextBox>
如果你使用的UpdatePanel和你保持看到你的控制越来越绑定，更换 $（文件）。就绪（函数（）{...}）; 与功能页面加载（）{...} 。
If you're using UpdatePanels and you keep seeing your control getting unbound, replace $(document).ready(function (){ ... }); with function pageLoad() { ... }.
确认的JavaScript是在你的内容/ body标签的结束为好。这将确保它得到的所有页面控件后，最后加载。
Make sure the JavaScript is at the end of your content/body tag as well. This will ensure it gets loaded last after all the page controls.
因此，它应该是这样
So it should be something like
// all my page content ...
<script type="text/javascript">
//sweet JS
</script>
</asp:Content>
这篇关于jQuery的DatePicker的不工作的母版的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
