Answers
Yii2本身没有联动效果插件,都是用其他类拼接起来的,不过你自己可以写插件。yii2的例子没有,之前写过yii1的联动效果。你不想失去本身的验证,只要input的name跟模型中的一样就行了。
//view
<div class="form-group row">
<div class="col-md-1">
<?php echo $form->dropDownList($blog,'mid',CHtml::listData(Metas::model()->parents(),'mid','name'), array (
'class'=>'form-control', 'empty'=>array('0'=>'请选择类别'), 'onchange'=>'ajaxGetArea(this)')); ?>
<?php echo $form->error($blog,'mid'); ?>
</div>
</div>
//js
Yii::app()->clientScript->registerScript('metas',
'
function ajaxGetArea(obj)
{
//请求地址
var link = "'.Yii::app()->createUrl("/cms/metas/json").'";
//请求数据
$.post(
link,
{
parent : $(obj).val()
},
function(data)
{
//清除子类的select
$(obj).parent().nextAll("div").each(function() {
$(this).remove();
});
if (data != "-1") {
//构造子类select的html
var select = null;
// 此处注意添加onchange事件
select = "<div class=\"col-md-1\"><select class=\"form-control\" name=\"Articles[mid]\" onchange=\"ajaxGetArea(this)\"><option value=\"-1\">请选择类别</option>";
$.each(data, function(key, item) {
select += "<option value="+item.mid+">"+item.name+"</option>";
});
select += "</select></div>";
//插入到右侧,上一级
$(obj).parent().after(select);
//触发下一个子类select的动态加载
//$(obj).next("select").trigger("change", function() {
//ajaxGetArea($(this));
//});
//更新name的位置
$(obj).removeAttr("id");
$(obj).next("select").attr("id", "Articles_mid");
$(obj).removeAttr("name");
$(obj).next("select").attr("name", "Articles[mid]");
}
},
"json"
);
}
',CClientScript::POS_END);
lanyuy
answered 10 years, 2 months ago