c# - How would I link to an external site from a cell in a kendo grid? -
just title says. want have kendo grid column called link. column need dynamically generate link whatever address user puts it. don't need worry error checking ensure link valid, or that.
i've done research, , i've found ways link other locations within same project. in example, i'd need set if user edits cell in link column "www.temporarysite.com", upon saving edit, grid create hyperlink site.
i've tried using actionlink, doesn't seem fulfill purpose properly.
thoughts? can provide code samples if necessary.
edit: i'll include code below. appreciated!
columns.bound(o => o.link).clienttemplate(@html.actionlink("#=link#", "#= myscript(#= link#)#").tohtmlstring());
the issue creates anchor tag, errors out "page not found". it's trying go " www.my site.com/www.google.com".
here example based on kendo dojo
<!doctype html> <html> <head> <meta charset="utf-8"> <title>untitled</title> <link rel="stylesheet" href="http://cdn.kendostatic.com/2014.1.528/styles/kendo.common.min.css"> <link rel="stylesheet" href="http://cdn.kendostatic.com/2014.1.528/styles/kendo.rtl.min.css"> <link rel="stylesheet" href="http://cdn.kendostatic.com/2014.1.528/styles/kendo.default.min.css"> <link rel="stylesheet" href="http://cdn.kendostatic.com/2014.1.528/styles/kendo.dataviz.min.css"> <link rel="stylesheet" href="http://cdn.kendostatic.com/2014.1.528/styles/kendo.dataviz.default.min.css"> <link rel="stylesheet" href="http://cdn.kendostatic.com/2014.1.528/styles/kendo.mobile.all.min.css"> <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> <script src="http://cdn.kendostatic.com/2014.1.528/js/kendo.all.min.js"></script> <script> $(document).ready(function(){ var sampledata = [ { "title": "the code project", "url": "http://codeproject.com/","developer":"tom hanks" }, { "title": "kendo ui", "url": "http://kendoui.com/" ,"developer":"tom cruise"} ]; var ddatasource= new kendo.data.datasource.create(sampledata); $("#testgrid").kendogrid({ editable: "popup", datasource: ddatasource, columns: [{ command: ["edit", "destroy"], title: "פעולות", width: "220px" }, { field: "title", title: "title name"}, { field: "url", title: "url", template: '<a href="#=url#">#=title#</a>'}] }); }); </script> </head> <body> <div id="testgrid" data-role="grid" data-bind="source: sampledata" data-sortable="true" data-resizable="true" /> </body> </html>
Comments
Post a Comment