Question

我是mvc3的新用户，我正在使用c＃编码和razor我的视图引擎。有没有办法使用日期选择器而不使用jquery和其他东西。

Answer 1

如果你不使用javascript和jquery，那么你就得到了HTML。而且您知道在HTML中您有标准输入字段，例如<input type="text">。使用纯HTML时，如果用户点击某个日期输入，则无法显示动态日期选择器。

Answer 2

好吧，如果你想避免使用“所有脚本语言”，我想你应该有三个下拉菜单，

月（1 - 12）
天（1 - 31）
年

您的模型需要为月，日和年分别设置三个单独的字段。然后在您的控制器操作中，您将需要执行一些Date解析以确保它是有效日期，如果没有，则添加ModelState异常。

由于MVC附带了jQuery（并且验证器非常有用），为什么要避免使用它们？

所有这些都可以使用jQuery或简单的JavaScript完成，所以你真的限制自己。

编辑 - 添加代码示例

你的模特

using System.ComponentModel;
using System.ComponentModel.DataAnnotations;

public class DatePickerViewModel
{
     [Required]
     [DisplayName("Month")]
     [Range(1,12,ErrorMessage = "Month must be between 1 and 12")]
     public int? Date_Month {get;set;}

     [Required]
     [DisplayName("Day")]
     [Range(1,31,ErrorMessage = "Day must be between 1 and 31")]
     public int? Date_Day {get;set;}

     [Required]
     [DisplayName("Day")]
     [Range(1900,2012,ErrorMessage = "Year must be between 1900 and 2012")]
     public int? Date_Year {get;set;}
}

您的控制器

public class DatePickerController : Controller
{
     [HttpGet]
     public ActionResult Choose()
     {
          return View(new DatePickerViewModel());
     }

     [HttpPost]
     public ActionResult Choose(DatePickerViewModel model)
     {
          if(!ModelState.IsValid)
               return View(model);
          else
          {
               DateTime date;
               if(!DateTime.TryParse(String.Format("{0}/{1}/{2}",model.Date_Month, model.Date_Day, model.Date_Year),out dt))
               {
                    ModelState.AddModelError("","Invalid Date");
                    return View(model);
               }

               //Do something with the variable "date"
               return View("SomeOtherView");
          }


     }
}

和你的观点

@model DatePickerViewModel

@using(Html.BeginForm())
{
     <div>
          <div>@Html.LabelFor(m => m.Date_Month) @Html.ValidationMessageFor( m => m.Date_Month)</div>
         <div>@Html.DropDownListFor(m => m.Date_Month, (from n in Enumerable.Range(0, 12) select new SelectListItem{ Text = n==0? "":n.ToString(),Value =  n ==0? "":n.ToString()})</div>
     </div>
     <div>
          <div>@Html.LabelFor(m => m.Date_Day) @Html.ValidationMessageFor( m => m.Date_Day)</div>
         <div>@Html.DropDownListFor(m => m.Date_Day, (from n in Enumerable.Range(0, 31) select new SelectListItem{ Text = n==0? "":n.ToString(),Value =  n ==0? "":n.ToString()})</div>
     </div>
     <div>
          <div>@Html.LabelFor(m => m.Date_Year) @Html.ValidationMessageFor( m => m.Date_Year)</div>
         <div>@Html.DropDownListFor(m => m.Date_Year, (from n in Enumerable.Range(1899, 2012) select new SelectListItem{ Text = n==1899? "":n.ToString(),Value =  n == 1899? "":n.ToString()})</div>
     </div>
     <div><input type="submit" value="Submit"/></div>
}

正如您所看到的，为了在不使用JavaScript的情况下启用日期选择器，您需要创建的原始代码数量非常大。考虑到你是否只使用任何jQuery日期选择器，你需要的是你的Model / ViewModel上的一个可以为空的DateTime属性，一个视图上的文本框和一小段JS来将文本框转换为日期选择器。

避免重新发明轮子并重用已经存在的代码来解决如何使用任何jQuery Date Picker插件。

使用剃刀视图引擎的mvc3中的日期选择器，不使用jquery

2 个答案: