Simple link doesn't work

[I Grog]

In this code: http://jsfiddle.net/PDwBF/1/
link to google doesn't work. How to repair it?

<ul data-bind="foreach: Items">
<li data-bind="click: $root.SetCurrent">
<p data-bind="text: id"></p>
<div>
<a href="http://google.com" target="_blank">Go to google</
a>
</div>
</li>
</ul>

function ViewModel()
{
var self = this;
self.SelectedItem = ko.observable();
self.Items = ko.observableArray([]);
self.SetCurrent = function(item)
{
self.SelectedItem(item);
};
};

var vm = new ViewModel();
ko.applyBindings(vm);

vm.Items.push({id: 55});
vm.Items.push({id: 66});
vm.Items.push({id: 77});

[rpn]

Hello-

One option is to return true; from your SetCurrent methood, which will allow the default action to proceed like: http://jsfiddle.net/rniemeyer/PDwBF/3/ 

[I Grog]

Thanks, but what is wrong with button tag and click binding?

Why it doesn't work as expected?

http://jsfiddle.net/6jXW7/1/

<ul data-bind="foreach: Items">
<li data-bind="click: $root.SetCurrent">
<p data-bind="text: id"></p>
<div>
<a href="http://google.com" target="_blank">Go to google</
a>

<button data-bind="click: $root.DoIt($data)">Do It</
button>

</div>
</li>
</ul>

function ViewModel()
{
var self = this;
self.SelectedItem = ko.observable();
self.Items = ko.observableArray([]);
self.SetCurrent = function(item)
{
self.SelectedItem(item);

return true;
};
self.DoIt = function(item)
{
console.log(item.id);

[Philip Steinebrunner]

Hi

It's because you write "$root.DoIt($data)" but you should write
"$root.DoIt". With your writing the function gets executed when ko
setting up the bindings and returns void to the click binding handler.
You don't have to pass $data to the function because thats implicitly
done by knockout already.

Here is the correct code:
http://jsfiddle.net/philipooo/6jXW7/2/

- Philip

[I Grog]

Thanks,
I've added in SetCurrent console.log command

http://jsfiddle.net/6jXW7/3/

Why if I press button, SetCurrent function also executes?
I don't need it, how to avoid it?

[philip.ste...@googlemail.com]

Because you handle all clicks within the list-item. You can prevent this by adding clickBubble: false to the button-binding:
<button data-bind="click: $root.DoIt, clickBubble: false">Do It</button>

[I Grog]

Thanks