CODEWITHSUNDEEP
extjsextjs4extjs4.2
Razgriz
Razgriz

Reputation: 7343

ExtJS 4 - MessageBox Prompt change input field type to password

Good day. I am creating a web application which displays a Message Box from time to time. I have a message box that asks the user for a password and I want that field type to be password. So far I've tried several things but none of them seem to work, they still show the text as plain text and not as dots or asterisks.

Here's my code:

var mb = Ext.MessageBox.prompt({
    title: 'Enter Override Password.',
    msg: 'Please Enter the Override Password to Reprint:',
    password: true, //this does not work
    width: 300,
    height: 125,
    multiline: 1,
    inputType: 'password', //this does not work
    value: '',
    buttons: Ext.MessageBox.YESNO,
    fn: myCallback,
    cls: 'msgbox',
    baseCls: 'msgbox',
    icon: Ext.MessageBox.WARNING
});
mb.textField.inputType = 'password'; //this does not work

Does anyone know how to specify the input field as password type? It seems that ExtJS 4.2 does not support it. Thanks in advance.

Upvotes: 0

Views: 2778

Answers (3)

Bhavya TS
Bhavya TS

Reputation: 1

Instead of Ext.MessageBox.prompt try with creating a custom window that extends Ext.Window, pop up when clicked on the button and sets modal to true and align to center.

Upvotes: 0

Razgriz
Razgriz

Reputation: 7343

Here's what I tried and it's worked thus far. The only problem I have now is styling and that's for another question.

var myMsgBox = new Ext.window.MessageBox({
    cls: 'msgbox',
    bodyCls: 'popWindow'
});
myMsgBox.textField.inputType = 'password';
myMsgBox.textField.width = 240;
myMsgBox.textField.center();
myMsgBox.prompt(title, msg, myCallback);

Upvotes: 1

cpastore84
cpastore84

Reputation: 599

I believe that goes a little bit beyond the scope of what the Ext.MessageBox was designed for. In looking at the source code the only things that passed into the input are the value, and height if the multiline is set.

What you could do instead, is to create your own component that extends Ext.Window and sets modal to true. This allows you to customize the window as you see fit.

Upvotes: 0

Related Questions