如何通过选择下拉列表来使用 json 数据填充文本框答案

【问题标题】：How to populate textboxes with json data by selecting dropdownlist如何通过选择下拉列表来使用 json 数据填充文本框
【发布时间】：2014-04-18 14:27:33
【问题描述】：

` 公共部分类 DropDownApi : System.Web.UI.Page { string _URL = "/api/Insurance";

    protected void Page_Load(object sender, EventArgs e)
    {
            WebRequest req = WebRequest.Create(_URL);
            req.Method = "GET";
            // req.Headers.Add("key");
            req.ContentType = "application/json; charset=utf-8";
            WebResponse resp = req.GetResponse();
            Stream stream = resp.GetResponseStream();
            StreamReader re = new StreamReader(stream);
            String json = re.ReadToEnd();
            json = "{\"InsuranceDetails\":" + json + "}";
            wrapper w = (wrapper)new JavaScriptSerializer().Deserialize(json, typeof(wrapper));


            ddlinsurance.DataSource = w.InsuranceDetails;
            ddlinsurance.DataBind();
        }
        public class wrapper
        {
            public List<insurance_master> InsuranceDetails { get; set; }
        }`<asp:DropDownList ID="ddlinsurance" runat="server" AutoPostBack="false" DataTextField="policy_number"></asp:DropDownList>`

`我有一个包含 json 数据（policy_number）的下拉列表，现在当我从下拉列表中选择 policy_number 时，它必须通过匹配选定的 policy_number 在文本框中显示剩余的详细信息。我已经为我的项目使用了 MVC WebApi 服务。谁能帮帮我！！！

提前致谢。

【问题讨论】：

告诉我们你做了什么
请包含您目前编写的代码，并告诉我们您遇到的问题。无论如何，您都需要研究如何解决这个问题。在互联网上搜索这篇文章的标题无疑会让你上路。

标签： c# asp.net json asp.net-web-api

【解决方案1】：

这不是答案，但我认为这会对你有所帮助..

HTML

<select id="list">
     <option value="">Choose</option>
</select>
<input type="text" id="inp" />

JavaScript

// sample json data
var sampleJson = [
    { 'policy_number': 1, 'data': 'policy 1', 'display': 'one' },
    { 'policy_number': 2, 'data': 'policy 2', 'display': 'two' },
    { 'policy_number': 3, 'data': 'policy 3', 'display': 'three' }
];

//get select element using id
var select = document.getElementById('list');

//append option to select list with values from sampleJson
for (var i = 0; i < sampleJson.length; i++) {
    var option = document.createElement("option");
    option.value = sampleJson[i]['policy_number'];
    option.text = sampleJson[i]['display'];
    select.appendChild(option);
}          
var input = document.getElementById('inp');

//onchange event handler for select 
select.onchange = function()
{
    for (var i = 0; i < sampleJson.length; i++) {
        //selecetd value present in sampleJson set it into textbox
        if(sampleJson[i]['policy_number'] == this.value)
        {
            input.value = sampleJson[i]['data'];
        }
        // check the value is not empty(for default Choose option)
        if(this.value == '')
        {
            input.value = this.value;
        }
    }
};

这里是 Demo

【讨论】：