在 WordPress 中读取 CSV 并将值传递给 [select]
Read CSV in WordPress and pass values to [select]
来源:https://bdwm.be/how-to-create-dynamically-populated-cascading-dropdown-lists-for-contact-form-7/
一个很酷的人分享了他的片段,它允许我根据 .csv 文件中的数据创建动态填充的级联下拉列表。它工作得很好,但问题是它只读取前 3 列(A、B、C)...我不知道如何在 'years' 之后添加另一个下拉列表,它将从第 4 列 (D) 读取值。我猜测解决该解决方案的关键是以下行:
$makes_models_years[$line[0]][$line[1]][] = $line[2];
基本上,源代码仅用于从 CSV 文件中读取三列。我想将它扩展到 4 甚至 5 列。此处示例:bdwm.be/wp-content/uploads/2017/12/make-model-year.png
联系表 7 个字段
[select makes]
[select models]
[select years]
footer.php
<script>
(function($) {
// create references to the 3 dropdown fields for later use.
var $makes_dd = $('[name="makes"]');
var $models_dd = $('[name="models"]');
var $years_dd = $('[name="years"]');
// run the populate_fields function, and additionally run it every time a value changes
populate_fields();
$('select').change(function() {
populate_fields();
});
function populate_fields() {
var data = {
// action needs to match the action hook part after wp_ajax_nopriv_ and wp_ajax_ in the server side script.
'action' : 'cf7_populate_values',
// pass all the currently selected values to the server side script.
'make' : $makes_dd.val(),
'model' : $models_dd.val(),
'year' : $years_dd.val()
};
// call the server side script, and on completion, update all dropdown lists with the received values.
$.post('/wp-admin/admin-ajax.php', data, function(response) {
all_values = response;
$makes_dd.html('').append($('<option>').text(' -- choose make -- '));
$models_dd.html('').append($('<option>').text(' -- choose model -- '));
$years_dd.html('').append($('<option>').text(' -- choose year -- '));
$.each(all_values.makes, function() {
$option = $("<option>").text(this).val(this);
if (all_values.current_make == this) {
$option.attr('selected','selected');
}
$makes_dd.append($option);
});
$.each(all_values.models, function() {
$option = $("<option>").text(this).val(this);
if (all_values.current_model == this) {
$option.attr('selected','selected');
}
$models_dd.append($option);
});
$.each(all_values.years, function() {
$option = $("<option>").text(this).val(this);
if (all_values.current_year == this) {
$option.attr('selected','selected');
}
$years_dd.append($option);
});
},'json');
}
})( jQuery );
</script>
functions.php
<?php
function ajax_cf7_populate_values() {
// read the CSV file in the $makes_models_years array
$makes_models_years = array();
$uploads_folder = wp_upload_dir()['basedir'];
$file = fopen($uploads_folder.'\make_model_year.csv', 'r');
$firstline = true;
while (($line = fgetcsv($file)) !== FALSE) {
if ($firstline) {
$firstline = false;
continue;
}
$makes_models_years[$line[0]][$line[1]][] = $line[2];
}
fclose($file);
// setup the initial array that will be returned to the the client side script as a JSON object.
$return_array = array(
'makes' => array_keys($makes_models_years),
'models' => array(),
'years' => array(),
'current_make' => false,
'current_model' => false
);
// collect the posted values from the submitted form
$make = key_exists('make', $_POST) ? $_POST['make'] : false;
$model = key_exists('model', $_POST) ? $_POST['model'] : false;
$year = key_exists('year', $_POST) ? $_POST['year'] : false;
// populate the $return_array with the necessary values
if ($make) {
$return_array['current_make'] = $make;
$return_array['models'] = array_keys($makes_models_years[$make]);
if ($model) {
$return_array['current_model'] = $model;
$return_array['years'] = $makes_models_years[$make][$model];
if ($year) {
$return_array['current_year'] = $year;
}
}
}
// encode the $return_array as a JSON object and echo it
echo json_encode($return_array);
wp_die();
}
// These action hooks are needed to tell WordPress that the cf7_populate_values() function needs to be called
// if a script is POSTing the action : 'cf7_populate_values'
add_action( 'wp_ajax_cf7_populate_values', 'ajax_cf7_populate_values' );
add_action( 'wp_ajax_nopriv_cf7_populate_values', 'ajax_cf7_populate_values' );
?>
我也遇到了同样的问题。我有一个 4 列的 csv 文件。 我的新专栏名称是 'school'
替换$makes_models_years[$line[0]][$line[1]][] = $line[2]; 和
$makes_models_years[$line[0]][$line[1]][$line[2]][] = $line[3];
更改 $file = fopen($uploads_folder.'\make_model_year.csv', 'r');到 $file = fopen($uploads_folder.'/make_model_year.csv', 'r');
(斜线不同)
在 functions.php 和 footer.php[= 中适用的地方为额外列添加额外变量50=]代码。
将functions.php的下半部分替换如下(我的新列名是
'school'), 就在 echo json_encode($return_array);
:
之上
$return_array['years'] = array_keys($makes_models_years[$make][$model]);
if ($year) {
$return_array['current_year'] = $year;
$return_array['schools'] = $makes_models_years[$make][$model][$year];
if($school)
{
$return_array['current_school'] = $school;
}
}
} }
- 在 footer.php 末尾添加此代码段
$years_dd.append($选项);
});
$.each(all_values.schools, function() {
$option = $("<option>").text(this).val(this);
if (all_values.current_school == this) {
$option.attr('selected','selected');
}
$schools_dd.append($option);
});
来源:https://bdwm.be/how-to-create-dynamically-populated-cascading-dropdown-lists-for-contact-form-7/
一个很酷的人分享了他的片段,它允许我根据 .csv 文件中的数据创建动态填充的级联下拉列表。它工作得很好,但问题是它只读取前 3 列(A、B、C)...我不知道如何在 'years' 之后添加另一个下拉列表,它将从第 4 列 (D) 读取值。我猜测解决该解决方案的关键是以下行:
$makes_models_years[$line[0]][$line[1]][] = $line[2];
基本上,源代码仅用于从 CSV 文件中读取三列。我想将它扩展到 4 甚至 5 列。此处示例:bdwm.be/wp-content/uploads/2017/12/make-model-year.png
联系表 7 个字段
[select makes]
[select models]
[select years]
footer.php
<script>
(function($) {
// create references to the 3 dropdown fields for later use.
var $makes_dd = $('[name="makes"]');
var $models_dd = $('[name="models"]');
var $years_dd = $('[name="years"]');
// run the populate_fields function, and additionally run it every time a value changes
populate_fields();
$('select').change(function() {
populate_fields();
});
function populate_fields() {
var data = {
// action needs to match the action hook part after wp_ajax_nopriv_ and wp_ajax_ in the server side script.
'action' : 'cf7_populate_values',
// pass all the currently selected values to the server side script.
'make' : $makes_dd.val(),
'model' : $models_dd.val(),
'year' : $years_dd.val()
};
// call the server side script, and on completion, update all dropdown lists with the received values.
$.post('/wp-admin/admin-ajax.php', data, function(response) {
all_values = response;
$makes_dd.html('').append($('<option>').text(' -- choose make -- '));
$models_dd.html('').append($('<option>').text(' -- choose model -- '));
$years_dd.html('').append($('<option>').text(' -- choose year -- '));
$.each(all_values.makes, function() {
$option = $("<option>").text(this).val(this);
if (all_values.current_make == this) {
$option.attr('selected','selected');
}
$makes_dd.append($option);
});
$.each(all_values.models, function() {
$option = $("<option>").text(this).val(this);
if (all_values.current_model == this) {
$option.attr('selected','selected');
}
$models_dd.append($option);
});
$.each(all_values.years, function() {
$option = $("<option>").text(this).val(this);
if (all_values.current_year == this) {
$option.attr('selected','selected');
}
$years_dd.append($option);
});
},'json');
}
})( jQuery );
</script>
functions.php
<?php
function ajax_cf7_populate_values() {
// read the CSV file in the $makes_models_years array
$makes_models_years = array();
$uploads_folder = wp_upload_dir()['basedir'];
$file = fopen($uploads_folder.'\make_model_year.csv', 'r');
$firstline = true;
while (($line = fgetcsv($file)) !== FALSE) {
if ($firstline) {
$firstline = false;
continue;
}
$makes_models_years[$line[0]][$line[1]][] = $line[2];
}
fclose($file);
// setup the initial array that will be returned to the the client side script as a JSON object.
$return_array = array(
'makes' => array_keys($makes_models_years),
'models' => array(),
'years' => array(),
'current_make' => false,
'current_model' => false
);
// collect the posted values from the submitted form
$make = key_exists('make', $_POST) ? $_POST['make'] : false;
$model = key_exists('model', $_POST) ? $_POST['model'] : false;
$year = key_exists('year', $_POST) ? $_POST['year'] : false;
// populate the $return_array with the necessary values
if ($make) {
$return_array['current_make'] = $make;
$return_array['models'] = array_keys($makes_models_years[$make]);
if ($model) {
$return_array['current_model'] = $model;
$return_array['years'] = $makes_models_years[$make][$model];
if ($year) {
$return_array['current_year'] = $year;
}
}
}
// encode the $return_array as a JSON object and echo it
echo json_encode($return_array);
wp_die();
}
// These action hooks are needed to tell WordPress that the cf7_populate_values() function needs to be called
// if a script is POSTing the action : 'cf7_populate_values'
add_action( 'wp_ajax_cf7_populate_values', 'ajax_cf7_populate_values' );
add_action( 'wp_ajax_nopriv_cf7_populate_values', 'ajax_cf7_populate_values' );
?>
我也遇到了同样的问题。我有一个 4 列的 csv 文件。 我的新专栏名称是 'school'
替换$makes_models_years[$line[0]][$line[1]][] = $line[2]; 和
$makes_models_years[$line[0]][$line[1]][$line[2]][] = $line[3];
更改 $file = fopen($uploads_folder.'\make_model_year.csv', 'r');到
$file = fopen($uploads_folder.'/make_model_year.csv', 'r');
(斜线不同)在 functions.php 和 footer.php[= 中适用的地方为额外列添加额外变量50=]代码。
将functions.php的下半部分替换如下(我的新列名是
'school'), 就在 echo json_encode($return_array);
:
$return_array['years'] = array_keys($makes_models_years[$make][$model]);
if ($year) {
$return_array['current_year'] = $year;
$return_array['schools'] = $makes_models_years[$make][$model][$year];
if($school)
{
$return_array['current_school'] = $school;
}
}
} }
- 在 footer.php 末尾添加此代码段
$years_dd.append($选项); });
$.each(all_values.schools, function() {
$option = $("<option>").text(this).val(this);
if (all_values.current_school == this) {
$option.attr('selected','selected');
}
$schools_dd.append($option);
});