Yii2下拉框实现

详细介绍yii2下拉框的实现方法,以商品分类的下拉框为例:

第一种方法:使用Html的activeDropDownList(),该方法的优点是:可以自定义下拉框的样式。具体实现如下:

1.控制器中,获取视图中所需的数据

public function actionList(){
        $category_model=new Category();
        $category_info=$category_model->find()->all();
        return $this->renderPartial(‘list‘,[‘category_info‘=>$category_info,‘category_model‘=>$category_model]);
    }

2.视图中,use yii\helpers\Html;

<?php $form = ActiveForm::begin([]);?>
    <?php echo Html::activeDropDownList($category_model,‘category_name‘,ArrayHelper::map($category_info,‘category_id‘,‘category_name‘),[‘style‘=>‘border:1px solid    gray;width:150px;‘])?>           
<?php ActiveForm::end(); ?>

3.这样之后,表单的下拉框名称是:Category Name,如果要改变这个值,在控制器对应的模型中使用attributeLabels()方法,具体如下:

public function attributeLabels(){
        return array(
            ‘category_name‘=>‘分类‘,
        );
    }

第二种方法:使用ActiveForm的dropDownList(),优点是使用的yii自定义的样式,也可以自定义样式

1.控制器中获取视图中需要的数据

2.视图中,use yii\helpers\Html;
use yii\widgets\ActiveForm;
use yii\helpers\ArrayHelper;

<?php $form = ActiveForm::begin([]);?>
    <?php echo $form->field($category_model,‘category_name‘)->dropDownList(ArrayHelper::map($category_info,‘category_id‘,‘category_name‘),[‘style‘=>‘border:1px solid blue;width:150px;‘])?>           
<?php ActiveForm::end(); ?>

补充:该方法也可以自定义样式:具体如上代码

各参数说明:

ArrayHelper::map()------------生成k=>v的一维或多维数组

$category_info----------------后台获取的数据

category_id-------------------option的value值

category_name---------------select 的name值

Yii2下拉框实现

时间: 2024-10-08 01:12:22

Yii2下拉框实现的相关文章

yii2 html下拉框

下拉框 带默认值 <?php $form=ActiveForm::begin(); echo $form->field($model,'uname', ['inputOptions'=>['class'=>'myway'], 'template'=>'<span>{label}</span>{input}']) ->dropDownList(ArrayHelper::map(array(['uid'=>1,'uname'=>'xm']

读取mysql中的特定列值放入页面的下拉框中

1.使用的技术:JSP,Spring JDBC(Mapper) 2.代码 2.1 接口 public interface IMeetingRoomDao { public List<Mrcap> selectCap(); public List<Mrfloor> selectFloor(); } 2.2 实现类 @Override public List<Mrcap> selectCap() { List<Mrcap> caplist = new Array

自建List&lt;&gt;绑定ComboBox下拉框实现省市联动

using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; using System.Drawing; using System.Linq; using System.Text; using System.Windows.Forms; using System.Data.SqlClient; namespace _04省市联动 { public partial cl

【峰回路转】Excel技巧百例 06.设置下拉框

如何才能在Excel中完成一个如下图所示的下拉框呢? 1.首先鼠标选中B2单元格 2.点击上方的"数据"中的"数据验证"下方的小三角,然后点击浮层中的第一项:数据验证 3.在弹出的窗口中,选择"序列",在来源中输入:请选择,优,良,中,差,点击[确认]. 这样一个下拉框,我们就做好了. 版权声明:本文为博主原创文章,未经博主允许不得转载.

struts2 jsp表单提交后保留表单中输入框中的值 下拉框select与input

原文地址:struts2 jsp表单提交后保留表单中输入框中的值 下拉框select与input jsp页面 1     function dosearch() {2         if ($("#textValue").val() == "") {3                 $("#errortip").html("<font color='#FF0000'>请输入查询内容</font>")

选择下拉框是如何取选项的值?

<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>select</title> <script type="text/javascript"> </script> </head> <body id="body&

vue.js实现单选框、复选框和下拉框

Vue.js可以很方便的实现数据双向绑定,所以在处理表单,人机交互方面具有很大的优势.下边以单选框.复选框和下拉框为例介绍他们在HTML和Vue.js中的具体实现方式. 一.单选框 在传统的HTML中实现单选框的方法如下: <div id="app"> <input type="radio" name="gender" value="man" id="man"/><label

jQuery之双下拉框

双下拉框要实现的效果,实际上就是左边下拉选择框里的内容,可以添加到右边,而右边同理.写了个简单的例子,来说明一下. 代码如下: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 <!DOCTYPEhtml> <html> <head> <title>jq

angularjs下拉框空白

搜索angularjs下拉框空白,可以出现很多解决方案,但是对于静态字段来说,网上目前还没有找到解决方案,如下: 1 <select class="form-control" ng-model="UserState" 2 ng-init="UserState=0"> 3 <option value="-1">选择状态</option> 4 <option value="0&q