3

我有一个带有日历的 ac# web 应用程序 - 没什么特别的。我遇到的问题是只能点击数字而不是整个单元格。我添加了一个 onmouseover 类型的处理程序，它使单元格在鼠标悬停时改变颜色，但这会产生误导，因为您不能单击边缘。

在asp.net c#中有什么方法可以让这个日历允许整个单元格可以点击，而不仅仅是日期的超文本编号？我希望我已经解释得足够好。

谢谢

<asp:Calendar ID="Calendar1" runat="server"
DayStyle-ForeColor="DarkBlue" 
DayHeaderStyle-BackColor="#FEF6CB" 
DayStyle-Height="25"
SelectedDayStyle-BackColor="#003F7D" 
SelectedDayStyle-ForeColor="White"
DayNameFormat="FirstLetter" 
ShowGridLines="true" 
BorderColor="Black"
TitleStyle-BackColor="#003F7D" 
TitleStyle-ForeColor="White" 
TitleStyle-CssClass="CalHeader"
NextPrevStyle-CssClass="CalNextPrev" 
NextPrevStyle-ForeColor="White"
OnVisibleMonthChanged="cal_ReserveDate_VisibleMonthChanged"
OnDayRender="cal_ReserveDate_DayRender" 
OnSelectionChanged="cal_ReserveDate_SelectionChanged"
DayStyle-BorderColor="Black" 
SelectedDayStyle-CssClass="CalendarSelectedDay" 
Width="97%" />

更新：
这是 ascx 页面的基本框架：

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="BuyTourProductDialogGalaxy2.ascx.cs" Inherits="ConLib_Custom_BuyTourProductDialog2" %>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

<script>
    function fixCalendar() {
        var a = $('#<%=cal_ReserveDate.ClientID%> a ');
        a.contents().wrap("<div/>");
    }

</script>

<asp:UpdatePanel ID="upnl_Cal" runat="server" ChildrenAsTriggers="true" UpdateMode="Always">
    <ContentTemplate>
        <div class="BuyTourProductDialog">
            <table cellpadding="0" cellspacing="0" border="0" width="100%">
                <tr>
                    <td colspan="2" width="75%">
                        <asp:Label ID="lblInstructions" runat="server" Text="" EnableViewState="False" CssClass="ReservationInstructions" />
                    </td>
                    <td width="25%">
                        <span style="float: right;">
                            <asp:Button ID="btn_Reset" runat="server" Text="Reset" OnClick="btn_Reset_Click" Visible="false" CssClass="ResetButton" />
                            <asp:Button ID="btn_Reserve" runat="server" Text="Reserve" OnClick="btn_Reserve_Click" Visible="true" />
                            <asp:Button ID="btn_AddToCart" runat="server" Text="Add To Cart" Visible="false" OnClick="btn_AddToCart_Click" />
                            <asp:Button ID="btn_Continue" runat="server" Text="Continue" Visible="false" OnClick="btn_Continue_Click" />
                        </span>
                    </td>
                </tr>
            </table>

            <%-- Calendar Panel --%>
            <asp:Panel ID="pnl_GatewayCalendar" runat="server" Visible="false">              
                <table width="100%">
                    <%-- Header --%>        
                    <tr>
                        <td align="center" colspan="2">
                            <asp:Label ID="lbl_SelectedDate" runat="server" Font-Bold="true" CssClass="SelectedDate" /><br />
                        </td>
                    </tr>
                    <tr>
                        <%-- Calendar side --%>
                        <td width="50%" valign="top">
                            <asp:Calendar ID="cal_ReserveDate" runat="server"
                                DayStyle-ForeColor="DarkBlue" DayHeaderStyle-BackColor="#FEF6CB" DayStyle-Height="25"
                                SelectedDayStyle-BackColor="#003F7D" SelectedDayStyle-ForeColor="White"
                                DayNameFormat="FirstLetter" ShowGridLines="true" BorderColor="Black"
                                TitleStyle-BackColor="#003F7D" TitleStyle-ForeColor="White" TitleStyle-CssClass="CalHeader"
                                NextPrevStyle-CssClass="CalNextPrev" NextPrevStyle-ForeColor="White"
                                OnVisibleMonthChanged="cal_ReserveDate_VisibleMonthChanged"
                                OnDayRender="cal_ReserveDate_DayRender" OnSelectionChanged="cal_ReserveDate_SelectionChanged"
                                DayStyle-BorderColor="Black" SelectedDayStyle-CssClass="CalendarSelectedDay" Width="97%" />
                        </td>

                        <%-- Event Times side --%>
                        <td valign="top">

                               <%-- Another section here for tour times. --%>

                        </td>
                    </tr>
                </table>
            </asp:Panel>
        </div>
    </ContentTemplate>
</asp:UpdatePanel>
4

3 回答 3

2

日历控件不允许您使整个单元格可点击，但如果您不介意使用它，您可以使用一点 jQuery 来强制它。

就是这样：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"> </script>
<script>
$(function () {
    var a = $('#<%=Calendar1.ClientID%> a');
    //wrap the anchor text in a div to force the link to  expand
     a.contents().wrap("<div/>");      
 });
 </script>

您需要做的就是参考 jQuery

更新：UpdatePanel 的版本

将以下内容放在页面顶部：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
    function fixCalendar() {
        var a = $('#<%=cal_ReserveDate.ClientID%> a ');
        a.contents().wrap("<div/>");
    }

</script>

<asp:ScriptManager ID="scriptManager" runat="server"></asp:ScriptManager>
    <asp:UpdatePanel ID="updatePanel" runat="server">
        <ContentTemplate>
            <asp:Calendar ID="cal_ReserveDate" runat="server"
             ... //etc
                Width="97%" />
        </ContentTemplate>
    </asp:UpdatePanel>

现在，在 Page_Load 上，您需要始终这样调用上述脚本：

 protected void Page_Load(object sender, EventArgs e)
 {
    ScriptManager.RegisterStartupScript(this, this.GetType(), "key", "fixCalendar();", true);
 }
于 2013-07-30T18:46:01.060 回答
-1

把它放在默认页面的正文中

<body>
    <form id="form1" runat="server">
        <table title="mxit:table:full" style="width: 100%;" align="center">
            <tr style="background-color: red; text-align: center;">
                <td style="width: 25%;">
                    <a href="Default.aspx?id=prev">&lt; Prev</a>
                </td>
                <td style="width: 50%;">
                    <asp:Label ID="lblMonth" runat="server"></asp:Label>&nbsp;&nbsp;
                    <asp:Label ID="lblYear" runat="server"></asp:Label>
                    <br />
                </td>
                <td style="width: 25%">
                    <a href="Default.aspx?id=next">Next &gt;</a>
                </td>
            </tr>
        </table>
        <asp:Label ID="lbltest" runat="server" Text=""></asp:Label>
    </form>
</body>

把它放在 Default.aspx.cs 后面的代码中

  using System;
  using System.Collections.Generic;
  using System.Globalization;
  using System.Linq;
  using System.Web;
  using System.Web.UI;
  using System.Web.UI.WebControls;

  public partial class _Default : System.Web.UI.Page
  {
      protected void Page_Load(object sender, EventArgs e)
      {
          if (!IsPostBack)
          {
              try
              {
                  if (Request.QueryString["id"] == "next")
                  {
                      if ((int)Session["currentMonth"] >= 12)
                      {
                          Session["currentMonth"] = 1;
                          Session["currentYear"] = (int)Session["currentYear"] + 1;
                      }
                      else
                      {
                          Session["currentMonth"] = (int)Session["currentMonth"] + 1;
                      }
                      DateTime dt = new DateTime((int)Session["currentYear"], (int)(Session["currentMonth"]), 1);
                      string obj = dt.DayOfWeek.ToString();
                      GetCalender(obj);
                  }
                  else if (Request.QueryString["id"] == "prev")
                  {
                      if ((int)Session["currentMonth"] <= 1)
                      {
                          Session["currentMonth"] = 12;
                          Session["currentYear"] = (int)Session["currentYear"] - 1;
                      }
                      else
                      {
                          Session["currentMonth"] = (int)Session["currentMonth"] - 1;
                      }
                      DateTime dt = new DateTime((int)Session["currentYear"], (int)(Session["currentMonth"]), 1);
                      string obj = dt.DayOfWeek.ToString();
                      GetCalender(obj);
                  }
                  else //this will run when we start the project
                  {
                      int currentYear = DateTime.Now.Year;
                      int currentMonth = DateTime.Now.Month;
                      Session["currentMonth"] = currentMonth;
                      Session["currentYear"] = currentYear;
                      DateTime dt = new DateTime((int)Session["currentYear"], (int)(Session["currentMonth"]), 1);
                      string obj = dt.DayOfWeek.ToString();
                      GetCalender(obj);
                  }
              }
              catch
              {
                  Response.Redirect("Default.aspx");
              }
          }
      }

      private void GetCalender(string obj)
      {
          try
          {
              string[] months = new string[] {"January", "February", "March", "April", "May",
    "June", "July", "August", "September", "October", "November", "December"};
              DayOfWeek objDayofweek = DateTime.Today.Date.DayOfWeek;
              lbltest.Text = "<table style='width:100%' align='center'><colgroup span='7' style='width:15%'></colgroup><tr><td>Mon</td>";
              lbltest.Text = lbltest.Text + "<td>Tue</td>";
              lbltest.Text = lbltest.Text + "<td>Wed</td>";
              lbltest.Text = lbltest.Text + "<td>Thu</td>";
              lbltest.Text = lbltest.Text + "<td>Fri</td>";
              lbltest.Text = lbltest.Text + "<td>Sat</td>";
              lbltest.Text = lbltest.Text + "<td>Sun</td></tr><tr>";
              int y = 1;
              switch (obj.ToString())
              {
                  case "Monday":
                      y = 1;
                      break;
                  case "Tuesday":
                      lbltest.Text = lbltest.Text + "<td>&nbsp</td>";
                      y = 2;
                      break;
                  case "Wednesday":
                      lbltest.Text = lbltest.Text + "<td>&nbsp</td>";
                      lbltest.Text = lbltest.Text + "<td>&nbsp</td>";
                      y = 3;
                      break;
                  case "Thursday":
                      lbltest.Text = lbltest.Text + "<td>&nbsp</td>";
                      lbltest.Text = lbltest.Text + "<td>&nbsp</td>";
                      lbltest.Text = lbltest.Text + "<td>&nbsp</td>";
                      y = 4;
                      break;
                  case "Friday":
                      lbltest.Text = lbltest.Text + "<td>&nbsp</td>";
                      lbltest.Text = lbltest.Text + "<td>&nbsp</td>";
                      lbltest.Text = lbltest.Text + "<td>&nbsp</td>";
                      lbltest.Text = lbltest.Text + "<td>&nbsp</td>";
                      y = 5;
                      break;
                  case "Saturday":
                      lbltest.Text = lbltest.Text + "<td>&nbsp</td>";
                      lbltest.Text = lbltest.Text + "<td>&nbsp</td>";
                      lbltest.Text = lbltest.Text + "<td>&nbsp</td>";
                      lbltest.Text = lbltest.Text + "<td>&nbsp</td>";
                      lbltest.Text = lbltest.Text + "<td>&nbsp</td>";
                      y = 6;
                      break;
                  case "Sunday":
                      lbltest.Text = lbltest.Text + "<td>&nbsp</td>";
                      lbltest.Text = lbltest.Text + "<td>&nbsp</td>";
                      lbltest.Text = lbltest.Text + "<td>&nbsp</td>";
                      lbltest.Text = lbltest.Text + "<td>&nbsp</td>";
                      lbltest.Text = lbltest.Text + "<td>&nbsp</td>";
                      lbltest.Text = lbltest.Text + "<td>&nbsp</td>";
                      y = 7;
                      break;
              }
              for (int dayday = Convert.ToInt32(objDayofweek); dayday <= DateTime.DaysInMonth((int)Session["currentYear"], (int)(Session["currentMonth"])); dayday++)
              {
                  if (y < 7)
                  {
                      lbltest.Text = lbltest.Text + "<td><a href='#Date=" + dayday.ToString() + "/" + Session["currentMonth"] + "/" + Session["currentYear"] + "'>" + dayday.ToString() + "</a></td>";
                      y++;
                  }
                  else
                  {
                      lbltest.Text = lbltest.Text + "<td><a href='#Date=" + dayday.ToString() + "/" + Session["currentMonth"] + "/" + Session["currentYear"] + "'>" + dayday.ToString() + "</a></td>";
                      y = 1;
                      lbltest.Text = lbltest.Text + "</tr><tr>";
                  }
              }
              lbltest.Text = lbltest.Text + "</tr></table>";
              lblMonth.Text = months[(int)Session["currentMonth"] - 1].ToString();
              lblYear.Text = Session["currentYear"].ToString();
          }
          catch
          {
              Response.Redirect("Default.aspx");
          }
      }
  }
于 2013-09-30T12:37:32.620 回答