Jquery MVC中的时间选择器

由于jQueryDatePicker没有时间选择，我使用了下面的TimeSpan代码，它返回了两个小时（0-23）和分钟（0-59）的下拉列表。这很好用。但是，我需要12小时格式的AM/PM下拉列表

 @model TimeSpan


@Html.DropDownList("hours", Enumerable.Range(0, 24)
                       .Select(i => new SelectListItem
                           {
                             Value = i.ToString(),
                             Text = i.ToString(), 
               //Selected = (Model.Hours > 12 ? Model.Hours - 12 : Model.Hours) == i
                             Selected = Model.Hours == i
                           }
                  )) 

@Html.DropDownList("minutes", Enumerable.Range(0, 60)
                       .Select(j => new SelectListItem
                           {
                             Value = j.ToString(),
                             Text = j.ToString(), 
                             Selected=Model.Minutes == j
                           }
                  ))

我添加了以下代码来显示AM/PM dropdownlist。但是，我需要修改代码，使用AM/PM dropdownlist显示12小时格式：

@Html.DropDownList("ampm",  Enumerable.Range(0,2)
   .Select(t =>  new SelectListItem
            {
              Value = t.ToString(),
              Text = (t == 0 ? "AM" : "PM"),                       
              Selected = (Model.Hours > 11 ? 1 : 0) == t
            }  
          ))   

我需要帮助修改下面的TimeBinder类为12小时格式与上午/下午dropdownlist

public class TimeBinder : IModelBinder
    {         
        object IModelBinder.BindModel(ControllerContext controllerContext, ModelBindingContext bindingContext)
        {            
            //Ensure there's incoming data
            //*************************
            //*** Validate "HOURS"  ***
            //*************************
            var hoursKey = bindingContext.ModelName; //key = EODTime
            var hoursValueProviderResult = bindingContext.ValueProvider.GetValue(hoursKey + ".hours"); //valueProviderResult = {15} (for selection of 15:10); RawValue has array of 15           

                if ((hoursValueProviderResult == null) ||
                   string.IsNullOrEmpty(hoursValueProviderResult.AttemptedValue))
                {
                    return null;
                }

                //Preserve it in case we need to redisplay the form
                bindingContext.ModelState.SetModelValue(hoursKey, hoursValueProviderResult);

                //Parse
                var hours = ((string[])hoursValueProviderResult.RawValue)[0];

                //**************************
                //*** Validate "MINUTES" *** 
                //**************************          
                var minuteKey = bindingContext.ModelName; //key = EODTime
                var minutesValueProviderResult = bindingContext.ValueProvider.GetValue(minuteKey + ".minutes"); 

                //valueProviderResult = {10} (for selection of 15:10); RawValue has array of 10           

                if ((minutesValueProviderResult == null) ||
                   string.IsNullOrEmpty(minutesValueProviderResult.AttemptedValue))
                {
                    return null;
                }

                //Preserve it in case we need to redisplay the form
                bindingContext.ModelState.SetModelValue(minuteKey, minutesValueProviderResult);

                //Parse           
                var minutes = ((string[])minutesValueProviderResult.RawValue)[0];


                //A TimeSpan represents the time elapsed sice midnight
                var time = new TimeSpan(Convert.ToInt32(hours), Convert.ToInt32(minutes), 0);

                return time;

            }  
       } 

---

请看以下内容：

---

我一直在用它。它很简单，但功能强大，因为它扩展了jQueryUI，因此主题滚动、本地化等功能非常强大。

请看以下内容：

---

我一直在用它。它很简单，但功能强大，因为它扩展了jQueryUI，因此主题滚动、本地化等功能非常出色。

谢谢！我将试用这个jQuery UI日期选择器。@plurby。我用的是特伦特计时器。我在页面上没有jscript错误。但是拾荒者没有出现。你知道为什么吗？如果我将警报放在Timepicker-addon.js中，警报就会显示出来。非常感谢您的帮助。@jaxbo您是否包括了jQueryUI（带有日期选择器和滑块）和时间选择器css？@plurby是的，我包括了。我解决了这个问题。我输入的类名是hasDatepicker。显然，这就是日期选择器和时间选择器之间的冲突。因为我使用的选择器也是（$'hasDatepicker'）。但是谢谢你的回复，谢谢！我将试用这个jQuery UI日期选择器。@plurby。我用的是特伦特计时器。我在页面上没有jscript错误。但是拾荒者没有出现。你知道为什么吗？如果我将警报放在Timepicker-addon.js中，警报就会显示出来。非常感谢您的帮助。@jaxbo您是否包括了jQueryUI（带有日期选择器和滑块）和时间选择器css？@plurby是的，我包括了。我解决了这个问题。我输入的类名是hasDatepicker。显然，这就是日期选择器和时间选择器之间的冲突。因为我使用的选择器也是（$'hasDatepicker'）。但是谢谢你的回复。