禁用文本框输入值

我有文本框与datepicker。根据我的要求，用户必须选择本月的第二个星期二或第二个星期二。所以我使用下面的代码禁用了其余的日期，并且它的工作正常。禁用文本框输入值

var dates_allowed = { 
     '2012-07-24': 1, 
     '2012-08-14': 1, 
     '2012-08-21': 1, 
     '2012-09-11': 1, 
    '2012-09-18': 1, 
     '2012-10-09': 1, 
     '2012-10-16': 1 
}; 
$("#" + webinarDate.id).datepicker({ 
    // called for every date before it is displayed 
    beforeShowDay: function(date) { 

     // prepend values lower than 10 with 0 
     function addZero(no) { 
      if (no < 10){ 
       return "0" + no; 
      } else { 
       return no; 
      } 
     } 

     var date_str = [ 
      addZero(date.getFullYear()), 
      addZero(date.getMonth() + 1), 
      addZero(date.getDate())  
     ].join('-'); 

     if (dates_allowed[date_str]) { 
      return [true, 'good_date', 'This date is selectable']; 
     } else { 
      return [false, 'bad_date', 'This date is NOT selectable']; 
     } 
    } 
});

但问题是用户可以在文本框中输入日期而不是使用datepicker（我不希望那样）。如何限制用户从datepicker中选择日期，而不是手动输入。我希望你明白..

来源

2012-07-24 Srav

您必须使用日期选择器？如果唯一的选择是本月的第一个或第二个星期二，也许下拉是一个更好的选择？ – 2012-07-24 15:34:05

注意：您还需要确保您有服务器端验证来检查值，而不是纯粹依靠被禁用的字段。 – Amalea 2012-07-24 15:35:33

@TheZ“disabled”文本框不会在POST上发送，因此readonly是正确的选择。 – Amalea 2012-07-24 15:36:24

您的意思是？

可以使用以下命令将日期选择器输入文本设置为只读：

你的情况，将会给这个元素：

<input type='text' id='datepickerTxt' readonly='true'>

或者：

$("#datepickerTxt").attr('readonly', 'true');

或者：

$("#datepickerTxt").keypress(function(e){ e.preventDefault(); });

在现代jQuery的版本：

$("#datepickerTxt").prop('readonly', 'true');

来源

2012-07-24 15:33:34

谢谢。它的工作。 – Srav 2012-07-24 16:33:56

日期选取器是一个正确的解决方案吗？感觉更像是一个下拉列表，下一个日期选择很多。

如果需要，那么你可以针对用户使用onblur打字并做你的测试。

或者如果onfocus被触发禁用键盘输入。

来源

2012-07-24 15:33:28 Toby

我会看到这样的回答： jQuery Date Picker where text input is read only 添加一个onclick事件，并禁止输入

来源

2012-07-24 15:36:05 pfwd

在ASPX - 拖放AJAX日历扩展，改变的ControlToValidate到txt_Date的ID（日期文本框），更改启用客户端脚本为False

然后

在文本属性，只需将只读属性更改为TRUE ..

（请确保您已拖动的ScriptManager的扩展器工作）...

现在你可以使用日历扩展只更改日期，因此无效日期无法进入..

来源

2012-10-21 08:01:31 Mahesh

禁用文本框输入值

回答

相关问题