从 AJAX JSON 结果数据填充选择列表

Populating select list from AJAX JSON result data

本文关键字:填充 选择 列表 数据 结果 AJAX JSON      更新时间:2023-09-26

你好堆栈溢出开发人员,首先,很抱歉,如果我找不到解决方案,但我已经尝试了一段时间了。我不确定我的方法是否是最好的,所以,如果有 AJAX 和/JSON 的替代品,请随时提出建议。

我正在创建一个旅游指南网站,注册用户将根据地区和州包括他们的度假村,餐馆和旅游景点。我正在使用Joomla!和Seblod(有一些自定义PHP,MySQL,Javascript和AJAX)。由于我不想手动创建 27 个动态选择,我一直在尝试使用 PHP/AJAX/JSON/JQuery 选择注册海滩列表(度假村和旅游景点必须与之相关)。

除了填充海滩列表外,一切都有效,我不知道问题是什么。我已经尝试了多种方法来附加,创建或添加选项,但没有任何反应。PHP/JSON 结果是:

`    [{"id":"17","title":"Porto+de+Galinhas"},{"id":"18","title":"Serrambi"},{"id":"19","title":"Tamandar%E9"}]`

这是这个PHP脚本的结果:

`    if($_GET['q'] == '海滩'){        $praiaSQL = sprintf("从vp_content中选择 * 作为 c 左连接vp_cck_store_item_content作为 v 在 c.id = v.id 其中 c.catid = 10 和 v.cck = 'praia' 和 v.venue_state = '%s' 按 c.title ASC; 排序 _GET['s']);        $query = mysqli_query($connection, $praiaSQL);        $praia = 数组();        while($results = mysqli_fetch_assoc($query)){            array_push($praia, array('id' => $results['id'], 'title' => urlencode($results['title'])));        }        回声json_encode($praia);    }`

我还需要一个解决方案来处理重音字符。我在这里尝试 urlencode 并在 JQuery 中解码,但可能是问题所在。当我将其保留为原始数据时,当有重音字符时,结果项为空。

这是处理结果的相关 JQuery(其中 x = 选择,你 = 获取 AJAX JSON 结果的 URL - 我已经评论了代码中的问题所在):

`    函数集海滩列表(x,u){            var theDiv = "#cck1r_" + x;            var theSelect = "#" + x;            $j(theSelect).children("option:not(:first)").remove();            $j.ajax({                网址: u,                contentType: "application/json;charset=UTF-8",                成功:函数(数据){                    if(data.length){                        /****                           这就是我卡住的地方,因为我找不到确保                           数据实际上正在被处理/处理。                           我已经尝试了警报和各种其他选项来填充                           选择。                           我知道它被调用是因为之前:和之后:函数                           正在工作。                         *****/                      /*                        $j.each(data, function(k, v){                            var o = new Option();                            var newTitle = urldecode(v.title);                            $j(o).html(newTitle).val(v.id);                            $j(theSelect).append(o);                        });                        */                       var htm = '';                        for (var i = 0; i '+urldecode(data[i].title)+'';                        }                        $j(选择).html(htm);                    }                },                beforeSend: function(){                    $j(theDiv).hide();                },                complete: function(){                  $j(theDiv).show();                 },                数据类型:"json",            });        }`

感谢您的时间和耐心,我不是这方面的专家(不完全是新手,但很接近......

urldecode不是javascript函数,您可以使用decodeURIComponent代替它。

当你改变它时,它正在工作,

http://jsfiddle.net/MzMPK/1/

更新:

我认为您的问题是关于尝试编码重音字符,如果您的所有编码都设置为 UTF-8,它应该无需编码它们即可工作。

这是一个常见的 JSON 解析静默错误。

如果 JSON 格式不正确,则 ajax 请求将以静默方式失败。

此问题的第二个最常见原因是编码。确保在调用 AJAX 的页面和返回数据的脚本中使用 UTF-8。

重音数据的问题可以通过不在服务器端对数据进行编码来解决,因此不需要在客户端取消编码。

回答我自己的问题:由于我不是 AJAX/JSON 专家,我不知道这是否是预期的行为,但是生成 AJAX 结果的响应页面不能具有与预期不同的数据。由于我留下了一个区域的输出,因此请求页面以某种方式处理它时遇到了问题。删除不必要的数据后,选择列表得到了很好的更新。

这是我忘了在我的帖子中提到的,因为我认为页面中有多个结果是可以的。使用Firebug检查代码,请求被正常。

谢谢大家的时间,很抱歉给您带来的不便...

我不得不将 htmlentity 添加到响应页面,因为重音返回 null,尽管我在每个文件上都明确使用 UTF-8......