Hashed anchor tags don't navigate to area on page in Electron - hyperlink

When creating anchor tags that use hashes to navigate to elements on the page with related ids, Electron doesn't navigate to those. It tries to load the page again.
How do you allow Electron to navigate to links on the same page?
In other words:
Navigate
....
<div id="someLocation">to here</div>
doesn't work.
I tried to catch the did-navigate-in-page webContents event, but preventing default didn't work either.

Related

Rails 6/Hotwire - how force "full page load" when link_to a certain page

I'm using a Rails 6 template (Jumpstart Pro) that has the new stuff hotwire, stimulus, webpacker. It works OK for basic stuff... scaffolding new models and make CRUD forms, etc.
However one of my pages uses a vendor's javascript widget, which also requires jquery.
Neither Jumpstart Pro template nor its Forum have any up-to-date documentation or support for adding jQuery via webpacker (e.g., no support for adding jquery the "right way").
So I've added jquery to the one page that needs it via a good old fashioned script tags in the header
%script{:src => "//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"}
followed by the vendor's javascript to initialize the vendor's widget, inside $(document).ready(function(){ init_code_goes_here }); so the widget has time to load to the page.
Works: If I type the page's url into the browser "localhost:5000/cool_page" or "mydev.ngrok/cool_page", it works fine.
Broken: But clicking a link IN the app to go to the page (via link_to "cool page", "/cool_page") does not work:
jQuery is loaded (I have a little "hello world" jquery script that un-hides a div to confirm jquery is loaded)
the vendor widget does not load properly (browser console says widget object is null)
But if I then refresh the page, everything loads fine.
So the page works if "loaded" but not it reached via another page.
From this I infer that the magic behind hotwire/etc is interfering with a proper load of the page when I navigate to it.
So, the question: in a hotwire-enabled Rails 6 app, is there any way to have a nav link that, when clicked, simply tells Rails... skip hotwire shortcuts, load this page for real?
I believe your issue is just that you need to restore default (non-Hotwire) link behavior. There are 3 ways to do that.
See this answer: https://stackoverflow.com/a/68657223/2648054
In short:
1: Set the data-turbo attribute to false.
2: Set the target attribute to "_top".
3: Move the link outside any Turbo frame. Any link inside a Turbo frame, without one of the above attributes, will be handled by Turbo by default.

Why target="blank" attribute doesn't work in this case?

I have a Home page with links to Offer page and Contact page, which are different .html files, and a Home page, which is current file.
First two have attributes: target="blank", and rel="noopener noreferrer".
When i click on one of those links, it correctly opens new page in a new tab.
But when i come back to Home page using Home link and then i try to open one of the two first links, the attribute target="blank" doesn't work anymore and I'm getting redirected to chosen page, instead of opening it in a new tab.
Can anyone explain what is happening? Can i change this behavior?

Why aren't styles loading in second page in jQuery mobile?

Below is the part of screenshot of mywebsite/index.php, a PC site with NO jQuery Mobile (JQM), with all scripts and styles.
Below the screenshot of mywebsite/mobile/options.php, a page designed to be run on mobile browsers, having JQM.
Here is the HTML script for Logout button, actually an ahchor tag:
Logout
.. refers to the main mywebsite folder out from mobile folder.
When I tap/click Logout, it should go to mywebsite/index.php, the PC site. And here's what shows up:
If I display the location using alert(document.location);, it shows - mywebsite/mobile/options.php.
I have to press F5 to view the page as it should.
I know that this is happening because JQM loads the pages AJAXually and hence ignores all scripts and stylesheets outside of BODY tag. I know this question is duplicate of many questions in StackOverflow and I have tried my level best to find a solution, but can't find one.
How do I move to the index.php without need to refresh?
You need to add additional code to your logout.php file to execute after the logout code executes. PHP headers can accomplish this. Within your PHP tags, add this to the end of your code:
header( 'Location: http://mywebsite/index.php' ) ;

jQuery Mobile: Same page with different data-urls

I have a web application made with jQuery Mobile beta 2. The start page of the application has the URL http://server/mob/start.php and its page div has ID 'frontpage' and data-url is also 'frontpage'.
When I click a link from the start page and from the just opened page click Home button which points back to URL /mob/start.php, I end up with two frontpage divs in my DOM. The newly added frontpage has the same ID but its data-url is '/mob/start.php/'.
I could of course remove the page divs where I'm navigating away from but after the above described navigation the browser is pointed at URL /mob/start.php#/mob/start.php. Thus when I reload the page, I end up with same situation again.
What am I doing wrong because this problem doesn't seem to appear in jQueryMobile.com site?
UPDATE: Each page is an independent page and contains only one page div so links are not made by ID but by local relative URL.
I updated jQuery Mobile to beta 3 and can no longer reproduce the problem.

JQuery Mobile - always show back button, regardless of entry point

I'm making a mobile site with JQuery Mobile and need to allow entry to any section and still allow the user to navigate backwards.
Example to show what I mean. The JQuery Mobile demo site starts at:
http://jquerymobile.com/demos/1.0a3/
If I click on "Toolbars" I reach:
http://jquerymobile.com/demos/1.0a3/#docs/toolbars/index.html
There is a back-button which leads to the previous site. But if I manually enter the above toolbar URL into my browser the page will not have a back button.
How can I accomplish to always have a back button, while still keeping the nice AJAX backed page loads? The server back-end will generate all html-pages so it's fine to "hard code" what the previous section is.
If it's fine to hardcode, then just add
<a href="hardcodedprevious" data-icon="back" />
to the header

Resources