简体   繁体   English

依赖于代码点火器的下拉列表

[英]codeigniter dependent drop-down lists

Dear I need your help! 亲爱的,我需要您的帮助! I have two drop-down lists that work correctly. 我有两个可以正常工作的下拉列表。 One is ciudades and the other comunas, the problem is that I need the comunas list to be dependent on ciudades, for example that when selecting a ciudad from the list, I load the comunas associated with the id of the selected ciudad. 一个是城市,另一个是城市,问题是我需要城市列表依赖城市,例如,当从列表中选择城市时,我加载与所选城市的ID相关联的城市。

This is my code! 这是我的代码!

<!-- language: lang-or-tag-here -->

    <label>Ciudad:</label><select class="form-control" name="ciudad" required autocomplete="off">
  <option value="">Seleccione</option>
    <?php foreach($listaciudades as $ciudad):?>

        <option value="<?= $ciudad['idciudad']?>"
            <?php if ($ciudad == $ciudad['idciudad']) : ?> selected<?php endif; ?>
        >
            <?= $ciudad['nombre']?>
        </option>
    <?php endforeach; ?>
</select> 

   <p><label>Comuna:</label> <select id='comuna' name="comuna" autocomplete="off" required value="<?php echo $comuna; ?>"><?php echo form_error("comuna","<span class='help-block'>","</span>") ?>


    <option value="">Seleccione</option>
    <?php
    foreach($listacomunas as $comuna)
    {
        echo '<option value="'.$comuna['idcomuna'].'">'.$comuna['nombre'].'</option>';
    }
    ?>  
 </select> 
You can apply ajax to achieve the desired result.
Lets try this sample code

addemp.php ( my view page)
--------------------------
<head><script type="text/javascript" src="<?php echo base_url();?>js/jquery-1.10.2.js"></script>
        <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
        <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
</head>
<div class="col-sm-4">
<div class="form-group">
<label>Country <label>                                        
<select class="select" id="selCountry" name="selCountry" onChange="getstate(this.value)" >
<option value="0">Select</option>
 <?php if($con){ foreach($con as $val) { ?>
<option value="<?php echo $val['id']; ?>" <?php if(isset($country)){if($country==$val['id']) echo 'selected="selected"'; }else{echo set_select('selCountry', $val['id'], False);} ?> ><?php echo $val['con_name']; ?></option>
  <?php }} ?>
</select>
<span style="color:red"><?php echo form_error('selCountry'); ?></span>
</div>
<div>
<div class="col-sm-4">
<div class="form-group">
<label>State/Province/Region<label> 
<select class="select" id="selState" name="selState" onChange="getcity(this.value)">
<option value="0" selected="selected">Select</option>
</select>
<span style="color:red"><?php echo form_error('selState'); ?></span>
</div>
</div>  
<script>
function getstate(id)
{       
//alert('this id value :'+id);
$.ajax({    
type: "POST",
url: '<?php echo base_url();?>index.php/employee/getState/'+id,
// data: id='country_id',
success: function(data){
//alert(data);
$('#selState').html(data);
},
});
}
</script>
<script type="text/javascript" src="<?php echo base_url();?>css_style/js/jquery-3.2.1.min.js"></script> 

Employee.php(mycontroller)
-------------------------
public function getState($id)
{
    $data['state'] = $this->Emp_model->getState($id);
    $this->load->view('ajax_state_view',$data); 
}


ajax_state_view.php ( my ajax view page)
---------------------------------------
<option value="0"> Select </option>
<?php if($state){ foreach($state as $val) { ?>
<option value="<?php echo $val['id']; ?>" ><?php echo $val['state_name']; ?></option>
<?php }} ?>


Emp_model.php ( my model page)
-------------------------------
public function getState($id) {
$where  =   array("country_id"=>$id);
this->db->select('*');
$this->db->from('state');
$this->db->where($where);           
$query = $this->db->get();
//echo $this->db->last_query();exit;
return $query->result_array();
}

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM