的Ext JS 4.1的MessageBox與

我創建了一個消息框，允許用戶輸入一些文字文本驗證：的Ext JS 4.1的MessageBox與

Ext.MessageBox.show({ 
    title : 'Reason', 
    msg : 'Your reson:', 
    width : 300, 
    buttons : Ext.MessageBox.OKCANCEL, 
    multiline : true, 
    scope : this, 
    fn : function(btn, reason){ if (btn == 'ok' && reason != '') this.rejectPlan(rec, reason);} 
});

用戶看到它，是允許進入他的原因，但現在所有我能做的就是驗證如果他輸入的文本不是空的。

我想阻止OK按鈕，直到用戶輸入一些文字（可以說至少20個字符）

我可以添加驗證器的MessageBox或者我必須創建自定義組件擴展窗口？

來源

2012-07-04 Misiu

您可以將opts參數添加到代表消息框配置的fn中，並在文本爲空的情況下使用相同的配置重新打開消息框。

Ext.MessageBox.show({ 
    title : 'Reason', 
    msg : 'Your reason:', 
    width : 300, 
    buttons : Ext.MessageBox.OKCANCEL, 
    multiline : true, 
    scope : this, 
    fn : function(btn, reason, cfg){ 
     if (btn == 'ok' && Ext.isEmpty(reason)) { 
      //if you want to mark the text as mandatory 

      Ext.MessageBox.show(Ext.apply({}, {msg:cfg.msg}, cfg)); 
     } else if (btn =='ok') { 
      alert('ok with text');     
     } 
    } 
});

來源

2012-07-04 14:34:19 nscrob

這是一個選項:)但是，我可以禁用按鈕在啓動，然後啓用它後進入測試？有了MessageBox，我認爲這會有問題。 – Misiu

是的，如果我必須這樣做，我會創建自己的窗口組件，似乎更容易。 MessageBox不允許有多種變體，特別是Ext.MessageBox.show，它對配置的要求更爲嚴格。 – nscrob

其實這是可能的，認爲它可能需要一些努力，使其工作。這是一個相當「黑客」的方式來做到這一點，所以請用你自己的題外話來使用它。

var messageBox = Ext.MessageBox.show({ 
      title: 'Type Something in!', 
      msg: 'Please type something into the text box!', 
      width: 300, 
      buttons: Ext.MessageBox.OKCANCEL, 
      multiline: true, 
      fn: function(btn, text, config) { 
       //Do your thing 
      }, 
    }); 

    messageBox.msgButtons.ok.setDisabled(true); 
    messageBox.textArea.allowBlank = false; 
    messageBox.textArea.on('change', function (e, text, o) { 
     if (text.length > 0) { 
      messageBox.msgButtons.ok.setDisabled(false); 
     } else { 
      messageBox.msgButtons.ok.setDisabled(true); 
     } 
    });

顯示它後，您可以獲得對消息框的引用。一旦文本框被創建並顯示，OK按鈕被禁用，文本區域被設置爲不允許空白值。我還編寫了一個事件處理程序，用於檢查文本區域中是否有文本，以決定是否啓用或禁用OK按鈕。

這種「解決方法」很容易受到API變更的影響，所以要小心。

來源

2015-03-24 19:58:06

我已經有一段時間沒有完成ExtjS了，但我會盡力確保。感謝您挖掘這個老問題:) – Misiu

的Ext JS 4.1的MessageBox與

回答

相關問題