如何使用 db output 从 intl-tel-input 自动填充 preferredCountries

Question

我想用 function 填充 preferredCountries:["xx","yy","zz"] ，它从 mysql 数据库中获取最常用的国家代码，并首先列出最高的国家代码，至少计数为 4

我有一个带有 bootstrap4 和数据表的站点，我想填充首选列表，这样您就不必滚动太多。

var input = document.querySelector("#CountryPhone");
var iti = window.intlTelInput(input, {
    initialCountry: "auto",
    separateDialCode: "true",
    autoPlaceholder: "aggressive",
    utilsScript: "https://cdnjs.cloudflare.com/ajax/libs/intl-tel- 
        input/14.0.7/js/utils.js",
    preferredCountries:["gb","us","at"],
    geoIpLookup: function(success, failure) {
        $.get("https://ipinfo.io", function() {}, 
           "jsonp").always(function(resp) {
            var countryCode = (resp && resp.country) ? resp.country : ""; 
            success(countryCode);
            });
        },
    });

我在单独的 php 文件中的 function 中有这个 sql：

"SELECT DISTINCT c.iso_code FROM countries c
LEFT JOIN customer cu on c.country_name = cu.country_name
GROUP BY c.country_name
HAVING count(cu.country_name) >= 4
ORDER BY count(cu.country_name) DESC, c.iso_code ASC"

并且返回是一个 json_encoded output 就像需要的那样：["xx","yy","zz"]

我想做类似的事情：

preferredCountries: function() {
    $.ajax({
    url:"fetch.php",
    method:"POST",
    data:{action:"f2Countries"},
    dataType:"json",
    success:function(data){},
    error: function() {  }
 });
 },

但是我在这方面并不强，所以我的猜测能力提高了。 永远不会调用 preferredCountries 下的 function。 我在 function 中启用了调试和断点，它应该是 go，但它永远不会那么远。

因此需要一些帮助来创建正确的 function，例如我从文档中借用的用于 geoIpLookup 的那个。

Answer 1

我终于解决了我的问题。

所以基本上我想用那些使用最多的国家的国家代码动态填充“preferedCountries”，并按降序排列。

通过 $.ajax() 调用，我要求我的数据库按 desc 顺序获取国家代码，并以 json 格式返回数据

我确保销毁 var iti 并使用变量重新启动它。

preferedCountries = JSON.parse(data)
iti.destroy();
iti = window.intlTelInput(input, {
    separateDialCode: "true",
    autoHideDialCode: "true",
    autoPlaceholder: "polite",
    preferredCountries: preferedCountries,
    utilsScript: "https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/14.0.7/js/utils.js",
    customPlaceholder: function(selectedCountryPlaceholder, selectedCountryData) {
        return "e.g. " + selectedCountryPlaceholder;
    }
});