I have some buttons in a BorderContainer and I would like to execute the attached event when the user click on the buttons. But, the parent has a click event too.
I would like to execute the action A when the user click on the button A, the action B with the button B and the action C if the user click on the background.
Actually, if I add the eventHandler to the bordercontainer, the buttons don't work anymore. No mouse cursor, no mousehover effect, and if you click on it, it's the action C which is launched.
My bordercontainer:
useHandCursor = true;
mouseChildren = false;
buttonMode = true;
In both buttons and bordercontainer I use the MouseEvent.Click event and both call the same function "click" which will execute different actions depending the properties of the event.target.
My bad. Thank to Timofei.
Both the bordercontainer and the click function were wrong.
In the bordercontainer, mouseChildren had to be set at true, which will let the children get the event too.
And in my click function, using event.target was a bad idea. It tried to get the properties from the bordercontainreskin. I had to use event.currentTarget instead. Finally I added a event.stopPropagation() to prevent the bordercontainer to catch the event too when the user click on a button. And now, everything is working well now.
Thank you
Related
I have a Spark CheckBox and I'm trying to prevent it from changing when clicked. In most Flex components there is a CHANGING event and you can prevent default. I've only found a CHANGE event and if I listen for that event and then set checkbox.selected = !checkbox.selected; it just dispatches changed again and the check box is reselected.
You can just disable any mouse events for this checkbox and would still be able to change the selection programmatically with selected=true:
<s:CheckBox id="myCheckbox"
mouseChildren="false"
mouseEnabled="false"/>
I've added an event listener for a mouse click event and this seems to work but there is a flicker where you can see it was selected for an instant.
IEventDispatcher(checkbox).addEventListener(MouseEvent.CLICK, function(e:Event):void {
trace("click");
ToggleButtonBase(target).selected = !ToggleButtonBase(target).selected;
e.stopImmediatePropagation();
e.preventDefault();
});
Using this, if I trace the events, it's:
change
change
click
Not ideal but it seems to be working.
I have action pane's MyButtonGroup's visible property set to 'no'.
What I want to do is to show (to set its visible property to 'yes') MyButtonGroup when I click Line view button.
I overrode Line view's method gotFocus:
MyButtonGroup.visible(true);
super();
but I also want MyButtonGroup visible property to be false if Line view button is not focused / clicked
for this I overrode the lostFocus method on Line view
MyButtonGroup.visible(false);
super();
so the lostFocus method "does not work", I mean when Line view button is not focused anymore
MyButtonGroup remains visible.
how can I solve it?
Never use gotFocus or lostFocus.
Use the clicked method of LineViewButton and HeaderViewButton instead.
See my pastebin for an example.
That said, you are on the wrong track, the button group would be better placed on the action pane directly above the lines.
I have a flex app with several fields and one text field with a focusOut event:
<mx:FormItem label="Last" x="226" y="1">
<s:TextInput id="lastNameClientTextInput" text="#{_currentEditClient.lastName}" change="textFieldChangeCapitalize(event)" focusOut="lastNameClientTextInput_focusOutHandler(event)"/>
</mx:FormItem>
As expected, when I tab or click out of the field after typing a value it executes my "lastNameClientTextInput_focusOutHandler" method which simply pops-up a new window:
protected function lastNameClientTextInput_focusOutHandler(event:FocusEvent):void
{
clientSearchPopUp = new ClientListWindow();
PopUpManager.addPopUp(clientSearchPopUp, this, true);
PopUpManager.centerPopUp(clientSearchPopUp);
}
That window will do a "PopUpManager.removePopUp(this);" when the user clicks the close button.
However, the problem is when the window closes, the focus is back on the lastNameClientTextInput! I am unable to click or tab out of the field!
When I tab out I do initially see the ibeam cursor move from the last name field to the next field in tab order (address) and then my window pops-up. When I close the window it moves BACK to the last name field and highlights the value.
It is as if I need to do something to validate the focusOut event?
You might want to try using valueCommit rather than focusOut. You could also listen for the popup being removed and set focus manually.
HTH;
Amy
Late I know, but Flex may be referring to the FocusManager.lastFocus property to resume focus from the last time the component was active. When triggering the pop up, try calling:
(focusManager as FocusManager).mx_internal::lastFocus = null;
I have a scenario where...
1.) Have created a div with a dropdown list and ok, cancel button
2.) On document ready - registering div created on step 1 into a jQuery dialog
3.) on a javascript button click - I am opening this dialog box.
4.) Now, the problem is - the jQuery dialogbox which I have created, needs to be used by other button clicks as well on same page. Now, my div's (which is a dialog at runtime using jQuery) ok button click is already engaged with a javascript function (button1 click) and I can not associate other button's click events with it - thus stuck up here and have no clues or hit to resolve this.
Anyone have faced this issue in asp.net, jquery earlier? Can someone provide a guidance?
Why you cant associate another event?
buttons will have different id. Is it?
$('#button1').click(function() {
alert('Handler for button 1 .click() called.');
});
$('#button2').click(function() {
alert('Handler for button 2 .click() called.');
});
Is this not possible in your case.?
Options:
1) disassociate the click handler when the function opens the div, then later in the function of opening the div associate a click handler to the button.
2) create multiple buttons toggle them all hidden, associate the click handler to each button you want. When the div is opened do a check to see which button to toggle to visible.
3) create no buttons but have a function create the button on the fly. When the div is opened, create the button for that div by calling the function and passing in a code telling it which button to open and what to associate to the click handler (this can be stored in an array and all that is passed in is the key).
Depending on the application, I have used all of these methods. The last one can have a twist that allows it to call an ajax server based application to get the button text and functionality (stored in a database), this saves you from having to load an array with button data, and also allows for easier expansion of the application.
I have a VBox, I assigned a handler to click, and inside the VBox I have components such as images and texts with no handler assigned for click. Would the click function be called when I click on the text and image? If not how can I make it so without assigning handlers individually, but on the container level?
Thanks
Click events "bubble" in Flex. When you click on an images, it bubbles up to its parent, then that parent's parent and so on until there are no more parents left.
If any of these have click listeners they will trigger when they are reached in the bubbling process.
Also in the event the currentTarget will refer to the object that has the listener, and the target will be what was actually clicked.
So in your case if they click the image, the event will bubble up to the container triggering the event, in your listener function the clicked image will be the event.target and the container will be the event.currentTarget.
Also in the bubbling process, it actually starts from the root parent down, this is called the capture phase, then bubbles back up. Your event will trigger when it bubbles back up unless you specify useCapturePhase = true in the event listener. This is how you can stop an event from going to its children. If you use the capture phase then call event.stopPropagation() inside the event listener then the container will receive the event but the child image will not.
It's taken an hour for an answer to this question... it probably would have been faster to just try it. :)
But yes, click events bubble up to parent containers. Adding the handler to the VBox should be fine.
I was pretty sure that containers, such as VBox do not dispatch click events; unless they are bubbled up from the children.
However, clicking on items in your container should trigger the listener on your container, as the Click event bubbles.