connecting controller to knockout js

Question

I have a grid in which i display columns and one of the columns has an icon and once clicked it should download a file based on the id of the item clicked.

Since i am using knockout and jquery javascript to display the grid along with the icon. how can i connect the method getting the file to the icon in my js file?

JS File:

onDataClick: function (row) {
//Call the method from controller to allow downloading file
                },

Controller - get method:

public FileResult GetFile(int id)
        {
            .....
        }

Update

View:

@{
    ViewBag.Title = "Some Title";
    string url = Url.Action("GetFile");
}

<div data-bind="template: { name: 'knockoutGridTemplate', data: grid }" class="gridWrapper"></div>

In one of the columns in the grid i have in js file:

builtColumns.push({
                property: 'hasStuff',
                header: 'File Download',
                dataCss: 'iconHolder',
                onDataClick: function (row) {


                },
                dataFormatter: function (row) {
                    if (row[this.property]) return ' ';
                    return '';
                },
                dataLinkCss: 'icon-file',
                grouping: 3
            });

Answer 1

You can do in your view something like

@{
    string getFileUrl = Url.Action("GetFile");
}

/* in your viewModel, depend how you are doing it, you can do inside your item */ item.getFileUrl = '@getFileUrl' + ?id= this.id;

and in your html :

<div data-bind="foreach: item">
    <a data-bind="attr : { href = getFileUrl}">get file</a>
</div>

*Note: no need for observables *

EDIT :

onDataClick: function (row) {
    //Call the method from controller to allow downloading file
    window.open('@getFileUrl' + '?id=' + row.id, "_blank");
},