如何在c#中点击文本框显示日历?

时间:2014-03-19 09:35:39

标签: c# asp.net

  

以下是我试图使用网页控件在其他形式的其他地方使用此代码的代码但是当我要将其拖动到其他表单时它显示错误请看代码并告诉我我去哪里是的,谢谢你。

    <%@ Control Language="C#" AutoEventWireup="true" CodeBehind="calander.ascx.cs" Inherits="Facultymanagement.calander" %>


<%--<%@ Import Namespace="AjaxControlToolkit" %>--%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
<style type="text/css">
/*Calendar Control CSS*/
.cal_Theme1 .ajax__calendar_container   {
background-color: #DEF1F4;
border:solid 1px #77D5F7;
}

.cal_Theme1 .ajax__calendar_header  {
background-color: #ffffff;
margin-bottom: 4px;
}

.cal_Theme1 .ajax__calendar_title,
.cal_Theme1 .ajax__calendar_next,
.cal_Theme1 .ajax__calendar_prev    {
color: #004080;
padding-top: 3px;
}

.cal_Theme1 .ajax__calendar_body    {
background-color: #ffffff;
border: solid 1px #77D5F7;
}

.cal_Theme1 .ajax__calendar_dayname {
text-align:center;
font-weight:bold;
margin-bottom: 4px;
margin-top: 2px;
color: #004080;
}

.cal_Theme1 .ajax__calendar_day {
color: #004080;
text-align:center;
}

.cal_Theme1 .ajax__calendar_hover .ajax__calendar_day,
.cal_Theme1 .ajax__calendar_hover .ajax__calendar_month,
.cal_Theme1 .ajax__calendar_hover .ajax__calendar_year,
.cal_Theme1 .ajax__calendar_active  {
color: #004080;
font-weight: bold;
background-color: #DEF1F4;
}

.cal_Theme1 .ajax__calendar_today   {
font-weight:bold;
}

    .cal_Theme1 .ajax__calendar_other,
    .cal_Theme1 .ajax__calendar_hover .ajax__calendar_today,
    .cal_Theme1 .ajax__calendar_hover .ajax__calendar_title {
    color: #bbbbbb;
    }
    </style>
    </head>
    <body>
    <form id="form1" runat="server">
     <asp:ScriptManager ID="script" runat="server">
     </asp:ScriptManager>
    <div>
    <asp:TextBox  ID="tbEndDate" runat="server" CausesValidation="true" ReadOnly="true" Width="175px" />
    <ajaxToolkit:CalendarExtender ID="CalendarExtender1" runat="server"  TargetControlID="tbEndDate" CssClass= " cal_Theme1" />
    </div>
    </form>
    </body>
    </html>

2 个答案:

答案 0 :(得分:3)

您可以为文本框设置Ajax日历扩展程序..

 <asp:TextBox ID="dtpTransDate" runat="server" Width="90px"></asp:TextBox>
  <asp:CalendarExtender ID="dtpTransDate_CalendarExtender" runat="server" 
  Enabled="True" Format="dd/MM/yyyy" TargetControlID="dtpTransDate">
  </asp:CalendarExtender>

答案 1 :(得分:1)

您也可以使用jQuery解决问题。

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>

<script>
 $(document).ready(function() {
  $("#textboxid").datepicker();
 });
</script>

<asp:TextBox ID="textboxid" runat="server" Width="100px"></asp:TextBox>

如果控件位于母版页的子页面中 然后使用ClientIDMode

<asp:TextBox ID="textboxid" runat="server" Width="100px" ClientIDMode="Static"></asp:TextBox>

检查ClientIDMode

的以下链接

http://msdn.microsoft.com/en-us/library/system.web.ui.control.clientidmode(v=vs.110).aspx

对于jQuery日历检查链接

http://jqueryui.com/datepicker/