Question

我想合成一个Json对象数组，以便从服务器端自动完成，现在我在页面加载时对下面的内容进行了硬编码，但是没有用。但是，当我在JS文件中将其更改为“ local：[{name：'Foo'}，{name：'FFoo'}，{name：'Ah'}]”时，它就可以工作。

是否可以从服务器端呈现“本地”数据，如何使用Vb.net制作Json字符串？

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs) Handles Me.Load

    hdTypeahead.Value = "[ { 'name': 'ah'},{ 'name': 'ba'},{ 'name': 'cha'} ]"
End Sub

var dataSetBloodhound = new Bloodhound({
        datumTokenizer: Bloodhound.tokenizers.obj.whitespace('name'),
        queryTokenizer: Bloodhound.tokenizers.whitespace,
        //local: $('#<%= hdTypeahead.ClientID %>').val()
        local: [{ name: 'Foo' }, { name: 'FFoo' }, { name: 'Ah' }]
    });

    dataSetBloodhound.initialize();

    $('input').tagsinput({
        freeInput: true,
        typeaheadjs: {
            name: 'dataSetBloodhound',
            displayKey: 'name',
            valueKey: 'name',
            source: dataSetBloodhound.ttAdapter()
        }
    });

<link href="https://rawgit.com/timschlechter/bootstrap-tagsinput/master/src/bootstrap-tagsinput.css" rel="stylesheet"/>
<script src="http://twitter.github.io/typeahead.js/releases/latest/typeahead.bundle.js"></script>
<script src="http://bootstrap-tagsinput.github.io/bootstrap-tagsinput/dist/bootstrap-tagsinput.min.js"></script>


<input type="text" value="Amsterdam,Washington,Sydney,Beijing,Cairo" data-role="tagsinput" />
<input runat="server" id="hdTypeahead" type="text" value="" style="display:none"/>

Answer 1

尝试

local: JSON.parse($('#<%= hdTypeahead.ClientID %>').val())

或请打开控制台日志到同一页面，并从$（'＃<％= hdTypeahead.ClientID％>'）获取该元素的确切值

Answer 2

问题不在于您的数据是否来自服务器端，而是实际上将Java脚本数组解析为变量。您的数据以字符串格式存储在hdTypeahead控件的val中，因此，要使其成为数组，您必须使用Java脚本中存在的某些解析器。我已经实现了如下代码：

WebForm1.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="tempApp2.WebForm1" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <input id="hidTypeAhead" type="hidden" runat="server" />
    </form>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script>

        var typeAhead = JSON.parse($('#<%= hidTypeAhead.ClientID %>').val());        
        console.log(typeAhead.data);

    </script>
</body>
</html>

WebForm1.aspx.vb

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace tempApp2
{
    public partial class WebForm1 : System.Web.UI.Page
    {        
        protected void Page_Load(object sender, EventArgs e)
        {
            hidTypeAhead.Value = @"{""data"":[{ ""name"": ""Foo"" }, { ""name"": ""FFoo"" }, { ""name"": ""Ah"" }]}";
        }
    }
}

因此，首先要了解的是，字符串中的数组数据不是对象，而JS具有JSON.parse（）方法，该方法可以将字符串解析为JS对象。因此，您只需按照以下步骤将数组添加到字符串中的对象即可：

hidTypeAhead.Value = @"{""data"":[{ ""name"": ""Foo"" }, { ""name"": ""FFoo"" }, { ""name"": ""Ah"" }]}";

我已将数组添加到JS对象的data属性中。下一部分是使用JSON.parse（）解析它，下面的代码将满足需要的人：

var typeAhead = JSON.parse($('#<%= hidTypeAhead.ClientID %>').val());

就是这样，您将在typeAhead变量的“ data”属性中获得数组，然后可以将其分配为

到“ local”属性

local: typeAhead.data

或直接

local: JSON.parse($('#<%= hidTypeAhead.ClientID %>').val()).data;

希望有帮助

从服务器本地数据源以预先输入的标签

2 个答案: