How to override event handler of a panel's button in YUI3 - yui

I use panel.addButton({value:"XXX",section:...,action:function(){*}}) to add a button on
a panel, now I want to override the action of button,how to do this!

You can't "change" the action function per se. action is a shortcut for adding an event listener for certain events to the button node that you created. What you can do is remove that event listener and add another.
Since action only adds one event listener, you can safely remove it by removing all event listeners. Just get the button node with getButton, call detachAll and attach a new event listener:
var panel = new Y.Panel({ /* panel config with some buttons */ });
// later on...
var button = panel.getButton(1);
button.detachAll();
button.on('click', newAction);

Related

How do you add CSJS like XSP.partialRefreshGet to onComplete event of an eventHandler?

I have an event handler on a button that runs some SSJS code which updates a viewScope variable. I am using partial refresh and have selected the ID I want to refresh. However, in the onComplete event of the event handler I want to update another ID. The onComplete event appears to only accept SSJS. How do you add CSJS to the onComplete event?
The onComplete event (as well as onStart and onError) accepts csjs, not ssjs. So you should be able to add an XSP.partialRefreshGet() call which will perform a partial refresh after your initial partial refresh.

Intercept (and perhaps cancel) page's mouse/keyboard event handlers

I'm trying to create a Chrome Extension that deals with selected text. Some website pages' otherwise selectable text content has click/mouse-up/down event handlers that navigate to a new page.
Is there a way from the background or content script to temporarily disable (and restore) the page's arbitrary event handlers without interfering with the native text selection?
Worst case I'm thinking of is to detach, clone the body html, allow the selection, and then restore the bound original. Seems like trouble.
Thanks!
Most HTML DOM events follow the capture-target-bubble event model. This means, for example, that if you click on a button, that the "click" event is first dispatched at the root, all the way down to the button, then back up. Event propagation can be stopped, which prevents the event listener at the next level from being notified of the event.
The earliest possibility of receiving the event is at the root, often window at the capture phase. To bind an event listener to the capture phase, use addEventListener with the third parameter set to true:
// in a content script, at run_at:document_start
window.addEventListener('click', function(event) {
event.stopImmediatePropagation();
}, true);
Many web pages use jQuery to manage DOM events, which binds the event listeners at the bubbling phase, so the previous method will work on most sites. If the page does not use jQuery, then you have to bind your event listener at document_start to make sure that your event listener is triggered before every other event listener.

qTip 2: trigger hide before delayed show?

I'm having an annoying little interaction issue with qTip 2. A button on my page has a tip attached to it, set to appear on mouseover after a 500ms delay and disappear immediately on mouseout.
When the button is clicked, the whole view changes and that particular button disappears, so I force the tip to hide immediately (otherwise, it hangs around until the user moves their mouse, even though the button that triggered it is no longer visible).
The problem is that the immediate hide event doesn't seem to cancel the delayed show event if it happens to occur first. In other words, if the user points at the button and clicks it in less than 500ms, the hide event triggers (doing nothing) and then the show event triggers at 500ms, causing the tooltip to display even thought the button is no longer there (and in the wrong position to boot, since it can't position itself correctly without the button being visible).
Is there a way when I trigger the hide event to tell it to just stop there and not perform any other events?
Not Tested
You can use the show event to check if the button visible , and if not than don't show it....
Something like this:
events: {
show: function(event, api) {
var target = event.originalEvent.target;
if($("#idOfButton").length === 0 ) {
event.preventDefault();
//or try this (commednt the above and uncomment the code below)
//clearTimeout(api.timers.custom);
}
}
}
I solved it like this (#Daniel, your answer was close so I'll upvote you too):
events: {
show: function(event, api) {
if ($("#mybutton").is(':hidden')) {
try { event.preventDefault(); } catch(e) {}
}
}
};
This is the method that qTip's documentation recommends.

Setting onchange listener for textfield in j2me

Is it possible to set a onchange listener to the textfield in j2me?
sure. Use ItemStateListener for that:
// below assumes that 'form' contains 'textField' which changes you want to listen to
form.setItemStateListener(new ItemStateListener() {
public itemStateChanged(Item item) {
if (item != textFiled) {
return; // ignore other items
}
System.out.println("contents: [" + textField.getString() + "]");
}
});
It is worth keeping in mind details of how itemStateChanged is invoked per the API docs:
...when the user ...enters or modifies the value in a TextField...
It is up to the device to decide when it considers a new value to have
been entered into an Item. For example, implementations of text
editing within a TextField vary greatly from device to device.
In general, it is not expected that the listener will be called after
every change is made. However, if an item's value has been changed,
the listener will be called to notify the application of the change
before it is called for a change on another item, and before a command
is delivered to the Form's CommandListener. For implementations that
have the concept of an input focus, the listener should be called no
later than when the focus moves away from an item whose state has been
changed. The listener should be called only if the item's value has
actually been changed.
The listener is not called if the application changes the value of an
interactive item.

Creating dynamic child context menu based on AJAX call

I'm developing a chrome extension where I need to create dynamic sub-contextMenus based on some selected text. Like If you select a text, it'll send an ajaxrequest from the background.html and create some child context menu based on the returned results. Is that possible? I've been trying for sometime. But no luck.
You can add right mouse button event listener in a content script:
document.addEventListener("mousedown", function(event){
if(event.button == 2) {
//get selected text and send request to bkgd page to create menu
}
}, true);
There is also oncontextmenu event, can try it as well (I think mousedown is fired earlier though).

Resources