Jquery datetime picker not working with the masterpage
the jquery datepicker is not work in usercontrol through the masterpage....struggling a lot.....
masterpage
<%@ Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage.master.cs" Inherits="MasterPage" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<!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>Master Page</title>
<link href="App_Themes/LMSTheme/Style.css" rel="stylesheet" type="text/css" />
<link type="text/css" rel="stylesheet" href="../App_Themes/LMSTheme/jquery-ui-1.8.16.custom.css" />
<script type="text/javascript" src="../Scripts/jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="../Scripts/jquery-ui-1.8.16.custom.min.js"></script>
<script src="Scripts/ui.datepicker.js" type="text/javascript"></script>
<style>.Hide{ display:none;}</style>
</head>
<body>
<form id="form1" runat="server">
<div class="divcontent">
<table width="100%">
<tr height="400px" valign="top">
<td width="10px">
</td>
<td>
<asp:ContentPlaceHolder ID="WorkArea" runat="server">
</asp:ContentPlaceHolder>
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
This is my usercontrol:
<%@ Control Language="C#" AutoEventWireup="true" CodeFile="HRApproveSwipeLeave.ascx.cs"
Inherits="HRApproveSwipeLeave" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<link type="text/css" rel="stylesheet" href="../App_Themes/LMSTheme/jquery-ui-1.8.16.custom.css" />
<script type="text/javascript" src="../Scripts/jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="../Scripts/jquery-ui-1.8.16.custom.min.js"></script>
<sc开发者_如何学JAVAript src="../../Scripts/ui.datepicker.js" type="text/javascript"></script>
<script language="javascript" type="text/javascript">
$(document).ready(function() {
$('#txtDate').datepicker({changeMonth: true,
changeYear: true});
});
</script>
<div class="demo">
<asp:TextBox ID="txtDate" runat="server"></asp:TextBox>
</div>
This is the aspx while i call thourgh the master page.....
<%@ Page Language="C#" AutoEventWireup="true" Theme="LMSSkinFile" MasterPageFile="~/MasterPage.master" CodeFile="HRApprovSwipeLeave.aspx.cs" Inherits="HRApprovSwipeLeave" Title="ApproveSwipeLeave"%>
<%@ Register Src="UserControl/HRApproveSwipeLeave.ascx" TagName="HRApproveSwipeLeave" TagPrefix="LMS" %>
<asp:Content ID="LMS_HRApproveSwipeLeave" ContentPlaceHolderID="WorkArea" runat="Server">
<asp:UpdatePanel ID="UpdatePanel" runat="server" UpdateMode="Conditional">
<contenttemplate>
<table>
<tr>
<td class="BoldCopy">
<asp:Label ID="WelcomeUserName" runat="server" Visible="false"></asp:Label>
</td>
</tr>
</table>
<table>
<tr>
<td>
<asp:Label ID="ApproveSwipeLeave" Font-Bold=true ForeColor=red runat="server"></asp:Label>
</td>
</tr>
<tr>
<td>
<LMS:HRApproveSwipeLeave ID="LMSHRApproveSwipeLeave" runat="server" />
</td>
</tr>
</table>
</contenttemplate>
</asp:UpdatePanel>
</asp:Content>
Note:the jquery time picker when i run through the user control it is not firing at all..if i create a sample aspx and do it is working....i do no where to change the code either in the masterpage or ascx or aspx..for your reference i have send the three.please help to resolve...i am digging a lot with this.....
code below is working for me.
Master Page
<head runat="server">
<%--JQUERY--%>
<link rel = "Stylesheet" href ="../jquery-ui-1.8.13.custom/development-bundle/demos/demos.css" />
<link rel = "Stylesheet" href ="../jquery-ui-1.8.13.custom/development-bundle/themes/base/jquery.ui.all.css" />
<script language="javascript" src="script.js"> </script>
<script src="../Scripts/jquery-1.6.1.js" type="text/javascript"></script>
<script src="../Scripts/jquery-ui-1.8.13.custom.min.js" type="text/javascript"></script>
<%--JQUERY--%>
Client Page
<asp:Content ID="Content1" ContentPlaceHolderID="maincontent" Runat="Server">
<script type ="text/javascript">
$(function () {
$("#<%= txtDate.ClientID %>").datepicker();
});
</script>
<div id ="divname">
<asp:TextBox ID = "txtDate" runat ="server"></asp:TextBox>
</div>
</asp:Content>
The reason it's not working is because your control's generated ID is probably not #txtDate. If you want it to remain that, set it's ClientIDMode property to Static. Otherwise, use a different jquery selector.
加载中,请稍侯......
精彩评论