首页 > 解决方案 > 如何将 C# 对象作为参数传递给 Javascript 函数

问题描述

所以我有这张表,它根据里面的集合生成它的数据@Model

@foreach (var number in Model.Numbers)
{
    <tr class="tb-tnx-item">
        <td class="tb-tnx-id">
            <div class="">
                <span>@number.Msisdn</span>
            </div>
        </td>
        <td class="tb-tnx-id">
            <span>@number.Country</span>
        </td>
        <td class="tb-tnx-info">
            <div class="">
                <span class="title">Mobile</span>
            </div>
        </td>
        <td class="tb-tnx-amount">
            <div class="tb-tnx-total">
                <span class="amount"><em class="icon ni ni-coins align-middle"></em>@number.Cost</span>

            </div>
            <div class="tb-tnx-status">
                <span title="@number.Features" class="">@number.Features[0] / @number.Features[1]</span>
            </div>
        </td>

        <td class="text-center">
            <div class="tb-tnx-status">
                <a class="btn btn-primary" onclick="doFunction(); ">Default S2</a>
            </div>
        </td>


    </tr>
}

正如你所看到的,我在这里有这部分,当我点击它时它会调用一个 JavaScript 函数

<a class="btn btn-primary" onclick="doFunction(); ">Default S2</a>

这是JavaScript

<script>

    function doFunction() {
        alert("Test");
    }
</script>

我的问题是..我如何number作为参数传递,以便我可以做这样的事情

alert(number.Msisdn);

标签: javascriptasp.netasp.net-mvcrazorrazor-pages

解决方案


您应该使用Newtonsoft nuget Package将数字 C# 对象序列化为 JSON 字符串

@using Newtonsoft.Json

然后将其传递给视图,如下所示:

<a class="btn btn-primary" onclick="doFunction(@(JsonConvert.SerializeObject(number)));">Default S2</a>

所以最终视图将如下所示:

@using Newtonsoft.Json


@foreach (var number in Model.Numbers)
{
    <tr class="tb-tnx-item">
        <td class="tb-tnx-id">
            <div class="">
                <span>@number.Msisdn</span>
            </div>
        </td>
        <td class="tb-tnx-id">
            <span>@number.Country</span>
        </td>
        <td class="tb-tnx-info">
            <div class="">
                <span class="title">Mobile</span>
            </div>
        </td>
        <td class="tb-tnx-amount">
            <div class="tb-tnx-total">
                <span class="amount"><em class="icon ni ni-coins align-middle"></em>@number.Cost</span>

            </div>
            <div class="tb-tnx-status">
                <span title="@number.Features" class="">@number.Features[0] / @number.Features[1]</span>
            </div>
        </td>

        <td class="text-center">
            <div class="tb-tnx-status">
                <a class="btn btn-primary" onclick="doFunction(@(JsonConvert.SerializeObject(number))); ">Default S2</a>
            </div>
        </td>


    </tr>
}

推荐阅读