Yii2基于Ajax自动获取表单数据的方法_PHP教程

Yii2基于Ajax自动获取表单数据的方法

2021-02-22 15:16wjtlht928 PHP教程

这篇文章主要介绍了Yii2基于Ajax自动获取表单数据的方法,涉及Yii结合ajax调用鼠标事件动态查询表单的相关技巧,需要的朋友可以参考下

本文实例讲述了Yii2基于Ajax自动获取表单数据的方法。分享给大家供大家参考，具体如下：

这里有两张表，表结构如下，locations表存放的省份和邮编等信息，两张表的model和curd均使用gii生成

yii2advanced.customers表

customer_id:int(11)
customer_name:varchar(100)
zip_code:varchar(20)
city:varchar(100)
province:varchar(100)

yii2advanced.locations表

location_id:int(11)
zip_code:varchar(20)
city:varchar(100)
province:varchar(100)

这里要通过在customer选择zip_code之后自动在表单中填充这个邮编对应的城市和省份信息

实现方法

首先需要在Locations控制器里面添加一个方法，他可以通过get过来的zip_id获取对应的location信息

									public function actionGetCityProvince($zipId)

									{

									  $location = Locations::findOne($zipId);

									  echo Json::encode($location);

									}

然后通过JS监听select，当select改变时，使用jQuery的get方法获取对应的信息，并使用jQuery的attr方法设置city和province的value即可

JS代码，位于customer的form视图

#zipCode 是select的id

									<?php

									$script = <<<JS

									jQuery('#zipCode').change(function(){

									  var zipId = $(this).val();

									  jQuery.get('index.php?r=locations/get-city-province',{zipId:zipId},function(data){

									    var data = jQuery.parseJSON(data);

									    jQuery("#customers-city").attr("value",data.city);

									    jQuery("#customers-province").attr("value",data.province);

									  });

									});

									JS;

									$this->registerJs($script);

									?>