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

Roby

Answer 1

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

Monosyllable

small correction. itemId needed brackets. itemId(). but answer is pretty straight :) <a data-bind="attr: { 'href': '@Url.Action("Edit", "Manager")/' + itemId() }" class="cssClass"> Edit </a> thank you soooo much. save my day....!!!! – Roby

Good point. I have updated my answer to take your remark into account. Thanks for spotting this. – Monosyllable

Hi, How can I do the same for Ajax.ActionLink(...) ? Is it possible ? @darin-dimitrov – Roby

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. – Monosyllable

Hmmm... Agreed to you. I thought so too. Just asked. thanks :) – Roby

Answer 2

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>

Stringency