禁用文本框輸入值

我有文本框與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

禁用文本框輸入值

回答

相關問題