为@Html.Partial() 混合剃刀和javascript代码

Posted

技术标签:

【中文标题】为@Html.Partial() 混合剃刀和javascript代码【英文标题】:Mixing razor and java script code for @Html.Partial() 【发布时间】:2014-09-04 20:37:31 【问题描述】:

谁能为我提供如何在 MVC 中动态添加一些代码到页面中的解决方案。

我是这样做的,但是在这段代码中,页面无法识别索引 javascript 变量,因为它没有识别索引 javascript 变量。

$(document).on('click', '.add-option', function ()            
  var index = $("div.ques-options").size();
  if (index < 5) 
    $('.MainContainer').append('@html.Partial("_Options", index)')
  
);

【问题讨论】:

索引是路由的参数吗?您正在混合一个 JS 变量并试图让 C# 完成您的路线。您应该在服务器级别在 JS 或 C# 中自己构建您的路由,但不要以您的方式混合。您的代码可能没有编译。 No Index 只是一个 java 脚本变量,我使用它来设置动态生成的答案列表的索引,以便在发布后我将收到答案列表,并且在部分视图中我正在做 Like这个:@model Int32 "". @Sergio 你能用例子解释你的解决方案声明吗?如何添加路线。我没有调用任何服务器端代码。我只想在客户端设置 @Html.Partial("_Options", index) 不是 C# 代码,index 不是 javascript 变量? @Html.Partial("_Options", index) 是用 javscript 编写的,并包含 javascript 变量。我正在使用上面代码中编写的强类型部分视图的内容动态加载 div 【参考方案1】:

最好在控制器中使用 jQuery load() 或通过 ajax 操作调用,这种方法在 ASP.NET MVC rendering partial view with jQuery ajax 中进行了描述

【讨论】:

感谢您的评论但是如果我可以在客户端获取所有内容,那么为什么我会为此调用服务器端。是否有其他选项可以解决此问题或调用服务器端返回部分视图是最后的手段。 关于 AmmarCSE 的回答:我想说,这取决于你想做什么。如果您只想获取 html 并通过 jQuery 使用它,您可以调用 Partial("~/Views/MyFolder/ViewName.cshtml") 并且如果您查看 html,您只会看到由帮手。但是正如您所写,您想传递参数来呈现正确的数据,对吧?如果是这样,最好使用带有参数、处理它并返回具有适当模型的局部视图的 Action。如果您在 js 代码中使用 @Html.Partial(),则您的 html 很差,因为 Partial 助手无法通过 javascript 向服务器发出请求。【参考方案2】:

正如 Sergey Boiko 的回答中提到的,不建议使用这种方法,因为您可以使用 ajax 来让服务器返回部分视图。

无论如何,混合使用 javascript 和 Razor 要求您使用任何代码块围绕 Razor 调用

@ ... or @if, etc.

并将代码本身放在转义序列中

@: or the &lt;text&gt; tag

所以,知道了这一点,你可以做类似的事情

<script>
    var partialView = '';
    @
        <text>
            partialView = '@Html.Partial("_Options", index)';
        </text>
     

     $(document).on('click', '.add-option', function ()            
         var index = $("div.ques-options").size();
         if (index < 5) 
             $('.MainContainer').append(partialView)
      );
</script>

退房 Mix Razor and Javascript code 和Using Razor within JavaScript

【讨论】:

感谢您的回复,但在这种情况下,智能和运行时表示它无法识别 razor '@Html.Partial("_Options", index)'语法和闪烁中的 JavaScript 'index' 变量错误为“当前上下文中不存在名称'索引'”。 糟糕。我忽略了索引变量。我是他们的一种方式,您可以从剃刀中获取问题选项(索引)的数量。比如@Model.Questions.Count?

以上是关于为@Html.Partial() 混合剃刀和javascript代码的主要内容,如果未能解决你的问题,请参考以下文章

笔记:Html.Partial和Html.Action

MVC+EF 随笔小计——分部视图(Partial View)及Html.Partial和Html.Action差异

如何在剃刀视图中检查模型字符串属性是不是为空

Html.Partial 与 Html.RenderPartial 和 Html.Action 与 Html.RenderAction

剃刀视图 MVC 中的多个模型

Asp.net MVC中Html.Partial, RenderPartial, Action,RenderAction 区别和用法转发