2009-05-04 137 views

Respuesta

4

Una opción es utilizar un RangeValidator en el cuadro de texto del calenderextender está enlazado. Es decir, si tiene el TargetID del extensor de calendario establecido en tb1, agregue un rangeValidator para marcar cuando el contenido de tb1 sea anterior a hoy.

Otra opción es usar javascript y aquí es un buen ejemplo: http://www.dotnetcurry.com/ShowArticle.aspx?ID=149 TIP 6.

4

Aquí está mi solución completa al problema que plantea para la restricción de calendario: ¿Qué Me gusta acerca de esta solución es que establece el MinimumValue y MaximumValue de un RangeValidator y no tiene que modificar ningún javascript. Nunca encontré una solución completa que no requiriera volver a compilar el AjaxControlToolkit.dll. Gracias a http://www.karpach.com/ajaxtoolkit-calendar-extender-tweaks.htm por darme la idea de cómo anular los métodos clave en el archivo calendar.js sin tener que recompilar el AjaxControlToolkit.dll. Además, obtuve los errores de javascript "AjaxControlToolkit no está definido", así que los cambié a Sys.Extended.UI. y funciona para mí cuando uso la versión 4.0 del kit de herramientas.

<%--//ADD THIS NEW STYLE TO STYLESHEET TO GRAY OUT DATES THAT AREN'T SELECTABLE--%> 
<style type="text/css"> 
    .ajax__calendar_inactive {color:#dddddd;} 
</style> 

Ya sea en Load o Init o donde sea, establezca los valores mínimos y máximos para su gama de validación:

<script runat="server"> 
    protected override void OnLoad(EventArgs e) 
    { 
     //set the validator min and max values 
     this.valDateMustBeWithinMinMaxRange.MinimumValue = DateTime.Today.Date.ToShortDateString(); 
     this.valDateMustBeWithinMinMaxRange.MaximumValue = DateTime.MaxValue.Date.ToShortDateString(); 
     base.OnLoad(e); 
    } 
</script> 

Añadir esta javascript en algún lugar de su página:

<script type="text/javascript"> 
<%--// ADD DATE RANGE FEATURE JAVASCRIPT TO OVERRIDE CALENDAR.JS--%> 
     var minDate = new Date('<%= valDateMustBeWithinMinMaxRange.MinimumValue %>'); 
     var maxDate = new Date('<%= valDateMustBeWithinMinMaxRange.MaximumValue %>'); 
     Sys.Extended.UI.CalendarBehavior.prototype._button_onblur_original = Sys.Extended.UI.CalendarBehavior.prototype._button_onblur; 
     //override the blur event so calendar doesn't close 
     Sys.Extended.UI.CalendarBehavior.prototype._button_onblur = function (e) { 
      if (!this._selectedDateChanging) { 
       this._button_onblur_original(e); 
      } 
     } 
     Sys.Extended.UI.CalendarBehavior.prototype._cell_onclick_original = Sys.Extended.UI.CalendarBehavior.prototype._cell_onclick; 
     //override the click event 
     Sys.Extended.UI.CalendarBehavior.prototype._cell_onclick = function (e) { 
      var selectedDate = e.target.date; 

      if (selectedDate < minDate || selectedDate > maxDate) { 
       //alert('Do nothing. You can\'t choose that date.'); 
       this._selectedDateChanging = false; 
       return; 
      } 

      this._cell_onclick_original(e); 
     } 

     Sys.Extended.UI.CalendarBehavior.prototype._getCssClass_original = Sys.Extended.UI.CalendarBehavior.prototype._getCssClass; 
     Sys.Extended.UI.CalendarBehavior.prototype._getCssClass = function (date, part) { 

      var selectedDate = date; 

      if (selectedDate < minDate || selectedDate > maxDate) { 
       return "ajax__calendar_inactive"; 
      } 
      this._getCssClass_original(date, part); 
     } 

</script> 

Añadir esta cuadro de texto a su página asp.net con CalendarExtenter y RangeValidator:

<asp:TextBox ID="textBoxDate" runat="server" /> 
<ajaxToolkit:CalendarExtender ID="calendarExtender" runat="server" TargetControlID="textBoxDate" /> 
<asp:RangeValidator ID="valDateMustBeWithinMinMaxRange" runat="server" ControlToValidate="textBoxDate" 
    ErrorMessage="The date you chose is not in accepted range" Type="Date" /> 
<br /> 
<asp:Button ID="Button1" runat="server" Text="Button" /> 
+0

Buena implementación. –

1

Utilizando el kit de herramientas AJAX Calendario Extender en el código HTML:

<asp:TextBox ID="txtDate" runat="server" CssClass="contentfield" Height="16px" MaxLength="12" width="80px" Wrap="False"></asp:TextBox> 
<asp:CalendarExtender ID="CalendarExtender3" runat="server" Enabled="true" StartDate="<%# DateTime.Now %>" EndDate="<%# DateTime.Now.AddDays(1) %>" Format="dd MMM yyyy" PopupButtonID="imgDatePicker" TargetControlID="txtDate"> 
</asp:CalendarExtender> 
<asp:ImageButton ID="imgDatePicker" runat="Server" AlternateText="Click to show calendar" Height="16px" ImageAlign="Middle" ImageUrl="~/images/Calendar_scheduleHS.png" Width="16px" /> 

Por encima se verá que el calendario sólo permite a uno elegir entre hoy o mañana estableciendo

StartDate =" <% # DateTime.Now%>"

y

EndDate = "#% < DateTime.Now.AddDays (1)%>"

Esto también puede hacerse en el servidor utilizando CalendarExtender1.StartDate = DateTime.Now; o CalendarExtender1.EndDate = DateTime.Now.AddDays(1);

0

Sólo tiene que añadir un atributo StartDate = "<% # DateTime.Now%>" en usted ajaxtoolkit control de calendarextender

Cuestiones relacionadas