I have a gantt attached to onTaskClick and onTaskDblClick events.
When I double click it also fires the onTaskClick event.
How can I prevent that from happening?
It can be non-trivial because the fact is that when the first onTaskClick event fires there is no way to determine whether a user is done with clicking or is he going to do another single click which will then invoke double click event. So if you capture events in browser double click will always look like a sequence 'click'-'click'-'doubleclick'.
So if you need onclick not to fire for double clicks, you may need some timeout in onclick handler in order to check whether next click/doubleclick follows(200-300ms, the exact value may vary between browsers and OS). That way when the user does a single click, the onclick handler will be executed after some delay, and if it's the double click - a timeout for a click handler will be dropped so only onTaskDblClick handler will run.
var a;
gantt.attachEvent("onTaskClick", function(id,e){
setTimeout(function() {
if (a) {
return false;
} else {
gantt.message("onTaskClick")
return true;
}
}, 200)
a = 0;
});
gantt.attachEvent("onTaskDblClick", function(id,e){
gantt.message("onTaskDblClick")
a=1;
return true;
});
Please check this snippet that demonstrates how it works.
Related
I am currently working on a project in which the end user has two ways of submitting data for analysis.
The first way is: he clicks on a button - the button's listener fires an event called "ProcessBtnClick"
The second way is: he/she presses ENTER - the ENTER key fires the "ProcessBtnClick" event
When the ENTER key is pressed, the "ProcessBtnClick" event gets fired twice, it seems like the click event gets fired this way as well. Is there any way of avoiding this behavior? If so, How?
I enabled the ENTER key as follows:
this.control({
'container *' : {
specialkey : this.onHandleSpecialKey
}
});
The onHandleSpecialKey is defined as follows:
onHandleSpecialKey: function(field, event, options) {
if (event.getKey() == event.ENTER) {
QuickCloseUI.app.fireEvent("ProcessBtnClick");
}
}
I have a form and I want to display a confirmation dialogBox when the user presses the back button. Let say that I have one Texbonx that listens to a ChangeValueHandler
addValueChangeHandler(new ValueChangeHandler<String>() {
#Override
public void onValueChange(ValueChangeEvent<String> event) {
setChanged(true);
}
});
This is the short scenario
1) I enter text in the TextBox
2) I hit the back button
3) The ValueChangeEvent is not called
I tried the fire the BlurEvent programmatically on the TextBox with textBox.fireEvent(new BlurEvent() { }); but still no result.
Any suggestions ?
When the page is closed (by pressing the back button, or closing the page) no events will be fired by the controls. What will fire first is window.onbeforeunload to give you a chance to warn the user about data loss and offer to stay on the page. If the user chooses to stay on the page, then all the events that were supposed to be fired, will fire (so your change event will fire).
You can attach a handler to the native onbeforeunload event by using Window.addClosingHandler.
Window.addWindowClosingHandler(new ClosingHandler() {
#Override
public void onWindowClosing( ClosingEvent event )
{
event.setMessage("If you leave the page now all data will be lost.");
}
});
It's worth noting that the ClosingEvent and it's underlying onbeforeunload event, cannot, under any circumstances, be cancelled programmatically. The only way to prevent the user from leaving the page is if the user itself chooses "Stay On This Page" in the popup that results from the code above.
What I did is to set the focus of the TextBox to False and then check if it's changed, that forces the TextBox to unfocus when hiting the back button.
This is the code that check if a form is changed
public boolean isChanged(){
if(formPanel == null) return false;
for (int i = 0; i < formPanel.getWidgetCount(); i++) {
if(formPanel.getWidget(i) instanceof BaseWidget){
BaseWidget w= (BaseWidget) formPanel.getWidget(i);
w.setFocus(false);
if(w.isChanged()){
return true;
}
}
}
return false;
}
I am developing an app iOS app in appcelerator and I got a table with user.
When I click on the user it opens the profile but I also want the user to be able to copy the name just by tap and hold for 2 seconds.
These two event works fine separately but right now after tap and hold the click event fires to. How can I prevent the click event from firing after tap hold?
// Set the timeout
var holdTime = 500, timeout;
// Create the table touch start event listener
table.addEventListener('touchstart', function(e) {
// Set the selected user id
var itemValue = e.row.value_full;
// Define the function
timeout = setTimeout(function(e) {
// Create the fade out animation
var fadeOut = Titanium.UI.createAnimation({
curve: Ti.UI.ANIMATION_CURVE_EASE_IN_OUT,
opacity: 0,
duration: 1000
});
// Create the loading screen
var copied = UI_messages.showFlash({label : 'Copied!'});
// Add the loading screen
win.add(copied);
// Save value to clipboard
Titanium.UI.Clipboard.setText(itemValue);
// Fade the message out
copied.animate(fadeOut);
}, holdTime);
});
// Create the event listener for touch move
table.addEventListener('touchmove', function() {
// Clear the timeout
clearTimeout(timeout);
});
// Create the event listener for touch move
table.addEventListener('touchend', function(e) {
// Clear the timeout
clearTimeout(timeout);
});
I've run into this problem before as well. The solution I used isn't very pretty, but it's the only effective way that I've found to suppress a touch event after a touch-and-hold.
The only working solution that I could find was to create a bool variable in a global namespace. In your setTimeout function, change the value of the bool to true to indicate that a touch-and-hold has occurred.
In the onClick event event for the row, check the global variable first to see if you've already created a touch-and-hold event - if you have, just return from the onClick event. This will effectively disable your click event when a touch-and-hold occurs.
Remember to set the global variable to false after the touch-and-hold function ends.
I am using multisearch on my jqgrid to enable users search data from the server side.
My requirement is, I want to capture the search parameters specified by the user in the search grid as soon as they press the Find button.
Accordingly,
a. Is there any event that gets fired when a user clicks the Find button in the search grid?
b. how will I capture the search parameters specified in the search grid?
Thanks in advance.
In case anyone is looking for an answer to the above question:
I found that if we set the closeAfterSearch:true, then clicking 'Find' button triggers onClose event.
Similarly,
for Reset button, set the closeAfterReset:true, this again triggers onClose event.
jQuery("#list").jqGrid('navGrid', "#pager",{},{},{},{},
{multipleSearch:true,closeAfterSearch:true, closeAfterReset:true,
onClose:function()
{
//do work
return true; // return true to close the search grid
}
});
Sorry did not visit this thread for a while.
To determine the search criteria that user selected before pressing find use below code:
onClose:function()
{
var ofilter = $("#list").getGridParam("postData");
for (var i = 0; i < ofilter.rules.length; i++)
{
alert(ofilter.rules[i].field); //- field name
alert(ofilter.rules[i].data); //- value
alert(ofilter.rules[i].op); //- which operation performed
}
}
Using the event click with live function leads to strange behavior when using Firefox*.
With live in Firefox, click is triggered when right-clicking also! The same does not happen in Internet Explorer 7 neither in Google Chrome.
Example:
Without live, go to demo and try right clicking
the paragraphs. A dialog menu should
appear.
With live, go to demo and try right
clicking "Click me!". Now both dialog
menu and "Another paragraph" appear.
*tested with firefox 3.5.3
As far as I know, that is a known issue (bug?). You can easily work around it by testing which button was clicked as follows:
$('a.foo').live("click", function(e) {
if (e.button == 0) { // 0 = left, 1 = middle, 2 = right
//left button was clicked
} else {
//other button was clicked (do nothing?)
//return false or e.preventDefault()
}
});
you might prefer using a switch depending on your specific requirements, but generally you would probably just want to do nothing (or or simply return) if any button other than the left button is clicked, as above:
$('a.foo').live("click", function(e) {
switch(e.button) {
case 0 : alert('Left button was clicked');break;
default: return false;
}
});
I think it's a known "bug", you could potentially query the event object after attaching the click handler ( which gets attached to the document ) and see if its a right click, otherwise manually attach the click handler after you manipulate the DOM.
After looking it up, e.button is the property you want to query:
.live('click', function(e){
if ( e.button == 2 ) return false; // exit if right clicking
// normal action
});
See my answer here: if you don't mind changing the jQuery source a bit, adding a single line in the liveHandler() works around the problem entirely.