How to add inline computing in knockout data-bind? - html

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

Related

Pass Variable into location.href

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>

How to use a link as image title in html

I made attempt and tried to find my goal But I couldn't and found solution like this that didn't benefit for me!
I have <img src="url" title="ali.com"> I want to make ali.com a link. I used
title=ALI.com but doesn't work! any way?
The title attribute accepts only plain text, you cannot have any markup there.
If you want a tooltip with a link inside (and I'd urge you not to as it is a difficult UI to use), then you'll need to build the whole thing with JavaScript and DOM.
Above answers suffices your requirement, but specific to your use case :
<img src="image url" title="ali.com"/>
You can use url as a title (google.com?d=1&e=2 this is string)
You need to run little js code to achieve final goal
put something like this html
<a class="mylink"> <img title="blahblah" scr =""></img></a>
and you can get title string by
yourtitlestring = $(".mylink img").attr("title")
and now you can set href of link
$(".mylink").setAttribute("href", yourtitlestring);

passing angular.js variables to html?

I have an angular app in which there's a table that includes something of the general form:
<tr ng-repeat='d in data'>
<td>{{d.foo}}</td>
</tr>
I'd like to use the value of d.foo (which, for example, could be Bicycle to turn the cell into a link to a website like http://en.wikipedia.org/wiki/Bicycle. I've tried to find an answer to this on SO already but have had no luck; my apologie if I just didn't see it.
Is it possible to do the described task? If so, any pointers or suggestions?
Use:
<td><a ng-href="http://en.wikipedia.org/wiki/{{d.foo}}">{{d.foo}}</a></td>
You can read more here: http://docs.angularjs.org/api/ng.directive:ngHref
;)
Use it in a <a> tag.
For example:
{{d.foo}}

using bean: write inside html:form action

Hope you guys can help me out, i can't find any tutorials online regarding this.
How can you use a
<bean:write....>
inside a
<html:form....>
My code is like:
<html:form action="/restricted/client/social/NewsFeedAction.do?action=REPLY&id=<bean:write name='adminFeed' property='id'/>">
then when i check the id value through debugging its just
<bean:write name='adminFeed' property='id'/>
instead of the ID value like 555 or so...
I can confirm that this bean write tag works as can use that within a
<a href...>
tag no problem.
Any ideas?
Thanks!
You cannot use tag inside another tag.
I use small workaround.
<bean:define id="myId" name='adminFeed' property='id'/>
<html:form action="/restricted/client/social/NewsFeedAction.do?action=REPLY&id=${myId}">

Are there any HTML elements I could use as an "ID" element?

I'm using Evernote to sync data with my app, but I need the notes and their media items on Evernote to have an ID the same as the syncID held within my app, to match data with it's sync'd counterpart. To do this, I want to add a tag in the HTML which contains my syncID. Is there a tag I could use for something like this? Something for an 'id' function, or other custom function?
EDIT:
Example. Let's say the evernote note is like so:
<en-note>This is a note</en-note>
But I want to find out the ID of this note, to see if my app contains it or not. So ideally I'd have something like this:
<noteID="vdsijfewo329ds"><en-note>This is a note</en-note></noteID>
Or something similar, to help me find out which note this matches inside my app. Is this possible?
EDIT: Evernote disallows use of the data- attribute. So this:
<span data-syncID="fdshfiewo">
Would not be allowed.
option 1 (general usage, not supported by Evernote today) you could use HTML5 data attributes
<span data-nodeID="vdsijfewo329ds"><en-note>This is a note</en-note></span>
option 2 you could try <figure> - <figcaption> HTML5 pair:
<figure>
<en-note>This is a note</en-note>
<figcaption style="display: none">vdsijfewo329ds</figcaption>
</figure>
option 3 class attribute (this was the reason data-* attributes were created, this could be the last resort option
<span class="en-note vdsijfewo329ds"><en-note>This is a note</en-note></span>