如何從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>

我從這里得到的想法是： 任何將c＃代碼后面的對象傳遞給javascript的方法？ 但是，訪問該JSON變量的方法對我不起作用。 我曾嘗試移動腳本，但是這樣做時，出現一個錯誤，提示“無法修改控件集合，因為控件包含代碼塊（即<％...％>）。” 而且我嘗試了其他定界符，例如<％=％>，但是根據腳本的放置位置，我也會遇到相同的錯誤。 我究竟做錯了什么？ 如何獲取該JSON字符串以顯示在Javascript函數中？

Answer 1

<%# %>是一個綁定塊，因此無論在Page_Load還是Page_PreRender事件中，都需要調用Page.DataBind()方法。

您還需要整理字符串，以便JSON文本不會破壞您的JavaScript：

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

Answer 2

<%# %>語法用於綁定來自數據源的數據。

最簡單的方法是使用文字服務器控件。 腳本標記內部似乎有點怪異，但卻可以完成任務。

<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;
        });
    }

（當然，不僅僅可以擁有一個物業，而且還有很多其他功能。）

再次感謝大家的幫助，因為沒有你我做不到！