Cannot find html in Assets

[bucklerco]

Good morning Pythonistas!

I am trying to make a link not create a new tab but go to another webpage within the tab.

I know I have to change the tag and change the target="_blank" parameter; but when I go to assets and look at the standard-page.html file it does not have all the html I need.

Maybe we should have a way to move from one type of app to custom html if we want to.

[bucklerco]

Replying to myself to show progress, I am just rewriting everything from a scratch custom-html app.

[david.wylie]

Not 100% sure I’ve understood correctly, but if I have …

You can’t move inside the current tab, because your app is a Single Page Application, and doing so would destroy it for that tab.

Is the page you’re trying to move to part of your app or external?

[bucklerco]

It is external; I am trying to reach a splash page I made for another business.

[david.wylie]

Ok, so is the intended behaviour to remove the Anvil app and pass all control to this other page?

Actually, my answer is the same regardless

Anvil currently doesn’t support opening links in the same tab. It will destroy the running app and that’s rarely desired behaviour. Also, read Meredydd’s comments here :

Equivalent to HTML Anchor in Anvil?

Yeah; all Links with urls open their targets in a new tab (otherwise it would be impossible to link to an http:// URL, due to browser security rules). It would be useful to have some kind of “scroll until this component is visible on the screen” functionality, though, without breaking out to HTML. I’ll consider that a feature request!

[bucklerco]

Sweet; Thanks for the quick reply.

I skimmed Meredydd’s comment and it makes sense; I am not too knowledgeable about browser security so I am glad that I use anvil!

[david.wylie]

What exactly are you trying to achieve? I might be able to help.

[bucklerco]

I am trying to make anvil applications seamlessly connect to a nav bar of an existing website. As a quick and simple solution I am thinking about connecting the anvil url’s to the tags after I get the functions I want in the app.

The problem above arose because I want the application to be able to go back to the other pages in the already existing website from the same page.

[david.wylie]

Could you maybe embed the Anvil app in an iframe?
That way the app becomes part of your existing pages.

[bucklerco]

Ignorance alert! lol I didn’t know there was a specific tag for this use.

Now I won’t have to design everything again and I can just put an I-frame tag in the already existing html. My economics degree is showing here.

Thanks David!

[david.wylie]

no problem.
Glad I could help.

[ian.monat]

@david.wylie do you have an example or a code snippet of this? Not necessarily using an iframe, but of ‘exporting’ an Anvil app or app component to an existing website. Thanks -Ian

[david.wylie]

Assuming you’re asking if you can export the Anvil app to run on, say, Apache web servers - in short you can’t. Anvil apps need their own ecosystem to run in, so unless you have an on-premises version (which they do offer) you’ll always be running the code from Anvil servers. Even then I doubt (though I don’t know for sure) you’d be able to export the app in the way I think you’re thinking.

That’s why you need an iframe - you use the URL of the app as the src to embed it. It’s as simple as :

 <iframe src="https://<your-app-url-here"></iframe> 

Pretty sure there’s no way to do it the other way around. @meredydd or @daviesian would need to confirm for sure, though.

[ian.monat]

Interesting. So you have to run the whole Anvil app in the iframe.

Can the app interact with the rest of the page outside of the iframe, or is the rest of the page static?

For example - if a user logs into their account in the app, in the iframe, can a button text in the header, outside of the iframe, change from ‘login’ to ‘logout’?

…and do, say, the Anvil buttons take on the CSS button style that is for the rest of the site, or is their style determined by the Anvil stylesheet?

[david.wylie]

@ian.monat

if a user logs into their account in the app, in the iframe, can a button text in the header, outside of the iframe, change from ‘login’ to ‘logout’?

Chances are you are going to get into cross domain security issues (see this : javascript - access and change parent page from iframe (with jquery) - Stack Overflow) as the app is served from a different domain.

@ian.monat

and do, say, the Anvil buttons take on the CSS button style that is for the rest of the site, or is their style determined by the Anvil stylesheet?

Not by default, no. The iframe is a self contained page.

A lot of what you are asking might be technically possible with some serious experimentation, but in all honesty (and in my opinion) you are starting to go so far off piste that even if you did get it working it would be very fragile.

If you really want to get the two apps interacting, I would suggest building an API in the parent page (equivalent to an Anvil HTTP endpoint). That way you can call it from Anvil.