简体   繁体   中英

Jquery Date picker Not working in Master Page

In master page

    <%@ Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage.master.cs" Inherits="MasterPage" %>

<!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 id="Head1" runat="server">
<title></title>

<link type="text/css" href="css/ui-lightness/jquery-ui-1.8.19.custom.css" rel="stylesheet" />
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.19.custom.min.js"></script>

<style type="text/css">
.ui-datepicker { font-size:8pt !important}
</style>


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

In content place holder i have tried

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
<script type="text/javascript">
        $(function () {
           $("input[id$='TextBox1']").datepicker();
        });                 
</script>

</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
<table id="tblgv" runat="server">
<td>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
</td>
</table>
</asp:Content>

I have tried in asp page working fine. i don't know why its not working in master page.

This will Work for you...

<script type="text/javascript">
    $(document).ready(function() {
    $("input[id$='TextBox1']").datepicker();
});

</script>

You could also give it a class of something like CssClass="datePicker" and use that to grab it with jQuery:

$(".datePicker").datepicker();

Use Like, In Your Page where Datepicker is Located

Place it at bottom of Page where you Datpicker is located, Put This Jquery

<script src="js/jquery-ui-1.8.16.custom.min.js" type="text/javascript"></script>   
<script src="DATEPICKER.JS" type="text/javascript"></script>   
<script type="text/javascript">
        $(function () {
           $("input[id$='TextBox']").datepicker();
        });                 
</script>

change ur content page code to this, remove datepicker style from master page

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
<style type="text/css">
    .ui-datepicker { font-size:8pt !important}
</style>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
<table id="tblgv" runat="server">
<td>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
</td>
</table>

 <script type="text/javascript">
    `$(function () {
       $("input[id$='TextBox1']").datepicker();
    });                 
</script>
</asp:Content>

if not working!!! please write ur html result from this content in ur browser here

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM