如何在ASP.NET MVC中使用JavaScript编写动作链接？

我有一个脚本将一些行附加到表中。一个行有一个删除链接，和我使用一个ActionLink的，但该元素的ID是通过JS收到，这是也不工作：如何在ASP.NET MVC中使用JavaScript编写动作链接？

$("#Table").last().append('<tr><td><a href=\"<%:Html.ActionLink("Delete", "DeleteElementFromSet", new {id=%>Id<%})%>">Delete</a></td><td>'+Id+'</td></tr>');

其中Id是获取一个javascript变量它的值来自dropdownlist的值。

有没有像这样使用ActionLink的方法？还是我必须手动写下路径？

来源

2010-09-24 Francisco Noriega

因为ID是在客户端，你将需要建立正确的URL唯一已知的。这是说从来没有混合C＃和JavaScript。这里是你会如何着手：

开始通过声明一个全局变量，将持有的删除链接没有ID部分：

<script type="text/javascript"> 
    var deleteUrl = '<%: Url.Action("DeleteElementFromSet") %>'; 
</script>

，然后在单独 javascript文件：

$('#Table').last().append(
    $(document.createElement('tr')) 
     .append($(document.createElement('td')) 
      .append($(document.createElement('a')) 
       .attr('href', deleteUrl + '/' + Id) 
       .text('Delete') 
      ) 
     ) 
     .append($(document.createElement('td')) 
      .text(Id) 
     ) 
);

请注意，您应该使用Url.Action而不是Html.ActionLink，因为您已经手动生成了锚点。

备注：避免使用GET动词进行删除。你可能会有不好的惊喜。修改服务器上的状态（如删除）时使用正确的动词（或至少POST）。

来源

2010-09-24 18:40:00

对Url.Action的+1，并使其成为一个固定的URL /在需要时进行修改。 – eglasius 2010-09-24 18:46:21

就像你在MVC中有一个动作链接助手一样。在JavaScript中创建一个助手，您可以在其中提供操作，控制器和标识以创建链接。

来源

2010-09-24 18:30:49

他没有Id。你如何将一个javascript变量传递给HTML助手？ – 2010-09-24 18:42:19

也许我不清楚，但他在JavaScript中有ID，他需要一个类似于.NET中的ActionLink Helper的函数。基本上我说的是创建一个Javascript函数来模仿ActionLink Helper in .NET – 2010-09-24 18:44:43

可能不是路要走，因为路线可能会改变 – hunter 2010-09-24 18:46:11

你必须手动写下路径。这是因为C＃在编译时被评估，并且您正在运行时将它写入文档。

更好的选择是完全分离HTML和Javascript。将HTML放入您的视图中隐藏的div，然后使用javascript将其内容复制到任何位置。这样您仍然可以使用C＃创建操作链接。

从Javascript中分离HTML也提高了代码的可读性，更好地分离了关注点并扩展了语法突出显示。换句话说，这是一个很好的做法。

来源

2010-09-24 18:31:25

重构它使其更清晰。从字面上看，可等效为：

var deleteUrl = '<%:Url.ActionLink("Delete", "DeleteElementFromSet", new {id=%>Id<%})%>'; 
$("#Table").last() 
    .append('<tr><td><a href=\"' + deleteUrl + '">Delete</a></td><td>'+Id+'</td></tr>');

，你可以在那里首先注意的事情是，你\"打开它，你"关闭它。

我建议你做以上的练习，直到脚本清晰并且混乱的语法不在场。

上面说过，在deleteUrl 中，您试图在服务器上使用客户端值。记住<％：将在服务器端视图渲染过程中被调用，因此您在客户端设置的Id根本不会在内部发挥作用。

一种选择是使用一个占位符，就像：

var deleteUrl = '<%:Url.ActionLink("Delete", "DeleteElementFromSet", new {id=%>Id<%})%>'; 
deleteUrl = deleteUrl.replace("##id##", Id); 
$("#Table").last() 
    .append('<tr><td><a href=\"' + deleteUrl + '">Delete</a></td><td>'+Id+'</td></tr>');

来源

2010-09-24 18:38:13 eglasius

这个怎么样：

var row = $("#Table").last().append('<tr><td><%:Html.ActionLink("Delete", "DeleteElementFromSet")%>"></td><td>' + Id + '</td></tr>'); 
row.find('a').attr(Id);

这将增加该行，然后找到该链接并添加id属性。

在您的代码中，它看起来像是我删除了额外的'a'标签。

来源

2010-09-24 18:41:39

这不是OP的代码试图执行的操作/ id是操作的参数。 – eglasius 2010-09-24 18:47:36

对，现在我意识到了。他一定是指Action，而不是一个ActionLink html helper（呈现锚点）。 ActionLink有一个HtmlAttributes重载 - 这正是我认为他所要做的。 – 2010-09-24 20:48:44

另外，在你的文章中，你犯了同样的错误。 ActionLink不是一个URL。它是一个HTML锚定标记。使用Url.Action。 – 2010-09-24 20:55:02

如何在ASP.NET MVC中使用JavaScript编写动作链接？

回答

相关问题