如何从后面的 C# 代码传输序列化的 JSON 字符串以在 Javascript 中使用

Question

这里的最终目标是从背后的 C# 代码中的对象填充 Bootstrap 模态的字段，该对象具有我需要的所有数据。我从后面的代码中序列化了对象，像这样：

JavaScriptSerializer serializer = new JavaScriptSerializer();
sJSON = serializer.Serialize(aerationsystem.AerationSystem);

现在我想在我的 Javascript 函数中引用 JSON，如下所示：

</form>
    <script type="text/javascript">
        function fillModal() {
            var diameterValue = document.getElementById('diameter');            
            var aeration = <%# sJSON %>;
            diameterValue.innerText = aeration.dBinDiameter;
        }
    </script>
</asp:Content>

（我包含了关闭表单标签和关闭 asp:Content 标签，所以你们都可以看到我把这个 Javascript: 放在文件末尾的位置。）

但是，当我调用那个 Javascript 函数时，这是我在浏览器的调试器中看到的：

    <script type="text/javascript">
        function fillModal() {
            var diameterValue = document.getElementById('diameter');            
            var aeration = ;
            diameterValue.innerText = aeration.dBinDiameter;
        }
    </script>

我从这里得到了灵感：Any way to pass an object from c# code behind to javascript? 但是，访问 JSON 变量的方法对我不起作用。我试过移动我的脚本，但是当我这样做时，我收到一条错误消息 "The Controls collection cannot be modified because the control contains code blocks (i.e. <% ... %>)."。我尝试过其他分隔符，例如 <%= %>，但根据脚本放置，我会遇到相同的错误。我究竟做错了什么？如何让 JSON 字符串显示在我的 Javascript 函数中？

Answer 1

<%# %> 是一个绑定块，因此您需要调用 Page.DataBind() 方法，无论是在 Page_Load 还是 Page_PreRender 事件中。

您还需要整理字符串，以便 JSON 文本不会破坏您的 javascript:

var aeration = '<%# sJSON.Replace("'", "\'").Replace("\n", " ") %>';

Answer 2

<%# %> 语法用于从数据源绑定数据。

最简单的方法是使用文字服务器控件。在 script 标签中看起来有点奇怪，但它完成了工作。

<script type="text/javascript">
    function fillModal() {
        var diameterValue = document.getElementById('diameter');
        var aeration = <asp:Literal id="JsonLiteral" runat="server"/>;
        diameterValue.innerText = aeration.dBinDiameter;
    }
</script>

代码隐藏

JavaScriptSerializer serializer = new JavaScriptSerializer();
JsonLiteral.Text = serializer.Serialize(aerationsystem.AerationSystem);

Answer 3

非常感谢您抽出时间回答我的问题！在你们所有人的启发下，我最终解决了这个问题。我没有使用 Literal 控件，而是在页面上使用 <asp:HiddenField> 控件来存储值。然后，我将其值提取到 Javascript 变量中。

隐藏字段：<asp:HiddenField ID="JsonLiteral" runat="server" />

事件中赋值的代码：

JavaScriptSerializer serializer = new JavaScriptSerializer();
JsonLiteral.Value = serializer.Serialize(aerationsystem.AerationSystem);

以及完成作业的JavaScript：

function fillModal() 
    {
        $(document).ready(function () {
            var diameter = document.getElementById('diameter');
            var control = document.getElementById('<%= JsonLiteral.ClientID%>');
            var aeration = JSON.parse(control.value);

            diameter.innerText = aeration.dBinDiameter;
        });
    }

（当然，除了那个属性，还有更多内容。）

再次感谢大家的帮助，没有你们我做不到！

如何从后面的 C# 代码传输序列化的 JSON 字符串以在 Javascript 中使用

How to transfer a serialized JSON string from C# code behind to use in Javascript

javascript

asp.net

telerik

代码隐藏