JSON數據到表單字段

Question

我是Java和Jquery的新手，所以請原諒我的無知。 我正在嘗試獲取表單字段，以使用從在線.asp數據庫中提取的JSON數據基於郵政編碼自動填充城市和州。 我收到了可以在開發工具窗口中查看的數據的JSON成功響應，但無法獲取它來填充表單上的字段。

我的代碼是：

$(function() {

    var cache = {};
    var container = $("#validate");
    var errorDiv = container.find("div.text-error");

    /** Handle successful response */
    function handleResp(data)
    {
        // Check for error
        if (data.error_msg)
            errorDiv.text(data.error_msg);
        else if ("City" in data)
        {
            // Set city and state
            container.find("input[name='City']").val(data.City);
            container.find("input[name='State']").val(data.State);
        }
    }

    // Set up event handlers
    container.find("input[name='zipcode']").on("keyup change", function() {
        // Get zip code
        var zipcode = $(this).val().substring(0, 5);
        if (zipcode.length == 5 && /^[0-9]+$/.test(zipcode))
        {
            // Clear error
            errorDiv.empty();

            // Check cache
            if (zipcode in cache)
            {
                handleResp(cache[zipcode]);
            }
            else
            {
                // Build url
                var url = "http://dev.xxx.com/ASPFetchers/GetSPROCAsXML.asp?SPROC=EG_GetZipCodeInfo%20/"+(zipcode)+"/&F=JSON";

                // Make AJAX request
                $.ajax({
                    "url": url,
                    "dataType": "json"
                }).done(function(data) {
                    handleResp(data);

                    // Store in cache
                    cache[zipcode] = data;
                }).fail(function(data) {
                    if (data.responseText && (json = $.parseJSON(data.responseText)))
                    {
                        // Store in cache
                        cache[zipcode] = json;

                        // Check for error
                        if (json.error_msg)
                            errorDiv.text(json.error_msg);
                    }
                    else
                        errorDiv.text('Request failed.');
                });
            }
        }
    }).trigger("change");
});

我在表單上的標記如下：

    <div id="validate">                                                                             
<label>Zip Code</label>                         
<input type="text" name="zipcode" id="zipcode" size =" 5" maxlength = "5" />                            
<div class="text-error"></div>                                                      

<label>City</label>                         
<input type="text" name="City" id="City" />                                                 

<label>State</label>                            
<input type="text" name="State" id="State" />                           
<script type="text/javascript" src="../zip/includes/zip2.js"></script>      
</div>
</div>

我可以在開發工具中查看的JSON是（基於郵政編碼06702）：

{"items":[{"City":"WATERBURY","County":"NEW%20HAVEN","State":"CT","StateName":"CONNECTICUT","Latitude":"0.7252836","Longitude":"-1.274794"},

誰能幫助我解決如何從此字符串中獲取信息，並將其填充到“城市”和“州”字段中？ 感謝您的時間和知識。

Answer 1

如果查看此處發布的數據，則需要使用數據內部的items數組。

container.find('input[name="City"]').val(data.items[0].City);
container.find('input[name="State"]').val(data.items[0].StateName);

Answer 2

返回的對象外觀是一個對象數組 。

因此，首先獲取items數組並引用其中的第一項。

function handleResp(data) {
        // Check for error
        if (data.error_msg)
            errorDiv.text(data.error_msg);
        else if ("City" in data) {
            var info = data.items[0];
            // Set city and state
            container.find("input[name='City']").val(info.City);
            container.find("input[name='State']").val(info.State);
        }
    }