How to disable button when textfield is empty - actionscript-3

I make a textfield named 'nama' and button 'ayo'. I want to make the button disable when the textfield is empty. But when I try this code my button not disable and still working. I want the button disable before the textfield filling.
stop();
menumulaikuis();
var namasiswa:String;
var nama:TextField = new TextField();
namasiswa = nama.text;
nama.addEventListener(Event.CHANGE,handler);
function handler(event:Event){
if (nama.text) {
ayo.enabled = true;
ayo.visible = true;
} else {
ayo.enabled = false;
ayo.visible = false;
}
}

You have some little problems in your code :
You should add your text filed to the stage using addChild() :
var nama:TextField = new TextField();
addChild(nama);
If your text field is for user's input, so its type should be input :
nama.type = 'input';
To verify if a text field's text is empty, you can simply do :
if(nama.text == ''){ /* ... */ }
So your text field's change handler can be like this :
function changeHandler(event:Event): void
{
if (nama.text != '') {
ayo.enabled = true;
ayo.visible = true;
} else {
ayo.enabled = false;
ayo.visible = false;
}
}
Hope that can help.

If the Text Field isn't for user input, you cannot use the Event.CHANGE listener.
I suggest changing Event.CHANGE to Event.ENTER_FRAME; that should fix your problem.

Related

Validate same values on change

Hello I have a problem with validating identical values in input boxes. Event called must be "on change" value of input box, but I have a problem with numbers.I want to write for example "17", but before there was value "1" already inputted in previous input box and it will report error because before we write 17 there is "1"- 7. So there is my question: is there a option to check identical values with this event type while dodging this error?
var textInput:Array = new Array();
for(var a:Number = 0;a < 2; a++){
textInput[a] = new TextField();
textInput[a].type = "input";
textInput[a].y = 10+20*a;
this.addChild(textInput[a]);
textInput[a].addEventListener(Event.CHANGE, changeListener);
}
function changeListener (e:Event):void {
if(Number(e.target.text)>22){
e.target.text = "0";
}
//problem area
else{
if(Number(textInput[1].text) == Number(textInput[0].text)){
e.target.text = "0";
}
}
}
There is simple code with just 2 input boxes but in my project it more complex. How do define problem area to have possibility write "17" when we have "1" already in 1st input box.
You can't both allow and disallow the same thing at the same time, obviously.
What you can do is validate the field on CHANGE and only mark it as valid or invalid (perhaps with some error styling) and on FOCUS_OUT you reset the text if it's not valid.
Something like this:
var valid:Boolean = true;
input.addEventListener(Event.CHANGE, validate);
input.addEventListener(FocusEvent.FOCUS_OUT, commit);
function validate(e:Event):void {
var input:TextField = e.currentTarget as TextField;
var value:Number = Number(input.text);
if(value > 22){
valid = true;
input.backgroundColor = 0xff0000; // error style
}else{
valid = false;
input.backgroundColor = 0xffffff; // normal style
}
}
function commit(e:FocusEvent):void {
if(!valid){
var input:TextField = e.currentTarget as TextField;
input.text = "0";
input.backgroundColor = 0xffffff; // normal style
}
}
Also I would recommend that you encapsulate this stuff in a class that extends TextField.

as3 Text Field formatting issue

I have a problem with formatting the text field. I have buttons + and - to size of text. TextField class has property defaultTextField for new text formatting. And when I change defaultTextFormat size property - whole text's size changes. I have searched for solution everywhere and I haven't found it yet. Text editor WISWYG (I am not sure if name is right) is working well with just changing defaultTextFormat property while I have issue. Maybe it happens because of difference between flash and AIR (editor on flash and my app on AIR). Please help.
Here code to set/get TextFormat:
public function set selectionTextFormat(value:TextFormat):void {
var begin:int = _textField.selectionBeginIndex;
var end:int = _textField.selectionEndIndex;
if (begin == end)
{
_textField.defaultTextFormat = value;
}
else
{
_textField.setTextFormat(value, begin, end);
}
}
public function get selectionTextFormat():TextFormat
{
var begin:int = _textField.selectionBeginIndex;
var end:int = _textField.selectionEndIndex;
if (begin == end)
{
return _textField.defaultTextFormat;
}
return _textField.getTextFormat(begin, end);
}
And code to change format:
private function setFormat(property:String, value:*):void
{
var tf:TextFormat = TextFormatter.TF.selectionTextFormat;
tf[property] = value;
TextFormatter.TF.selectionTextFormat = tf;
}
EDIT : IMAGE ON DROPBOX FOR EXPLANATION:
https://dl.dropboxusercontent.com/u/237572639/Capture.PNG
EDIT 2: IMAGE OF WHAT I NEED (CODE IS ABSOLUTELY SAME!) (WYSIWYG editor)
https://dl.dropboxusercontent.com/u/237572639/WYSIWYG.PNG
To change all future typed text, you can try this code ( the result is visible here ):
var text_input:TextField = new TextField();
text_input.border = true;
text_input.type = 'input';
text_input.text = 'hello world!';
addChild(text_input);
var new_fmt:TextFormat = new TextFormat();
btn_color.addEventListener(
MouseEvent.CLICK,
function(e:MouseEvent):void {
// set the new text color
new_fmt.color = 0xFF0000;
}
)
btn_size.addEventListener(
MouseEvent.CLICK,
function(e:MouseEvent):void {
// set the new text size
new_fmt.size = int(txt_size.text)
}
)
text_input.addEventListener(Event.CHANGE, function(e:Event):void {
text_input.setTextFormat(new_fmt, text_input.caretIndex-1);
})
Of course, this is just a manner to do what you want, you have to adapt it to your need and improve it.

AS3: Maintain Checkbox state when returning to a frame with checkboxes

So I asked a question yesterday about how to control the state of some checkboxes here: Getting Checkboxes to retain their state on return to frame
However this has caused another problem. Whilst the values of the checkboxes are retained, their relationship to the objects they represent is not.. for example, on return to the home screen the checkbox value will be filled in as true but the button that that checkbox represents won't be visible until I uncheck and recheck the box.
I've been trying to store the Boolean value of the checkbox in a variable and then re use it upon return to the screen but I just don't' understand enough of the syntax to get it work.
Looking at the code below I'm wondering whether it's because I'm setting the default state of the button visibility right at the start of the code to false? Do I need to get Area_1_Btn.visible to check for the Boolean state?
Any help greatly appreciated as I'm getting more and more frustrated at my lack of understanding heh.
import flash.events.Event;
/* Ensures that all checkboxes begin in the off state.*/
Area_1_Btn.visible = false;
Area_1_Chk.visible = true;
Area_2_Btn.visible = false;
Area_2_Chk.visible = true;
ShowAll_Chk.visible = true;
/* Defines the Show All Checkbox and sets states to true/false*/
ShowAll_Chk.addEventListener(Event.CHANGE, toggleMulti, false, 0, true);
function toggleMulti(e:Event):void
{
var SAC:Boolean = e.target.selected;
if (SAC)
{
Area_1_Chk.selected = true;
Area_1_Btn.visible = true;
Area_2_Chk.selected = true;
Area_2_Btn.visible = true;
}
else
{
Area_1_Chk.selected = false;
Area_1_Btn.visible = false;
Area_2_Chk.selected = false;
Area_2_Btn.visible = false;
}
}
/* Toggles the button state*/
function toggleArea_1_Btn(e:Event):void
{
var A1B:Boolean = e.target.selected;
if (A1B)
{
Area_1_Btn.visible = true;
}
else
{
Area_1_Btn.visible = false;
}
/* previous method for toggling button state*/
}
function toggleArea_2_Btn(e:Event):void
{
Area_2_Chk.selected ? Area_2_Btn.visible = true:Area_2_Btn.visible = false;
}
/* Listens to the state of the checkbox and switches the button on*/
Area_1_Chk.addEventListener(Event.CHANGE, toggleArea_1_Btn, false, 0, true);
Area_2_Chk.addEventListener(Event.CHANGE, toggleArea_2_Btn, false, 0, true);
/* Listens for a mouse click and then instructions function below*/
Area_1_Btn.addEventListener(MouseEvent.CLICK, A1_ClickToGoToAndStopAtFrame);
Area_2_Btn.addEventListener(MouseEvent.CLICK, A2_ClickToGoToAndStopAtFrame);
function A1_ClickToGoToAndStopAtFrame(event:MouseEvent):void
{
gotoAndStop(2);
}
function A2_ClickToGoToAndStopAtFrame(event:MouseEvent):void
{
gotoAndStop(3);
}
stop();
Here are some optimizations and additions that should do the trick:
import flash.events.Event;
import flash.events.MouseEvent;
//a method you can call to set the visibility of all checkbox related items. Pass in false to hide them all
function showCheckBoxes(val:Boolean = true):void {
Area_1_Chk.visible = val;
Area_2_Chk.visible = val;
ShowAll_Chk.visible = val;
Area_1_Btn.visible = val;
Area_2_Btn.visible = val;
if(val) setButtonVisibility(); //if showing, show/hide the buttons based off the check box value
}
//this will update the button visibility based off the checkbox selected value.
function setButtonVisibility(e:Event = null):void {
Area_1_Btn.visible = Area_1_Chk.selected;
Area_2_Btn.visible = Area_2_Chk.selected;
}
function toggleMulti(e:Event):void {
Area_1_Chk.selected = ShowAll_Chk.selected;
Area_2_Chk.selected = ShowAll_Chk.selected;
setButtonVisibility();
}
function buttonClick(e:Event):void {
showCheckBoxes(false); //hide everything since we're moving to a new frame
switch(e.currentTarget) { //e.currentTarget is the button that was clicked
case Area_1_Btn:
gotoAndStop(2);
break;
case Area_1_Btn:
gotoAndStop(3);
break;
}
}
//add all the listeners
ShowAll_Chk.addEventListener(Event.CHANGE, toggleMulti, false, 0, true);
Area_1_Chk.addEventListener(Event.CHANGE, setButtonVisibility, false, 0, true);
Area_2_Chk.addEventListener(Event.CHANGE, setButtonVisibility, false, 0, true);
Area_1_Btn.addEventListener(MouseEvent.CLICK, buttonClick);
Area_2_Btn.addEventListener(MouseEvent.CLICK, buttonClick);
showCheckBoxes(); //call this right now so the visibility updates when the frame loads.
stop();

how to disable movieclip?

I am using Adobe Flash CS5, Action Script 3.0. I want to disable my movie clip. How to do that?
My code:
var index:Array = ([0,1,2,3]);
var radioGroup1:RadioButtonGroup = new RadioButtonGroup("question1");
rb1.group = radioGroup1;
rb2.group = radioGroup1;
rb3.group = radioGroup1;
rb4.group = radioGroup1;
b1.addEventListener(MouseEvent.CLICK, submitclick,false);
function submitclick(event:MouseEvent):void
{
if (radioGroup1.selectedData == null)
{
b1.mouseEnabled = false;
//ExternalInterface.call("Test","Please selecte one answer");
//return;
} else {
if (radioGroup1.getRadioButtonIndex(radioGroup1.selection) == 2)
{
myscore += 10;
}
}
if (compquest>=maxquest)
{
gotoAndStop(1,"Scene 6");
}
else
{
MovieClip(this.root).gotoAndStop(1, "Scene " + questions[compquest++]);
}
}
I want to disable this b1 movieclip. So anyone could tell me what am I doing wrong?
If, by disable, you mean to make it unclickable and faded like a disabled button. Just reduce the alpha a bit and set its mouseEnabled property to false.
function submitClick(event:MouseEvent){
b1.alpha = .6;
b1.mouseEnabled = false;
}
This way the user will not be able to click it and it appear disabled.
First you could write, because event.target is p1:
function submitclick(event:MouseEvent):void
{
event.target.mouseEnabled = false;
}
On the other hand, the condition you want to evaluate in your if statement is probably false:
radioGroup1.selectedData == null
Therefore the associated code isn't executed:
b1.mouseEnabled = false;
You should test in your function and before your if statement:
trace(radioGroup1.selectedData == null);

Convert TextArea into TextField in AS3

I've a TextArea component in my MovieClip. When I double click on it, I want to switch to TextField component, allowing me to change its content. When I click outside, I want to restart its original class (TextArea).
How can I do it?
I'm doing this, but didn't work:
element.addEventListener(MouseEvent.DOUBLE_CLICK, changeName);
private function changeName(e:MouseEvent):void{
e.target.type = TextFieldType.INPUT;
}
Where element is a TextArea (clasic and dynamic text). Thanks!
EDIT:
This is how my MovieClip looks. "Name" is the TextArea that I want to allow user changes. I'm setting it like this:
[Spanish interface]
Nombre de instancia = Instance name (empty)
Texto clásico (classic text)
Texto dinámico (dynamic text)
The MovieClip is controlling my by own base class (called 'ConfLayer'). Inside it I have this:
public function doStuff(e:MouseEvent):void{
// element = TextArea 'Name'
element.addEventListener(MouseEvent.DOUBLE_CLICK, changeName);
}
private function changeName(e:MouseEvent):void {
var tarea:TextArea = e.target as TextArea;
var tf:TextField = tarea.TextField; // this line throwing error
tf.type = TextFieldType.INPUT;
}
Because AS3 gives me errors, I tried this:
private function changeName(e:MouseEvent):void {
e.target.TextField.type = TextFieldType.INPUT;
}
When I double-click on TextArea element, the previous string removes and I can't write nothing.
You make field editable only after second click. My idea is that it's to late. the field is editable, but you'll need to click again. So, try to make ediable for a while (e.g. 300 mileseconds) after the first click. If there's no click you set the type back to DYNAMIC. After second click you'll start editing text field.
Following on my comment above, a TextArea has a textfield property.
So you should be able to do something like this:
private function changeName(e:MouseEvent):void{
var tarea:TextArea = e.target as TextArea;
var tf:TextField = tarea.textField; //make sure that textfield is camelCase!!!
tf.type = TextFieldType.INPUT;
}
I solved my own problem using background and border properties from TextField. Instead of create TextField directly on my MovieClip, I create it dynamically.
// Field 'Name' of the layer
var tarea:TextField = new TextField();
tarea.text = 'Layer';
tarea.x = -80;
tarea.y = -23;
tarea.type = TextFieldType.DYNAMIC;
tarea.height = 20;
// Format the TextField
var format_tarea:TextFormat = new TextFormat();
format_tarea.font = "Arial";
format_tarea.size = 14;
format_tarea.bold = true;
tarea.setTextFormat(format_tarea,0,tarea.length);
Then, I add it some listeners to allow changes when I click on it:
// Add event to allow name changes
tarea.addEventListener(MouseEvent.CLICK,changeName);
When I press ENTER key, I accept the changes
// Add event to accept changes on press ENTER key
tarea.addEventListener(KeyboardEvent.KEY_DOWN,acceptKeyboardName);
When TextField lost his focus, accept the changes too:
tarea.addEventListener(FocusEvent.FOCUS_OUT,acceptFocusName);
Last, I added to my own MovieClip
// Add to MC
mc.addChild(tarea);
Handlers associated to below events are these:
private function changeName(e:MouseEvent):void
{
e.target.setSelection(0,e.target.text.length);
e.target.border = true;
e.target.background = true;
e.target.type = TextFieldType.INPUT;
}
private function acceptKeyboardName(e:KeyboardEvent):void
{
if (e.charCode == 13) // When pres ENTER, remove border, background and restore dynamic type
{
e.target.type = TextFieldType.DYNAMIC;
e.target.border = false;
e.target.background = false;
}
}
private function acceptFocusName(e:FocusEvent):void
{
// When lost focus, remove border, background and restore dynamic type
e.target.type = TextFieldType.DYNAMIC;
e.target.border = false;
e.target.background = false;
}