如何将视图中的变量传递给JavaScript函数?

时间:2014-03-10 21:13:24

标签: c# jquery html asp.net-mvc

我正在开发一个具有JavaScript函数的网站,我希望在单击超链接时调用该函数。我在视图中生成了一些表行:

foreach(var e in Model.Collection)
{
    ...
    //This is just an example piece of code that tries to get the big picture
    //across. I want to call the JS function below passing in the ShipAddress property
    <td><a href="javascript:popup(@e.ShipAddress)">@e.ShippedDate</a></td>
    ...
}

我有一个像这样的JavaScript函数:

function popup(data)
{
    $('#lblShipAddress').text(data.Address1);
    ...
    // rest of code to fill out labels in a div
    $('#divShipInfo').dialog('open');

}

我在从View中传递到JavaScript函数中的ShipAddress属性(具有许多属性,即Address1,Address2等)时遇到问题。该  href =“javascript:popup(@ e.ShipAddress)”部分不起作用,我也尝试过使用数据属性,例如。

<a href="javascript:popup();" data-shipAddress="@e.ShipAddress" />

但没有运气。

编辑:为我正在寻找的内容添加了一些清晰度。如果可能的话我只想将ShipAddress属性传递给函数。

2 个答案:

答案 0 :(得分:0)

首先,我不会使用 javascript:popup() - 尝试one of these。另外,不要使用带有razor语法的引号,否则它可能不会评估变量。

如果没有一个解决它,那么它可能是一个时间问题。我在使用MVC控制的页面时遇到了很多麻烦(而不是使用JavaScript / jQuery和回调),当你认为它们不会更新时。出于某种原因,MVC控制器处理按钮按下,运行服务器端代码,更新页面对象......然后将控制权发布到JavaScript,等等。人

它基本上使得使用内置Microsoft控件的JavaScript几乎不可能。

答案 1 :(得分:0)

默认情况下,只有@e.ShipAddress将返回等效的.ToString(),这对您的方法作为输入无效。相反,您希望JSON序列化对象,如:

<a href="javascript:popup(@Json.Encode(e.ShipAddress))">@e.ShippedDate</a>

这将导致最终的html类似于:

<a href="javascript:popup({ Address1: 'Blah', Address2: ... })">@e.ShippedDate</a>

因此弹出方法可以访问对象值。

警告:请确保您的地址对象上没有任何您不希望泄露给最终消费者的字段 - Json.Encode将序列化所有公共属性。