I have a WebView and I want to detect when the user clicks a link. However, there is no event that occurs when the user clicks a link. In Silverlight, WinForms, and WPF, there was the WebBrowser control with the Navigating event, but WinRT's WebView seems to be lacking many events. I cannot modify the web page as I am not the owner of it. Is there any way to detect when the user clicks a link?
In addition, the Source variable does not change when the user clicks a link, only when it is manually assigned to.
The idea is to alter the source HTML for all links to call a custom OnClick script, and attach an event handler to the ScriptNotify event of the WebView
Related
Picture a very common use-case described in the official Handbook: a <turbo-frame> that contains pagination links.
So, turbo supports (encourages?) annotating these pagination links with data-turbo-action="replace", and the resulting experience is very nice: browser URL gets updated, a page reload will load the correct pagination and the browser back button will show the last page loaded correcly. 🎉
However, as soon as you add data-turbo-action="replace" on any link, they start firing a turbo:load event on the page when clicked, even tough they are inside a <turbo-frame>; in my mind, turbo:load should be analogous to a DOMContentLoaded event, and it should fire only ONCE per page loaded; if a turbo frame is being navigated by pagination, I don't want my event handlers designed for the page that contains the turbo-frame to be fired again and again each time a frame within the page paginates.
Note that this ONLY happens if data-turbo-action is present; otherwise, the links inside the turbo-frame will not trigger a turbo:load on the page.
Lastly, the turbo:load event being fired is indistinguishable from the one on the first page load or from a full turbo visit outside the turbo-frame; it's target is the page's root html element, so I can't even detect it was a turbo:load coming from a turbo-frame.
So, how to avoid links clicked inside a <turbo-frame> that were marked with data-turbo-action="replace" to trigger turbo:load on the page, or at least distinguish these events from the sole turbo:load fired as soon as the page loads for the first time?
I have a dialogue box that is:
Draggable
Modal
Requirement:
I have a requirement where I don't need to close my dialogue and have to load the different pages in the background on the selection of data from the grid that is on Dialogue.
What did I do:
I know how to open the page in the background with the help of a de-attached listener.
vehicleInfoPopUpView.addDetachListener(e -> {
UI.getCurrent().navigate(AssignmentPageContainer.class,
String.valueOf(vehicleInfoPopUpView.getCanFileNumber()));
});
The above code (in the parent page) loads/opens a new page but to do this I have to close my dialogue box (which I don't have to do, I have to keep the dialogue box open).
I cannot find any resource that tells me How to load/open a new page in the background from the dialogue box without closing it
Any small help! Thanks for the help in advance.
First of all: Don't.
Keeping a modal dialog open whilst navigating to a different page/route makes no UX sense. A modal window means you cannot interact with the background.
Just call UI.getCurrent().navigate(AssignmentPageContainer.class) directly (outside of detach listener) to open the view based on the selection. The user will open the dialog again himself, if he will want to. You can trigger this on some button click.
Secondly, as a workaround you could store the state of the dialog in a #UIScoped service and open & reinitialize the dialog f.e. in the afterNavigation method.
I'm trying to set up automatically focus on first loaded article. (f.e. user clicks on the button "load more" and new articles are loaded).
My react implementation:
I'm using ref attribute in <Link> component, which is from react-router library and then I'm calling focus() method in lifecycle method componentDidMount().
It works on all devices except iOS. If I turn on voiceover on iphone and then on webpage I click on the button, it doesn't automatically focus on first loaded article). It works just with html anchor tag.
I read some articles before and it looks that it's not possible to do this in this way but only with firing some event f.e. click event.
Can someone confirm that it's not possible to solve it in this way or there is any workaround without using jquery ?
I am using a WebView control to show some html pages and now i have to support text selection feature on this
browser control. I am plannig to show some ActionMenus to user once he select some text
User hit on control and start text selection by dragging
User doubleclick on a text and select the text
If its a touch device user do tap event and might select the text
So how can i raise the event to show the Menus to end user
KeyDown
KeyUp
DragEnter
DragLeave
DoubleTapped
DO i need to use all these events to make it work on both keyboard/mouse interaction & touch interaction
WebView does not natively support the events that you have specified.
Refer : WebView Documentation - Events section.
Also read the Remarks section to find a workaround for your problem.
Quick read from documentation : WebView doesn’t support most of the user input events inherited from UIElement, such as KeyDown, KeyUp, and PointerPressed. A common workaround is to use InvokeScriptAsync with the JavaScript eval function to use the HTML event handlers, and to use window.external.notify from the HTML event handler to notify the application using WebView.ScriptNotify.
I want to have an input field in my page and a button so that the user can manually enter the tweet text and then when he its the submit button, the actual twitter status submit will open with the text the user entered.
moreover, I also want to get a callback when a user submit the tweet on twitter like Web Intents Javascript Events
as far as I know there are 2 ways to do that:
re-render the tweet button after every change of the input using twttr.widgets.load();, something like this example, only instead of the update button use the onchange event of the input. the problem is when the tweet button is re-rendered its disappears for a moment.
the next option is not to use the twitter button, instead when the user hits submit open a new window and redirect to https://twitter.com/share with the tweet text as the query param (like twitter suggest in Build Your Own Tweet Button). the problem with this solution is that I dont get an event when the user submit the tweet on twitter.
Any ideas how I can combine both requirements, dynamically change the tweet text & getting an event on tweet submit?
Not sure if this would work, but my first thought is to use the tweet button, and add an invisible div over it which will capture the user's click, reload the widget with the user's text, and trigger a click on the widget 250ms later (or however long it might take it to reload on a slow device). You'll only get one flicker, so it wouldn't look smooth, but it wouldn't look like a bug either.