I wrote an electron app that has a html table with click events on the first column. The click events fire as long as BrowserWindow frame: true if I change it to false the click events on the table stop working. I also have a button on the same page that is not affected by changing the frame property. Anyone know why this happens or a work around?
The problem with the click events was that I made the window that the table is located in a draggable region and forgot that doing so makes items not clickable. So in my css for the table I added this line "-webkit-app-region: no-drag" which solved the problem.
Related
I'm using Ranorex (v10.1.6) for a Desktop Application written mostly in C#. On a Form there is a table with rows and cells. When clicking on a date cell, it should reveal a button to open the calendar. Therefore I require first a click on the table cell which should make the calendar button visible, after which I then can click the calendar button.
Problem: The click() event does not make the button visible. It seems that the click event does for a fraction of a second make the calendar button visible, but then it disappears again.
It seems that the click event does after the click something different which hides the calendar button again. I also tried to accomplish the same with the Mouse Click, and Mouse.ButtonDown(System.Windows.Forms.MouseButtons.Left) followed by Mouse.ButtonUp(System.Windows.Forms.MouseButtons.Left), but this didn't work either.
Anything else I could try to get this to work?
With vaadin 23.1.x you can set a itemClickHandler when a user click on a item/row in the grid with myGrid.addItemClickListener(..)
This works fine.
But if you have a component column, with a button in it, then the ClickEvent of the Button is fired and also the itemClickListener of the grid row.
Is there a way to prevent the button click from also triggering the itemClickListener?
You must use this method to add the listener them you can
myGrid.getElement().addEventListener("item-click",
event -> ...)
.addEventData("event.stopPropagation()");
I'm not 100% sure if the even is item-click or just click.
I have a kind of "widget" - a data table with some rich functionality like sorting, row selection and else.
In some cases (widget placement/nesting in DOM) clicks on it's rows are not triggered in iOS 7 Safari.
Widget is using jQuery 1.6.4
I can't publish a whole widget code (and you really wan't this to happen ;)), but I can narrow down a reproduction scenario to the following case:
Simple html table with some rows, two cols in each
First column contains a "checkbox" - simple div which is normally hidden and becomes visible, then parent row getting hovered. Visibility is triggered with CSS only
Every row has a click event handler. No mater what it does. In my example it will trigger an alert()
Table's parent is a block element with a fixed height and overflow-y set to auto
Table is bigger than it's parent, so, some table content is hidden and can be seen with scrolling
Here is a jsFiddle: http://jsfiddle.net/822eG/4/
On any desktop browser items are successfully hovered, click is triggered. On iOS7 hover is working but click is NOT triggered.
NOTE: On iOS you must tap twice to trigger click. First click will trigger hover and you'll see a "checkbox", then second tap must trigger a click, but it doesn't...
Any of those conditions is REQUIRED to reproduce an issue. Remove a single one and it starts working...
If you remove a "checkbox" appearance - click will work (http://jsfiddle.net/822eG/5/).
If you remove a height fix - it will work (http://jsfiddle.net/822eG/6/).
If you remove a overflow scrolling - it will work (http://jsfiddle.net/822eG/8/).
Any workaround is needed but functionality should be kept untouched. So, I can't remove "checkbox", size fix, hovering, clicking or overflow scrolling. Also, changing HTML markup is hardly to happen.
NOTE I've got a solution - see my answer below. But I still need a better workaround to keep using CSS as mush as possible.
ADD: Filed a bug to Apple #16072132
Try this:
.wrapper {
-webkit-overflow-scrolling: touch;
}
To get iOS to ignore hover states, try this:
.wrapper
{cursor: pointer;}
You can use this on any element to get it to function as expected.
Suddenly, I've got a solution... Using JavaScript I can remove :hover selector but still keep functionality.
If I will trigger checkbox visibility not by CSS :hover but by class and set it via javascript, it will work.
http://jsfiddle.net/822eG/10/
My current working solution requires no any changes in a whole code base and works fine in our conditions
With MutationObserver, monitor node insertion into head
If new node is inserted, and this is a link, check document.styleSheets
For each sheet check it's rules
If rule selector (access by document.styleSheets[n].rules[i].selectorText) contains :hover check styles for this selector
If styles contains display different from none or visibility different from visible - this is a "show by hover" style
For each such style change it's selector - replace :hover by .hover and declare a body delegate for mouseenter and mouseleave events which will toggle .hover class on triggered element
Full source code here: https://gist.github.com/Olegas/9143277
..try using this:
$('.row').on('touchstart click', function(){
alert('clicked');
});
I am using jQuery mobile and trying to show jQuery pop on page load. But when the page is loaded popup is not appearing in center, instead popup's TOP LEFT corner is appearing in center.
But as soon as browser window size gets change popup automatically shifts to center (Even if I press F12 for developers tool). And then all frequent calls to $('#popupBasic').popup("open"); make it to appear in center of the screen.
But first time top left corner of the popup box appearing in center.
try this: data-position-to="window".
this is the source
You may try repositioning the popup on pageshow:
$( '#popupLogin' ).popup( 'reposition', 'positionTo: window' );
I reckon what you are experiencing is down to the positioning happening prior the page is fully drawn by the browser. You can overcome this by repositioning the popup like this:
$(document).on('pageshow', '.selector', function(){
$('#popupBasic').popup('reposition', 'positionTo: window');
});
$(document).on("popupafteropen", function() {
$('#popup').popup('reposition', 'positionTo: window');
});
You can use the custom pop up events to reposition it after opening
I was getting the same error. You only want to show the popup after the page has been painted.
Adding your code to listen to the pageshow event instead of the pageinit event will probably fix your problem. It fixed it for me.
This is a very vague question.
A few items you should provide:
What browser are you testing on and what version?
What version of JQM?
Are there any custom CSS interacting with JQM?
As of JQM 1.2, Popup options available:
default: "origin"
Sets the element relative to which the popup will be centered. It has the following values:
"origin" When the popup opens, center over the coordinates passed to the open() call (see methods page).
"window" When the popup opens, center in the window.
jQuery selector When the popup opens, create a jQuery object based on the selector, and center over it. The selector is filtered for elements that are visible with ":visible". If the result is empty, the popup will be centered in the window.
Source
It worked for me when I set the width of popup div manually; try:
$("#popupBasic").css("width","200px");
how can I animate only a part of an element?
I show/hide a div using jquery-ui's show method but I'd like to start/end the animation from/to a given height of the element.
My dev website can be seen here (link removed). When clicking on the 'Contact' button the contact page shows up or hides if it's already open. Since I couldn't find how to starts my animation from a given height I added a fixed button when it's closed, but when the contact button of the contact page overlaps the fixed button when it's closing...
Any help welcome!
looking for something like this??
http://jsfiddle.net/rlemon/F6Efp/8/
You can also add any fade or whatever effects. This is using a single button to animate both open and close. You could also attach a attribute to the button tag to define it's current state.