How to bind knockoutjs value to MVC Action Link (id)

Question

I have table view binds with knockoutjs model.

<tbody data-bind="foreach: items, visible: items().length > 0">
    <tr>
        <td data-bind="text: Title"></td>
        <td data-bind="text: Type"></td>
        <td data-bind="text: Author"></td>
        <td data-bind="text: Description"></td>
        <td data-bind="text: Time"></td>
        <td data-bind="text: Publisher"></td>
        <td data-bind="text: itemId"></td>
        <td>@Html.ActionLink("Edit", "Edit", "Manager", new {id = <knockoutjs model itemId value here>}, new {@class = "cssClass"})</td>
    </tr>       
</tbody>

I will explain the code. I have knockoutjs model which contains itemArray(items). I want to create actionlink and bind id value to (itemId) which is coming from knockoutjs model.

Hope you understand my issue

Thank you in advance

Darin Dimitrov · Accepted Answer · 2013-01-27T15:20:26.413

24

<a data-bind="attr: { 'href': '@Url.Action("Edit", "Manager")/' + itemId() }" class="cssClass">
    Edit
</a>

edited Jan 27 '13 at 15:20

answered Jan 27 '13 at 13:52

Darin Dimitrov

1,023,142
271
3,287
2,928

small correction. itemId needed brackets. itemId(). but answer is pretty straight :) Edit thank you soooo much. save my day....!!!! – yohan.jayarathna Jan 27 '13 at 15:18
1

Good point. I have updated my answer to take your remark into account. Thanks for spotting this. – Darin Dimitrov Jan 27 '13 at 15:20
Hi, How can I do the same for Ajax.ActionLink(...) ? Is it possible ? @darin-dimitrov – yohan.jayarathna Jan 27 '13 at 15:25
1

Why do you need to use `Ajax.ActionLink`? You could easily achieve the same effect with jQuery. I don't think that using server side helpers would work in this case. – Darin Dimitrov Jan 27 '13 at 15:26
Hmmm... Agreed to you. I thought so too. Just asked. thanks :) – yohan.jayarathna Jan 27 '13 at 15:28

score 1 · Answer 2 · answered Jan 27 '13 at 13:47

I'm not sure I understand what you're trying to do. But this code

<td>@Html.ActionLink("Edit", "Edit", "Manager", new {id = <knockoutjs model itemId value here>}, new {@class = "cssClass"})</td>

will not work, because knockout is a client side javascript, while the razor syntax is executed in the server and renders only html string.

Why not replace @Html.ActionLink with a normal html hyperlink

<a href="someurl" data-bind="attr: { href: Link }, text: SomeField"></a>

How to bind knockoutjs value to MVC Action Link (id)

2 Answers2