Ctrl+Click or Right-Click on web-sites with Chrome? - events

I have a web application, which works fine with Firefox and IE, but in Webkit browsers like Chrome it doesn't.
There are two click events, this application uses, which don't work with Chrome:
Ctrl + Left-Click for selecting records in a table
Right-Click for opening a contextual menu
It's like the click events don't get fired at all...

Right click:
document.body.addEventListener('contextmenu', function(ev) {
alert('show your custom context menu');
return false;
}, false);
Ctrl + Left click:
document.body.addEventListener('click', function(ev) {
if(ev.ctrlKey) {
alert('select single table cell');
}
}, false);

its better to use Jquery to be honesty, i prefer something like this to catch a right click and escape from browser compatibility issues
$('#elementtobeClicked').mousedown(function(event) {
switch (event.which) {
case 1:
alert('Left mouse button ?');
break;
case 2:
alert('Middle mouse button ?');
break;
case 3:
alert('Right mouse button ?');
break;
default:
alert('You have a micky mouse !');
}
});
or
$('#elementtobeClicked').bind("contextmenu",function(e){
alert('Context Menu ?');
return false;
});
have some good time over jquery
have to go through
event.shiftKey && event.ctrlKey

Related

ckeditor execCommand dialog not showing

I created a dialog in ckeditor.
editor.ui.addButton('blublu',
{
label: 'blublu',
command: 'blublu',
icon: this.path + 'icons/blublu.png'
}
);
editor.addCommand('blublu', new CKEDITOR.dialogCommand('blublu'));
CKEDITOR.dialog.add( 'blublu', this.path + 'dialogs/dialog.js' );
If I press the button the dialog shows, everything is fine. Now I try to open this window from another dialog :
( function() {
CKEDITOR.dialog.add( 'templates', function( editor ) {
return {
title: editor.lang.templates.title,
contents: [...],
onHide: function(){
if(condition)
//dostufff;
this.hide();
editor.execCommand('blublu');
}
}
}
});
It works the first time the editor is loaded. But if I open the dialog from the button in the toolbar, and I close it, I can't open the dialog from the 'templates' dialog. I have the dark background as if a dialog where shown, except the dialog, is not there. It is hidden and just shows it is not enough because all buttons handlers on it don't work.
I have no error in console.
Any solution?
I've tested it with existing plugins and it looks like you need to call execCommand asynchronously with setTimeout.
setTimeout( function() {
execCommand( commandName );
} );
If fix doesn't work for every browser, then you will have to add some short delay. I don't see better solution.

Open/Select KendoUI PanelBar

When I click on a bar of a PanelBar I both select the option as well I toggle it (open / close). Is it possible not to open it but just select and click on the icon for controlling open/close?
I am afraid this is not supported. As a partial work-around you can make the PanelBar expand and select only by clicking the expand arrow like this:
$('#panelbarName>li').on('click',function(e){
if(!$(e.target).is('.k-icon')){
e.stopPropagation();
}
})
Unfortunately there is much more logic to be handled to just select (highlight the item) without expanding it.
$("#panelbar>li").on("click", function (e) {
if ($(e.target).is(".k-i-arrow-s")) {
$("#panelbar").data("kendoPanelBar").expand($(e.target).closest("li"));
}
else if ($(e.target).is(".k-i-arrow-n")) {
$("#panelbar").data("kendoPanelBar").collapse($(e.target).closest("li"));
}
else {
$("#panelbar").data("kendoPanelBar").select($(e.target).closest("li"));
}
e.stopPropagation();
})

How to Set TabIndex on Press Enter Tab in MVC3 Using Jquery

my Problem is that, when i press the enter Button in any textbox or place in form the cursor Automatically go to create button and press it..... i working in mvc3, so please tell me any solution....
You could subscribe to the .keypress() event of the form and cancel it if it was Enter:
$(function() {
// subscribe to the keypress event of the form
$('form').keypress(function(e) {
if (e.which == 13) {
// if Enter was pressed cancel the default action and
// prevent the form from submitting
return false;
}
});
});

jQuery click event behaves differently with live function in Firefox

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.

How can I prevent Firefox from opening the gridview header sort postback link in a new tab on Ctrl Click

I am trying to make my gridview control in ASP.Net do a multi sort based on if the user pressed Ctrl key when trying to sort by clicking on a column name. The problem is that when I am using Firefox, if I click on a column name with Ctrl key pressed, the browser tries to open "javascript:__doPostBack('ctl00$ContentPla..." link in a new tab. IE and Chrome both don't do this unless the link is a real link.
Is there a way I can prevent Firefox from opening the link in a new tab and still cause the page to postback normally?
Thanks.
You need to capture the event of the Ctrl key being pushed down, using document.onKeyDown.
In your event handler, check if 'Ctrl' (key code 17) was pressed, as follows:
function document_keyDown(e) {
var KeyID = (window.event) ? event.keyCode : e.keyCode;
if (KeyID == 17) {
ctrlDown = true;
}
}
Here, I'm setting a 'ctrlDown' variable to true.
For the onKeyUp event, you can do the exact opposite:
function document_keyUp(e) {
var KeyID = (window.event) ? event.keyCode : e.keyCode;
if (KeyID == 17) {
ctrlDown = false;
}
}
Then, in the click event of your column elements, you can check if Ctrl has been clicked or not:
function columnElement_click() {
if (ctrlDown != undefined && ctrlDown == true)
alert("Ctrl + Click Received");
return false;
}
Make sure your column click handler returns false. Otherwise, the browser will execute the code, but then navigate to the address in the link's 'href' attribute.
Hope this helps.
(See also: http://www.geekpedia.com/tutorial138_Get-key-press-event-using-JavaScript.html)

Resources