Pass Variable into location.href - html

I have a dynamic Url, and in my html i want to do something like this:
<a onclick="location.href='myVariable';"><span>Click here</span></a>
This spells out the word 'myVariable' in the URL instead of using the value of my variable. I have also tried:
<a onclick="location.href='{{myVariable}}';"><span>Click here</span></a>
I used the brackets since my application is using angularJS, but that doesn't work either.
Is there a way to do this in HTML? Rather than using an onclick javascription function?
Any help is appreciated!

Try this:
<a ng-href="{{myVariable}}"><span>Click here</span></a>

You don't have to use an onclick event when clicking on an "a"-tag. The tag is used to hyperlink to another page. Use this:
<a href='myVariable'><span>Click here</span></a>
And if you´re changing the url, perhaps you should add a slash before 'myVariable':
<a href='/myVariable'><span>Click here</span></a>

Related

HTML, A href and name

Which one is the correct way or using a tag in this context?
<a name="test">Test</a>
or
<a name="test></a>Test
the correct is the first one
Test
The first example is correct
<a name="test">Test</a>
The correct syntax is link text
"name" is not a valid attribute for <a> tag. The allowed attributes are:
download, href, hreflang, media, ping , referrerpolicy, rel, target and type. Of course, <a> tag also allows global attributes and event attributes in addition to these.
If you want to use custom attributes consider using data- format like data-name
eg.
link text

How put url to another page in css

I need to put a link to another page in my h2 element. I don't want use href but I need to do this with css
Suppose to have this:
<h2 class="path">Edizione</h2>
And in my css
. path {
url: 'https://www.w3schools.com/css/css_link.asp';
}
Anyone can help me?
Sorry, but you can't do this with CSS. Also, I'm pretty sure href is for the <a> tag.
If you want your <h2> to be a link, either wrap it with an <a> tag, or put the <a> tag inside it, like this:
<h2>link</h2>
<h2>link</h2>
CSS Doesn't let you do redirects, instead try using JavaScript's built in Window.location method. If you have an even binding for an (onClick) event simply add this code inside of the callback and your page will re-direct to the url provided.
Window.location = 'https://www.w3schools.com/css/css_link.asp';

Angular translate with html and ngHref

I have this key/value in a Json file to use in angular-translate:
{"MEETING_LINK": "<br/>Maybe you want to see the <a class=\"pink-link\" ng-href=\"/{{meetingLink}}/{{meetingId}}\">full meeting<a/> first?"}
When I invoke the translate in my html like this:
<span
ng-bind-html="'GLOBAL.REMOVE_MODAL.MEETING_LINK' | translate:
{ meetingLink: meetingData.buttonLink, meetingId: meetingData.id}">
</span>
It does not work. But if I replace the ng-href in the anchor:href="/{{meetingData.buttonLink}}/{{meetingData.id}} It works.
Besides I want to add a ng-click to the anchor element, I guess angular directives in the html do not work.
Can I do some trick to make this happen?
Try adding translate-compile to your span if you're using angular-translate 2.x.

How to add inline computing in knockout data-bind?

How can I build a hyperlink like this?
View Detail
Can I do something like the one below?
<a data-bind="href: '#/detail/'+id">View Detail</a>
I just don't think it is necessary to created a computed observable for href. There must be an easy way, some inline markup.
I just figured it out by trying different things:
<a data-bind="attr: {href: '#/view/'+id()}">View Detail</a>
It just works!
You need to do something like this:
<a data-bind="href: '#/detail/'+id()">View Detail</a>
But, in order to make a good practice of MVVM pattern i suggest you to create a computedObservable

mailto: problem

I'm trying to set up the following mailto: link:
<a href='mailto:info#example.com?subject=Testing&body=http://www.google.com?foo=1&bar=2'>Send mail</a>
However the second argument (bar) is cut off because it is seen as an argument of the mailto link and not the link I'm putting in the body. I tried & but it does the same thing since it's being rendered into the link.
What about something like this :
<a href='mailto:info#example.com?subject=Testing&body=http%3A%2F%2Fwww.google.com%3Ffoo%3D1%26bar%3D2'>Send mail</a>
ie, urlencoding the whole body field, to make sure nothing causes any problem ?
Use "%26" instead or use urluncoding like suggested in another answer. For PHP rawurlencode works well.
<a href='mailto:info#example.com?subject=Testing&body=http://www.google.com?foo=1%26bar=2'>Send mail</a>
Try putting the value for body into quotes like:
'mailto:info#example.com?subject=Testing&body="http://www.google.com?foo=1&bar=2"'
Nvm, turns out putting %26 works instead of ampersand.
Use %26 as &.. its the html escape code for &.
<a href='mailto:info#example.com?subject=Testing&body=http://www.google.com?foo=1%26bar=2'>Send mail</a>