Asp.net mvc 将 C# 对象传递给 Javascript

Question

我有 c# 类说选项更像 AjaxOptions。

public class options
{
   public string Url {get;set;}
   public string httpMethod {get;set}
}

还有一个像这样的javascript函数

function dosomething(obj)
{
   if (obj.Url!="" and obj.HttpMethod=="something")
    loadsomething();

}

现在在我的控制器操作中

 public class mycontroller : controller
 {
    public ActionResult WhatToDo()
    {
       options obj = new options{Url="someurl"};
       return PartialView(obj);
    }


 }

在我看来，我需要这种对象类型的字符串，我应该能够将其传递给我的方法。

@model options

<script>
   dosomething(@model.SomeFunctionToConverToString())

</script>

所以我需要这个 SomeFunctionToConverToString 方法，我会将这个对象转换为字符串。

谢谢

Answer 1

您应该能够像使用视图中模型属性的任何其他输出一样使用它。只需在 JS 函数中引用您要传递的属性即可。

@model options

<script>
   dosomething('@(model.Url)');
</script>

有关在 JS 中使用 Razor 的更多信息，请参阅 this post

EDIT - 如果你的 URL 被 Razor 使用上述代码所使用的 HTML 编码破坏了，你可以使用 @Html.Raw() 函数来传递 Url 属性，这可能会引起你的注意。 HTML 编码。

<script>
   dosomething('@Html.Raw(model.Url)');
</script>

EDIT 2 - 还有another SO post 来救援！您很可能希望将模型转换为 JSON 以便在 Javascript 函数中使用。所以...为了做到这一点 - 你需要在你的视图模型中处理一个 JSON 对象。

public class optionsViewModel
{
   public options Options{get;set;}
   public string JsonData{get;set;}
}

在你的控制器中：

public class mycontroller : controller
 {
    public ActionResult WhatToDo()
    {
       options obj = new options{Url="someurl"};
       var myViewModel = new optionsViewModel;
       myViewModel.options = obj;
       var serializer = new JavaScriptSerializer();
       myViewModel.JsonData = serializer.Serialize(data);
       return PartialView(myViewModel);
    }
 }

最后是视图：

@model optionsViewModel

<script>
   dosomething('@model.JsonData')

</script>

使用此方法，您的功能将按预期工作：

function dosomething(obj)
{
   if (obj.Url!="" and obj.HttpMethod=="something")
    loadsomething();
}

EDIT 3 可能是最简单的方法了吗？与编辑 2 相同的前提，但是这是使用视图对模型进行 JsonEncode。无论这是否应该在视图、控制器或存储库/服务层中完成，双方都可能有一些很好的论据。但是，对于在视图中进行转换...

@model options

<script>
   dosomething('@Html.Raw(Json.Encode(Model))');
</script>

Answer 2

试试这个：

<script type="text/javascript">
    var obj= @Html.Raw(Json.Encode(Model));
    function dosomething(obj){}
</script>

Answer 3

这对我有用

客户端：

function GoWild(jsonData)
{
    alert(jsonData);
}

警报打印：

{"wildDetails":{"Name":"Al","Id":1}}

MVC 剃刀面：

 @{var serializer new System.Web.Script.Serialization.JavaScriptSerializer();}
<div onclick="GoWild('@serializer.Serialize(Model.wildDetails)')"> Serialize It </div>

Answer 4

还有语法错误

<script type="text/javascript">
  dosomething("@Model.Stringify()");
</script>

注意@Model.Stringify() 周围的引号用于javascript，因此发出的HTML 将是：

<script type="text/javascript">
  dosomething("this model has been stringified!");
</script>

Answer 5

我建议你看看SignalR，它允许服务器触发的 javascript 回调。

查看 Scott H 网站了解详情：http://www.hanselman.com/blog/AsynchronousScalableWebApplicationsWithRealtimePersistentLongrunningConnectionsWithSignalR.aspx

总之你...

Javascript 客户端：

var chat = $.connection.chat;
chat.name = prompt("What's your name?", "");

chat.receive = function(name, message){
    $("#messages").append("
"+name+": "+message);
}

$("#send-button").click(function(){
    chat.distribute($("#text-input").val());
});

服务器：

public class Chat : Hub {
    public void Distribute(string message) {
        Clients.receive(Caller.name, message);
    }
}

所以 .. C# 中的 Clients.receive 最终会触发 javascript 中的 chat.receive 函数。

它也可以通过 NuGet 获得。