Yii2使用dropdownlist实现地区三级联动功能的方法

前端技术 2023/09/07 PHP

本文实例讲述了Yii2使用dropdownlist实现地区三级联动功能的方法。分享给大家供大家参考，具体如下：

视图部分：

<?php
use yii\\helpers\\Url;
use yii\\widgets\\ActiveForm;
use yii\\helpers\\ArrayHelper;
use yii\\helpers\\Html;
/* @var $this yii\\web\\View */
/* @var $model common\\search\\service\\ItemSearch */
/* @var $form yii\\widgets\\ActiveForm */
?>
<div class=\"row\">
  <div class=\"item-search\">
    <?php $form = ActiveForm::begin([
      \'action\' => [\'index\'],
      \'method\' => \'get\',
      \'options\' => [\'class\' => \'form-inline\']
    ]); ?>
    <?= $form->field($model, \'cityName\', [\'options\' => [\'class\' => \'form-group col-lg-2\']])->dropDownList(ArrayHelper::map($cities, \'id\', \'name\'), [\'prompt\' => \'请选择城市\'])->label(\'请选择城市\', [\'class\' => \'sr-only\']) ?>
    <?= $form->field($model, \'areaName\', [\'options\' => [\'class\' => \'form-group col-lg-2\']])->dropDownList(ArrayHelper::map($areas, \'id\', \'name\'), [\'prompt\' => \'请选择区县\'])->label(\'请选择区县\', [\'class\' => \'sr-only\']) ?>
    <?= $form->field($model, \'communityName\', [\'options\' => [\'class\' => \'form-group col-lg-2\']])->dropDownList(ArrayHelper::map($communities, \'id\', \'name\'), [\'prompt\' => \'请选择小区\'])->label(\'请选择小区\', [\'class\' => \'sr-only\']) ?>
    <div class=\"col-lg-2 col-lg-offset-1\">
      <input class=\"form-control\" id=\"keyword\" placeholder=\"请输入小区名\" value=\"\" />
    </div>
    <div class=\"col-lg-1\">
      <button type=\"button\" id=\"search-community\" class=\"btn btn-info\">搜索</button>
    </div>
    <p></p>
    <div class=\"form-group col-lg-1 pull-right\">
      <?= Html::submitButton(\'搜索\', [\'class\' => \'btn btn-primary\']) ?>
    </div>
    <?php ActiveForm::end(); ?>
  </div>
</div>
<p> </p>
<?php
$this->registerJs(\'
  //市地址改变
  $(\"#itemsearch-cityname\").change(function() {
    //市id值
    var cityid = $(this).val();
    $(\"#itemsearch-areaname\").html(\"<option value=\\\"0\\\">请选择区县</option>\");
    $(\"#itemsearch-communityname\").html(\"<option value=\\\"0\\\">请选择小区</option>\");
    if (cityid > 0) {
      getArea(cityid);
    }
  });
  //区地址改变
  $(\"#itemsearch-areaname\").change(function() {
    //区id值
    var areaid = $(this).val();
    $(\"#itemsearch-communityname\").html(\"<option value=\\\"0\\\">请选择小区</option>\");
    if (areaid > 0) {
      getCommunity(areaid);
    }
  });
  //获取市下面的区列表
  function getArea(id)
  {
    var href = \"\' . Url::to([\'/service/base/get-area-list\'], true). \'\";
    $.ajax({
      \"type\" : \"GET\",
      \"url\"  : href,
      \"data\" : {id : id},
      success : function(d) {
        $(\"#itemsearch-areaname\").append(d);
      }
    });
  }
  //获取区下面的小区列表
  function getCommunity(id)
  {
    var href = \"\' . Url::to([\'/service/base/get-community-list\'], true) . \'\";
    $.ajax({
      \"type\" : \"GET\",
      \"url\"  : href,
      \"data\" : {id : id},
      success : function(d) {
        $(\"#itemsearch-communityname\").append(d);
      }
    });
  }
  //搜索小区
  $(\"#search-community\").click(function() {
    var word  = $(\"#keyword\").val();
    var areaid = $(\"#itemsearch-areaname option:selected\").val();
    var href  = \"\' . Url::to([\'/service/base/search-community\'], true) . \'\";
    if (areaid > 0) {
      $.ajax({
        \"type\" : \"GET\",
        \"url\"  : href,
        \"data\" : {id : areaid, word : word},
        success : function(d) {
          $(\"#itemsearch-communityname\").html(d);
        }
      });
    }
  });
\');
?>

模型部分：

就是我们常用的ajax请求,当然php中需要直接组合成<option value=\"\"></option>这样的结构直接用,$form->field($model, $var)中的变量数据表中不一定有,得在模型中自己定义,并设置安全字段,而且搜索模型也可能需要修改成自己需要的样子,模型可能要这样：

class HuangYeError extends \\yii\\db\\ActiveRecord
{
  public $cityName;
  public $areaName;
  public $communityName;
  public $group;
  public $cate;
  /**
   * @inheritdoc
   */
  public static function tableName()
  {
    return \'ll_hy_huangye_error\';
  }
  public static function getDb()
  {
    return Yii::$app->get(\'dbnhuangye\');
  }
}

之前是多表,需要使用jjoinWith()连表,后来被我全部转化为单表了,多表实在是慢,能转化成单表就用单表吧：

class HuangYeErrorSearch extends HuangYeError
{
  const PAGE_SIZE = 20;
  public $communityName;
  public $startTime;
  public $endTime;
  /**
   * @inheritdoc
   */
  public function rules()
  {
    return [
      [[\'id\', \'serviceid\', \'userid\', \'categoryid\', \'communityid\', \'sortorder\', \'ctime\', \'utime\', \'status\'], \'integer\'],
      [[\'username\', \'name\', \'logo\', \'phone\', \'address\', \'content\', \'error\', \'communityName\', \'startTime\', \'endTime\'], \'safe\'],
    ];
  }
  /**
   * @inheritdoc
   */
  public function scenarios()
  {
    // bypass scenarios() implementation in the parent class
    return Model::scenarios();
  }
  /**
   * Creates data provider instance with search query applied
   *
   * @param array $params
   *
   * @return ActiveDataProvider
   */
  public function search($params)
  {
    $query = HuangYeError::find();
    //status == 9 删除状态
    $condition = \' `status` != :status\';
    $p[\':status\'] = 9;
    $query->where($condition, $p);
    $dataProvider = new ActiveDataProvider([
      \'query\' => $query,
      \'pagination\' => [
        \'pageSize\' => self::PAGE_SIZE,
      ],
    ]);
    $this->load($params);
    if (!$this->validate()) {
      // uncomment the following line if you do not want to any records when validation fails
      // $query->where(\'0=1\');
      return $dataProvider;
    }
    $query->andFilterWhere([
      \'userid\' => $this->userid
    ]);
    $query->andFilterWhere([\'like\', \'username\', $this->username])
      ->andFilterWhere([\'like\', \'name\', $this->name])
      ->andFilterWhere([\'like\', \'phone\', $this->phone])
      ->andFilterWhere([\'like\', \'address\', $this->address])
      ->andFilterWhere([\'like\', \'content\', $this->content])
      ->andFilterWhere([\'ll_hy_huangye_error.status\' => $this->status])
      ->andFilterWhere([\'ll_hy_huangye_error.categoryid\' => $this->categoryid])
      ->andFilterWhere([\'between\', \'ctime\', strtotime($this->startTime . \'0:0:0\'), strtotime($this->endTime . \'23:59:59\')])
      ->andFilterWhere([\'like\', \'error\', $this->error]);
    if (intval($this->communityName)) {
      $query->andFilterWhere([\'ll_hy_huangye_error.communityid\' => intval($this->communityName)]);
    }
    $order = \' `ctime` DESC\';
    $query->orderBy($order);
    return $dataProvider;
  }
}

控制器中写比较简单一点,直接调用就行了：

/**
* ajax请求小区
*
* @param $id
* @return string
*/
public function actionGetCommunityList($id)
{
    $option = \'\';
    $result = self::getCommunity($id);
    if ($result) {
      foreach ($result as $value) {
        $option .= \'<option value=\"\' . $value[\'id\'] . \'\">\' . $value[\'name\'] . \'</option>\';
      }
    } else {
      $option .= \'<option value=\"0\">暂未开通可选择的小区</option>\';
    }
    echo $option;
}

更多关于Yii相关内容感兴趣的读者可查看本站专题：《Yii框架入门及常用技巧总结》、《php优秀开发框架总结》、《smarty模板入门基础教程》、《php面向对象程序设计入门教程》、《php字符串(string)用法总结》、《php+mysql数据库操作入门教程》及《php常见数据库操作技巧汇总》

希望本文所述对大家基于Yii框架的PHP程序设计有所帮助。

本文地址：https://www.stayed.cn/item/18934

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见，何事秋风悲画扇。

我的标签

随笔档案