Yii2 DropDownList Onchange更改自动完成小部件“源”属性？
Posted
技术标签:
【中文标题】Yii2 DropDownList Onchange更改自动完成小部件“源”属性？【英文标题】：Yii2 DropDownList Onchange change Autocomplete Widget "source" attribute? 【发布时间】：2015-10-04 05:31:52 【问题描述】：我已经试过了：yii2 dependent autocomplete widget
但我不知道为什么它不起作用。 这是我的带有脚本的html：
<?= $form->field($model, 'lbt_holder_type')->dropDownList(['prompt' => '--- Select Holder Type ---', 'S' => 'Student', 'E' => 'Employee'],
['onChange' => 'JS: var value = (this.value);
if(value == "S")$(#libraryborrowtransaction-name).autoComplete(source: '. $s_data.');
if(value == "E")$(#libraryborrowtransaction-name).autoComplete(source: '. $e_data.');
'])?>
自动完成：
<?= $form->field($model, 'name')->widget(\yii\jui\AutoComplete::classname(), [
'options' => ['class' => 'form-control', 'placeholder' => 'Enter Name/ID'],
'clientOptions' => [
'source' => $s_data,
'autoFill' => true,
'minLength' => '1',
'select' => new yii\web\JsExpression("function( event, ui )
$('#libraryborrowtransaction-lbt_holder_id').val(ui.item.id);
")
],
])?>
我想根据下拉列表值更改自动完成源，如果 S 则加载 $s_data 否则加载 $e_data。 对此有任何帮助。谢谢。
这是我的数据，
$s_data = (new \yii\db\Query())
->select(["CONCAT(stu_unique_id,' - ',stu_first_name,' ',stu_last_name) as value","CONCAT(stu_unique_id,' - ',stu_first_name,' ',stu_last_name) as label","s_info.stu_info_stu_master_id as id"])
->from('stu_master stu')
->join('join','stu_info s_info','s_info.stu_info_id = stu_master_stu_info_id')
->where('is_status = 0')
->all();
和，
$e_data = (new \yii\db\Query())
->select(["CONCAT(emp_unique_id, ' - ',emp_first_name,' ',emp_last_name) as value","info.emp_info_emp_master_id as id"])
->from('emp_master emp')
->join('join', 'emp_info info', 'info.emp_info_id = emp_info_emp_master_id')
->where('is_status = 0')
->all();
【问题讨论】：
今天有人要帮我吗？ 【参考方案1】：好吧，我已将您的代码 sn-ps 添加到我的测试 yii2 环境中以测试出了什么问题。所以你的代码有一些问题：
[
'onChange' =>
'JS: var value = (this.value);
if(value == "S")$(#libraryborrowtransaction-name).
autoComplete(source: '. $s_data.');
if(value == "E")$(#libraryborrowtransaction-name).
autoComplete(source: '. $e_data.');
']
首先我注意到 yii 对“S”和“E”的引号符号应用了一些转义，并且您在浏览器中的代码看起来像 &quot;S&quot;。
接下来，jui 自动完成插件将属性添加到 jquery 原型，名称为 "autocomplete"，但不是 "autoComplete"。至于js是区分大小写的，这两个名字看起来不一样。
所以我的解决方案是将所有 js 从onchange 属性移动到单独的 js 脚本，如下所示（出于测试目的，您可以将其添加到您使用问题中提供的代码的 yii 视图文件中）
<script>
function holderTypeChangeHandler(ev)
var value = (this.value);
if(value == 'S')
$('#libraryborrowtransaction-name').autocomplete(source: ' . $s_data . ');
if(value == 'E')
$('#libraryborrowtransaction-name').autocomplete(source: ' . $e_data . ');
window.onload = function()
$('#libraryborrowtransaction-lbt_holder_type').on('change', holderTypeChangeHandler);
;
</script>
并将这个新事件处理程序的名称粘贴到您的下拉列表的 onchange 属性中，如下所示：
['onChange' => 'holderTypeChangeHandler']
更新：---------
由于 Yii2 Autocomplete 基于 JQuery UI 自动完成小部件和 Yii2 自动完成 clientOptions 包含 settings for JUI autocomplete widget，那么我们可以参考 JUI API 文档对 source option 的解释。如您所见，此选项可以是字符串（在这种情况下，它用作 JSON 数据的 URI）、函数或 js 数据数组或 js 对象数组。
在您的问题中，您正在使用\yii\db\Query 在method all() 的帮助下从数据库中获取一些数据，这将返回一个数据数组。因此，最后您需要将使用\yii\db\Query->all 获得的数据数组转换为js 对象数组。为此，请使用 php json functions，特别是您需要使用 json_encode() 函数的情况：
// Let's say this is a result of your query to db with use of `\yii\db\Query->...->all();`
$some_array = [
[
"value" => "Val 1",
"label" => "Label 1",
"id" => 1
],
[
"value" => "Val 2",
"label" => "Label 2",
"id" => 2
]
]
// Just convert it to json string
$s_data = json_encode($some_array);
...
// When concat this json string as a value of source attribute for Yii Autocomplete
$('#libraryborrowtransaction-name').autocomplete(source: <?= $s_data ?> );
如果您的$e_data 也是如此。请注意，您使用PHP从db中获取数据，但将其与JS一起使用，因此需要将php数组转换为字符串表示的js对象数组，并且您可以使用json_encode进行此转换。
【讨论】：
我应该将什么传递给我的自动完成“源”。我收到 json 解析错误。 当我改变 S 或 E 的值时，它会超过错误。 我的控制台显示了这个“return JSON.parse(data + "");"网页未找到。我认为 url 是在 onChange 事件不起作用之后创建的。 是的，JUI 自动完成依赖于源选项的类型，可以使用 Ajax 请求来获取自动完成的数据，或者为此使用本地值或对象数组。因此，由于您没有指定 $s_data 和 $e_data 的类型，我假设您使用的是 Ajax。如果你澄清这一点，我可以编辑我的 sn-p 来管理你的源类型。 我的小部件是一个不属于 jquey 的 yii2 自动完成小部件，$s_data 是查询的结果。以上是关于Yii2 DropDownList Onchange更改自动完成小部件“源”属性？的主要内容，如果未能解决你的问题，请参考以下文章
Yii2 DropDownList Onchange更改自动完成小部件“源”属性？