将数据加载到使用 JSON 返回的表单字段时出现问题答案

【问题标题】：Issue while loading data into form field which is returned using JSON将数据加载到使用 JSON 返回的表单字段时出现问题
【发布时间】：2012-09-10 07:06:04
【问题描述】：

我有表单布局，我正在加载城市详细信息，如城市名称、州和国家取决于城市 ID，并通过 JSON 返回。

功能同上：

public JsonResult GetCityDetails(int city_id)
    {
        var result = "SELECT (CITY_NAME + ', ' + STATE_NAME + ', ' + COUNTRY_NAME) AS CITY_NAME FROM COUNTRY_MASTER cm, STATE_MASTER sm, CITY_MASTER cy where cy.STATE_ID = sm.STATE_ID AND sm.COUNTRY_ID = cm.COUNTRY_ID AND cy.CITY_ID =" + city_id + " ";
        var tempPerson = DatabaseHelper.Instance.Database.QuerySingle(result);
        return Json(new { Data = tempPerson.CITY_NAME });
    }

在这里，我正在获取通过 JSON 返回的城市详细信息的正确数据，但在加载到 html 表单字段时出现问题。

然而，这个函数在java脚本函数中被调用如下：

loadCityDetails: function (_cityid) {
           debugger;
            console.log("loadCityDetails");
            $.ajax({
                url: '@Url.Action("GetCityDetails", "Yogya")' + '?address_id=' + currentAddressID + '&person_id=' + currentPersonID + '&city_id=' +_cityid,
                type: 'POST',
                success: function (data) {
                 alert('Address Selected');                      
                   $("#CITY_DETAIL_AC").val(data.Data);

                }
            });
        },

现在，问题是如果我不保持警报（'Address Selected'）; loadCityDetails 中的代码，我没有将城市详细信息加载到城市名称字段中，只有在提供警报时才会出现。但我不想保持这种警惕。那么，如何在不显示警报的情况下加载城市详细信息。任何帮助将不胜感激。

【问题讨论】：

尝试在ajax中添加dataType: 'json'
@user108 虽然添加了 dataType: 'json'，但还是同样的问题，无法获取城市详细信息...
什么是返回数据？把console.log(data);
返回数据是城市详细信息，即城市名称、州和国家，可以在顶部显示的公共 JsonResult GetCityDetails() 函数中看到，并获得正确的值...
好的，所以你只想提醒一次消息，现在你可以使用jquery one我对你有帮助的东西。

标签： javascript jquery ajax

【解决方案1】：

这是因为对 $("#CITY_DETAIL_AC").val(data.Data); 的调用发生在异步 ajax 调用中，该调用独立于 DOM 构造运行。在函数调用返回时，您无法知道 DOM 是否已准备就绪 - 可能不是，因为您无法访问该元素。显示警告框让系统有时间在尝试写入 DOM 之前创建它。

解决方案：将包含 ajax 调用的函数放入 .ready() 中，如下所示：

$(document).ready(function(){..your function body here...});

那么保证在所有元素都存在之前不会发生。现在您必须从 {...function body...} 中检索 city-id，因为您不能再期望它作为参数传入。

【讨论】：

我已经在 $(document).ready(function (){ } 中有它了：$(document).ready(function () { $.extend ({ function defined here }); });