zoukankan      html  css  js  c++  java
  • 通过城市联动实时将地址显示到text中

    <div class="form-group field-supplier-sort <?php if($model->getErrors('province_id') || $model->getErrors('city_id') || $model->getErrors('district_id')):?>has-error<?php else:?>has-success<?php endif;?>">
        <label class="control-label col-sm-2" for="supplier-sort">配电室所在地区</label>
        <div class="col-sm-10">
            <div class="form-inline citylist">
                <?=Html::activeDropDownList($model, 'province_id', ArrayHelper::merge([0=>'请选择省份'], Area::getArrayForInput(0)), ['class'=>'input-sm form-control', 'tabindex'=>5]);?>
                <?=Html::activeDropDownList($model, 'city_id', ArrayHelper::merge([0=>'请选择城市'], Area::getArrayForInput($model->province_id)), ['class'=>'input-sm form-control', 'tabindex'=>5])?>
                <?=Html::activeDropDownList($model, 'district_id', ArrayHelper::merge([0=>'请选择区域'], Area::getArrayForInput($model->city_id)), ['class'=>'input-sm form-control', 'tabindex'=>5])?>
            </div>
            <div class="help-block help-block-error "><?=$model->getFirstError('province_id') . $model->getFirstError('city_id') . $model->getFirstError('district_id')?></div>
        </div>
    </div>
    <div class="form-group field-concentrator-voltage has-success">
        <label class="control-label col-sm-2" for="concentrator-voltage">地址</label>
        <div class="col-sm-2">
            <input type="text" id="concentrator-address" class="form-control input-sm cityName" name="Concentrator[address]" value="<?=$model->address;?>" >
            <div class="help-block help-block-error "></div>
        </div>
    </div>
    <input type="text" id="alladdress" class="form-control input-sm" name="Concentrator[add]" value="<?=$model->addressText?>">
    <script type="text/javascript">
        function getcitytext(){//城市联动实时显示
            citytext = '';
            $(".citylist select").each(function(){
                if($(this).val()>0){
                    citytext += $(this).find('option:selected').text();
                }else{
                    citytext += '';
                }
            });
            $("#alladdress").val(citytext);
        }
        $(function(){
            getcitytext();
            $('#concentrator-province_id').change(function(){
                var parent_id = parseInt($(this).val());
                $.post('<?=Url::to(['/ajax/areaoption'])?>', {parent_id:parent_id, d:'请选择城市'}, function(data){
                    if(data) {
                        $('#concentrator-city_id').html(data);
                        $('#concentrator-district_id').html('<option>请选择区域</option>');
                        getcitytext();
                    }
                });
            });
            $('#concentrator-city_id').change(function(){
                var parent_id = parseInt($(this).val());
                $.post('<?=Url::to(['/ajax/areaoption'])?>', {parent_id:parent_id, d:'请选择区域'}, function(data){
                    if(data) {
                        $('#concentrator-district_id').html(data);
                        getcitytext();
                    }
                });
            });
            $(document).on("change", "#concentrator-district_id", function () {
                getcitytext();
            });
        });
    </script>
    
    class AjaxController extends Controller {
      public function actionAreaoption(){
         $parentId = intval($_POST['parent_id']);
         $default = $_POST['d'];
         $html = '';
         if ($default) {
            $html .= '<option value="0">' . $default . '</option>';
         }
         if ($parentId > 0) {
         $array = Area::getArrayForInput($parentId);
         foreach ($array as $key=>$value) {
            $html .= '<option value="' . $key . '">' . $value . '</option>';
         }
         }
         echo $html;
      }
    }
  • 相关阅读:
    一线架构师实践指南阅读体会_需求之于架构
    Multi-modal Sentence Summarization with Modality Attention and Image Filtering 论文笔记
    开始用PyTorch
    【微软大法好】VS Tools for AI全攻略(4)——选择适合自己的虚拟机
    【零基础】【Fungus首个中文教程】10分钟快速构建Unity中的万能对话系统 / 叙事系统 / 剧情系统
    Unity使用脚本进行批量动态加载贴图
    【转】Python处理wave文件
    让linux远程主机在后台运行脚本
    【bug清除】新Surface Pro使用OneNote出现毛刺现象的解决方案
    【bug清除】Surface Pro系列使用Drawboard PDF出现手写偏移、卡顿、延迟现象的解决方式
  • 原文地址:https://www.cnblogs.com/l-zl/p/6514580.html
Copyright © 2011-2022 走看看