Field lengths in dialog

paulemasters · Post by **paulemasters** » Fri Apr 29, 2011 3:32 pm

Hello:

I am afraid I already know the answer, but I have to ask.

Working in CS3.

Is there a way to specify / limit the number of characters entered in a dialog field?

I know about the .characters = but that only makes the display 'window' for the field longer / shorter. But, that doesn't matter. More characters can be keyed in than the size of the input area.

I have Yes/No fields that I want to be only 1 character to make keying shorter. So, the entries should be Y or N. However, I can key in Yasdf;lkje if I want and that's what is put in the variable.

I use toUpperCase to make the compare easier and charAt(0) to get the first character to check for Y. But it would be nice and 'look better' if only 1 character were allowed to be entered.

Thanks for any help.

Paul Masters

Mike Hale · Post by **Mike Hale** » Fri Apr 29, 2011 3:37 pm

Checkbox or radiobutton might be a better choice for a yes/no control.

But you could add a keyboard listener to the edittext control so that it only accepts y or n keys. Then in the onChange callback limit the length.

paulemasters · Post by **paulemasters** » Fri Apr 29, 2011 3:42 pm

Thanks for the very quick reply!

I thought about the radio buttons, may do that.
Not sure I understand the call back process. Seems to be a bit complicated. I may give that a try when I get more time.

Thanks for your help.

Paul Masters

Mike Hale · Post by **Mike Hale** » Fri Apr 29, 2011 5:50 pm

Something like this.
Code: Select allcreateDialog = function ( ) {
var dlg = new Window( 'dialog', 'Y/N Example Script' );
dlg.etYorN = dlg.add('edittext');
dlg.btnPnl = dlg.add( 'panel', undefined );
dlg.btnPnl.orientation = "row";
dlg.btnPnl.alignment = "right";
dlg.btnPnl.preferredSize [ 80, 80 ]
dlg.btnPnl.okBtn = dlg.btnPnl.add( 'button', undefined, 'Ok', { name:'ok' });
dlg.btnPnl.cancelBtn = dlg.btnPnl.add( 'button', undefined, 'Cancel', { name:'cancel' });
return dlg;
};
initializeDialog = function( w ) {
// Set up initial control states
w.etYorN.onChanging = w.etYorN.onChange = function(){
   var enteredText = this.text.toUpperCase();
   //$.level =1;
   //debugger;
   if( enteredText.match(/^[YN]$/) == null ){
      this.text = '';
   }else{
      this.text = enteredText;
   }
}
}

runDialog = function( w ) {
return w.show( );
};
var win = createDialog();
initializeDialog(win);
runDialog(win)

paulemasters · Post by **paulemasters** » Tue May 17, 2011 3:04 pm

Thanks for the great help as usual.

Some questions:
Does there have to be an ...onchanging... set of code for each field, or can one be used for all Y/N fields?

Sorry for the question, but I don't know much about JavaScript or PS scripting.
Please explain the mechanics / linkages. I think I see that the panel is put in a function but after that I am lost.
Also, how do I get the return value of the .show for the dialog?

Thanks for any help.

Paul Masters

Mike Hale · Post by **Mike Hale** » Tue May 17, 2011 5:35 pm

You can move the code in the widgets onChange callback into a function and then assign that function to as many Y/N controls as you need.

runDialog returns the results of onShow.

Code: Select all createDialog = function ( ) {
var dlg = new Window( 'dialog', 'Y/N Example Script' );
dlg.etYorN = dlg.add('edittext');
   dlg.etYorN1 = dlg.add('edittext');
dlg.btnPnl = dlg.add( 'panel', undefined );
dlg.btnPnl.orientation = "row";
dlg.btnPnl.alignment = "right";
dlg.btnPnl.preferredSize [ 80, 80 ]
dlg.btnPnl.okBtn = dlg.btnPnl.add( 'button', undefined, 'Ok', { name:'ok' });
dlg.btnPnl.cancelBtn = dlg.btnPnl.add( 'button', undefined, 'Cancel', { name:'cancel' });
return dlg;
};
initializeDialog = function( w ) {
// Set up initial control states
w.etYorN.onChanging = w.etYorN.onChange = YNHandler;
   w.etYorN1.onChanging = w.etYorN1.onChange = YNHandler;
}

runDialog = function( w ) {
return w.show( );
};
var win = createDialog();
initializeDialog(win);
var res = runDialog(win);
if(res==1){
   alert(win.etYorN.text);
}

function YNHandler(){
var enteredText = this.text.toUpperCase();
if( enteredText.match(/^[YN]$/) == null ){
this.text = '';
}else{
this.text = enteredText;
}
}

paulemasters · Post by **paulemasters** » Tue May 17, 2011 9:56 pm

Thanks for the additional information.

The process woks great, except if you enter one of the accepted values more than once. That is, if you enter YY or NN etc.
Then the field is blank.

I added a bit to the function to fix that. If there is a better way, please let me know.

Not being content to leave well enough alone, I also added an alert to tell the user that they may enter if they do it wrong. However, the alert appears 4 times!

I thought it was because of the ..change and ..changing, so I removed the ..change from the first field, but the alert still appeared 4 times. I thought it might be because the 2 fields use the same function, but I didn't put anything in the second field.

I am guessing this is related to how all this works, but it would be nice if it happened only once if there is a way to do that.

Here is the function I messed up:
Code: Select all function YNHandler(){
var enteredText = this.text.toUpperCase();
var c = enteredText.charAt(0);
if( c.match(/^[YN]$/) == null ){
this.text = '';
alert("Value may only be Y or N.");
}else{
this.text = c;
}
}

Thanks for any help.

Paul Masters