Question

我想将选项填充到选择框中我使用ajax从数据库中获取一些记录，并在其成功函数中我填充字段我的代码工作正常但现在我已经更改了我从哪里获取的功能数据和我的结果消失了意味着它不再显示了，但我想要这个功能，这里是我的jquery的代码。

$('#cq-select-model').click(function () {
    $.ajax({
        url: ajaxurl,
        data: {action: 'getPopulateField'},
        type: 'GET',
        success: function (data) {
            console.log(data);
            var $year = $('#car-years');
            var $make = $('#car-makes');
            var $model = $('#car-models');
            $year.find('option').remove();
            $make.find('option').remove();
            $model.find('option').remove();
            $make.append('<option value="Ferrari">Ferrari</option>');
            for (var i in data.model) {
                $year.append('<option value=' + data[i].year + '>' + data[i].year + '</option>');
                $model.append('<option value=' + encodeURIComponent(data[i].model) + '>' + data[i].model + '</option>');
            }
            $('#cq-show-data').show();
            $('.show-data-desc').show();
        }
    });
});

这是我的函数代码，它从数据库中获取记录。

我之前有这个功能：

function getPopulateField() {
global $wpdb;
$data = $wpdb->get_results("SELECT * FROM wp_ovdq_populate_fields");
wp_send_json($data);
}
add_action('wp_ajax_getPopulateField', 'getPopulateField');
add_action('wp_ajax_nopriv_getPopulateField', 'getPopulateField');

并将我的功能改为：

function getPopulateField() {
global $wpdb;
$model = $wpdb->get_results("SELECT DISTINCT model FROM wp_ovdq_populate_fields ORDER BY model ASC");
$year = $wpdb->get_results("SELECT DISTINCT year FROM wp_ovdq_populate_fields");
$data = array_merge($model, $year);
wp_send_json($data);
}
add_action('wp_ajax_getPopulateField', 'getPopulateField');
add_action('wp_ajax_nopriv_getPopulateField', 'getPopulateField');

通过使用这个函数，我得到像这样的json响应。

 `200
:
{model: "Mondial Quattrovalvole"}
201
:
{model: "Mondial T"}
202
:
{model: "Mondial T Cabriolet"}
203
:
{model: "Portifino"}
204
:
{model: "Testarossa"}
205
:
{year: "1947"}
& More....

Answer 1

合并2个year和model数组会导致问题。

在JS中，当您循环浏览JSON时，在索引0即data[0].year处，年份不可用。

要解决此问题，您可以更改PHP侧的数组结构，如下所示

$data = array('model' => $model, 'year' => $year);

在JS中，分别循环model和year

for (var i in data.model) {
    $model.append('<option value=' + encodeURIComponent(data.model[i].model) + '>' + data.model[i].model + '</option>');
}

for (var i in data.year) {
    $year.append('<option value=' + data.year[i].year + '>' + data.year[i].year + '</option>');            
}

Answer 2

刚刚找到解决方案在此处发布，以便将来可以帮助其他人。实际问题是数据没有在JSON中进行解析，因为如果有人想要的话，结果没有正确附加在这里是更新的代码。

<强> Jquery的：

$('#cq-select-model').click(function () {
    $.ajax({
        url: ajaxurl,
        data: {action: 'getPopulateField'},
        type: 'GET',
        success: function (data) {
            var object = $.parseJSON(data);

            var $year = $('#car-years');
            var $make = $('#car-makes');
            var $model = $('#car-models');
            $year.find('option').remove();
            $make.find('option').remove();
            $model.find('option').remove();
            $make.append('<option value="Ferrari">Ferrari</option>');
            for (var i in object.model) {
                $model.append('<option value=' + encodeURIComponent(object.model[i].model) + '>' + object.model[i].model + '</option>');
            }

            for (var j in object.year) {
                $year.append('<option value=' + object.year[j].year + '>' + object.year[j].year + '</option>');
            }
            $('#cq-show-data').show();
            $('.show-data-desc').show();
        }
    });
});

PHP脚本

function getPopulateField() {
global $wpdb;
$model_array = array();
$year_array = array();
$model = $wpdb->get_results("SELECT DISTINCT model FROM wp_ovdq_populate_fields ORDER BY model ASC");
$year = $wpdb->get_results("SELECT DISTINCT year FROM wp_ovdq_populate_fields");

$data = array(
    'model' => $model,
    'year' => $year
);

$data_send = json_encode($data);
wp_send_json($data_send);
}

这种解决方案在我的案例中完美无瑕。

使用Jquery

2 个答案: