2011-02-17 17 views
13

He decidido comenzar con MVC 3 y me encontré con este problema al intentar rehacer una de mis aplicaciones web a MVC3.Textboxfor mvc3 formato de fecha y validación de fecha

Tengo proyectos de instalación de esta manera:

public class Project 
{ 
    public int  ProjectID  { get; set; } 

    [Required(ErrorMessage="A name is required")] 
    public string Name   { get; set; } 

    [DisplayName("Team")] 
    [Required(ErrorMessage="A team is required")] 
    public int  TeamId   { get; set; } 

    [DisplayName("Start Date")] 
    [Required(ErrorMessage="A Start Date is required")] 
    [DisplayFormat(ApplyFormatInEditMode=true, DataFormatString="{0:d}")] 
    public DateTime StartDate  { get; set; } 

    [DisplayName("End Date")] 
    [Required(ErrorMessage="An End Date is required")] 
    [DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:d}")] 
    public DateTime EndDate   { get; set; } 
} 

Y mi forma de entrada se escribe de esta manera durante las fechas:

<table> 
    <tr> 
     <td> 
      <div class="editor-label"> 
       @Html.LabelFor(model => model.StartDate) 
      </div> 
     </td> 
     <td> 
      <div class="editor-label"> 
       @Html.LabelFor(model => model.EndDate) 
      </div> 
     </td> 
    </tr> 
    <tr> 
     <td> 
      <div class="editor-field"> 
       @Html.TextBoxFor(model => model.StartDate, new { @class = "datepicker", id="txtStartDate" }) 
       @Html.ValidationMessageFor(model => model.StartDate) 
      </div> 
     </td> 
     <td> 
      <div class="editor-field"> 
       @Html.TextBoxFor(model => model.EndDate, new { @class = "datepicker", id = "txtEndDate" }) 
       @Html.ValidationMessageFor(model => model.EndDate) 
      </div> 
     </td> 
    </tr> 
</table> 

Mi problema es que el cuadro de texto se muestra ahora 01/Ene/0001 00:00:00. Primero: ¿cómo puedo obtener la fecha para formatear a shortdatestring? He encontrado un MVC2 solution que aconseja crear una carpeta EditorTemplates en SharedFolder y usar EditorFor en su lugar, pero eso no parece funcionar con MVC3. También parecía evitar agregar clases fácilmente como con TextBoxFor

Y en segundo lugar, una vez que se soluciona, tengo un sistema de validación especial que debo implementar. Necesito que la fecha de finalización sea DESPUÉS de la fecha de inicio. Estoy pensando en hacer el chequeo con un javascript, encontré http://www.datejs.com pero ¿hay alguna manera de hacer la validación directamente en mi clase?

Respuesta

8

Para su edición de plantilla probar este

@model DateTime? 
@Html.TextBox("", (Model.HasValue ? Model.Value.ToShortDateString() : string.Empty), new { @class = "datePicker" }) 

Fuente: comparaciones MVC 3 Editor Template with DateTime

jQuery DateTime

$('#txtbox').change(function() { 
      var date = $(this).val(); 
      var arrDate = date.split("/"); 
      var today = new Date(); 
      useDate = new Date(arrDate[2], arrDate[1] -1, arrDate[0]); 

      if (useDate > today) { 
       alert('Please Enter the correctDate'); 
       $(this).val(''); 
      } 
     }); 

Fuente: Jquery date comparison

+0

Gracias por los enlaces! Mis fechas todavía muestran 01/01/001 sin embargo. Pero creo que puedo volver a escribir eso en jquery. – LanFeusT

+0

Puede ser una pregunta estúpida, pero, ¿las fechas se rellenaron antes de enviarse a la vista? – DarkStar33

+1

No veo cómo podrían ser. Mi HomeController es bastante sencillo: 'public PartialViewResult EntryForm() { ViewBag.Teams = projectDB.Teams.OrderBy (p => p.Name) .ToList(); var project = new Project(); return PartialView (proyecto); } ' – LanFeusT

0

// datimetime se muestra en el selector de fechas es 11/24/2011 12:00:00 a.m.

// se puede dividir este espacio y por establecer el valor hasta la fecha sólo

Guión:

if ($("#StartDate").val() != '') { 
     var arrDate = $('#StartDate').val().split(" "); 
     $('#StartDate').val(arrDate[0]); 
    } 

marcado:

<div class="editor-field"> 
     @Html.LabelFor(model => model.StartDate, "Start Date") 
     @Html.TextBoxFor(model => model.StartDate, new { @class = "date-picker-needed" }) 
    </div> 

espera que esta ayuda ..

6

hay una manera considerablemente más fácil de hacer esto. Sólo tiene que utilizar un TextBox en lugar de un TextBoxFor

@Html.TextBox("ReturnDepartureDate", 
    Model.ReturnDepartureDate.ToString("dd/MM/yyyy")) 

esto tiene la ventaja de añadir todos los elementos discretos de JavaScript, etc. También menos código!

2

Si decora su objeto viewmodel con lo siguiente, solo verá la parte de la fecha dentro del cuadro de texto.

[DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:d}")] 
public DateTime Date { get; set; } 

A continuación, en su página sólo tiene que hacer lo siguiente

@Html.EditorFor(model => model.Date) 

Tenga en cuenta que esto es el uso de MVC3 estándar. No tengo una plantilla de editor de fecha personalizada.

Todo el crédito para esta respuesta va a assign date format with data annotations

3

Tener un vistazo a este ejemplo

@Html.TextBoxFor(s => s.dateofbirth, new { Value = @Model.dateofbirth.ToString("dd/MM/yyyy") }) 
+0

¡Es una pequeña solución! Crea un segundo atributo de valor. Funciona solo si se usa una V mayúscula. –

0

demasiado tarde, pero podría ser que puede ayudar a alguien:

Modelo:

[Display(Name = "Date of birth")] 
public DateTime? DOB{ get; set; } 

HTML:

@Html.TextBoxFor(m => m.DOB, "{0:MM/dd/yyyy}", 
      new { @placeholder="MM/DD/YYYY", @au19tocomplete="off" }) 

JavaScript para añadir el calendario para el control:

$('#DOB').datepicker({changeMonth: true, changeYear: true, 
     minDate: '01/01/1900', maxDate: new Date});