ASP.NET & jQuery Calendar - Does not Work

Question

I've got a test page put together to display a jQuery Calendar.

It seems like I have created everything correctly, but the Calendar control does not show.

Does anyone see anything wrong with my example below?

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TestjQuery.aspx.cs" Inherits="AcpSheetMetal.TestjQuery" %>
<!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>jQuery Calendar Test</title>
  <link rel="Stylesheet" type="text/css" href="Styles/jquery.ui.datepicker.css" />
  <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript" />
  <script src="Scripts/jquery.ui.datepicker.js" type="text/javascript" />
  <script type="text/javascript">
    $(function () {
      alert("Select Dates and Run Search.");
      $("#txtStartDate").datepicker();
      $("#txtEndDate").datepicker();
    });
  </script>
</head>
<body>
  <form id="form1" runat="server">
  <div>
  <table style="height:100%;width:100%">
    <tr>
      <td style="width:20%;">
        <asp:Label ID="lblStartDate" runat="server" Text="[Start Date]" /><br />
        <asp:TextBox ID="txtStartDate" runat="server" ClientIDMode="Static"></asp:TextBox>
      </td>
      <td style="width:20%;">
        <asp:Label ID="lblEndDate" runat="server" Text="[End Date]" /><br />
        <asp:TextBox ID="txtEndDate" runat="server" ClientIDMode="Static"></asp:TextBox>
      </td>
      <td style="text-align:left;">
        Run Search:<br />
        <asp:Button ID="btnSubmit" runat="server" Text="Submit" />
      </td>
    </tr>
  </table>
  </div>
  </form>
</body>
</html>

Oh, and the `alert("Select Dates and Run Search.");` line is never called, either. — , Nov 07 '11 at 16:08

score 4 · Accepted Answer · edited May 23 '17 at 11:55

4

It's probably the self closing script tags causing the problem -

<script src="Scripts/jquery-1.4.1.min.js" type="text/javascript" />

try using this pattern instead for all the script tags

<script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>

See this question for further info - Why don't self-closing script tags work?

edited May 23 '17 at 11:55

Community

1
1

answered Nov 07 '11 at 16:10

ipr101

24,096
8
59
61

+1 Ha, sorry for the dup link, didn't see you had it already. – rick schott Nov 07 '11 at 16:16
Bingo! Thank you! I can accept this answer in 3 more minutes. Thanks to everyone else for pitching in, too! Everyone gets a +1, because that's the way I roll. ;) – Nov 07 '11 at 16:18

score 1 · Answer 2 · answered Nov 07 '11 at 16:10

1

Because you said the alert does not fire I would say that the path Scripts/jquery-1.4.1.min.js could be wrong.

Are you sure this points to your javascript file?

answered Nov 07 '11 at 16:10

Matt

3,664
3
33
39

score 1 · Answer 3 · edited May 23 '17 at 10:24

Make sure your paths are correct and close your JavaScript tags:

  <link rel="Stylesheet" type="text/css" href='<%= Page.UrlResolve("~/Styles/jquery.ui.datepicker.css" %>' />
  <script src='<%= Page.UrlResolve("~/Scripts/jquery-1.4.1.min.js" %>'  type="text/javascript"></script>
  <script src='<%= Page.UrlResolve("~/Scripts/jquery.ui.datepicker.js" %>'  type="text/javascript"></script>

Why don't self-closing script tags work?

ASP.NET & jQuery Calendar - Does not Work

3 Answers3