2015-04-02 2 views
0

Я новичок в JQuery, я использую PHP в своем коде. Я не знаю, как сделать динамическое выпадающее меню. Когда пользователь выбирает из первого раскрывающегося списка - региона, затем он выбирает из другой выпадающей школы, которая находится в этом регионе. Пожалуйста помоги! Мой код:Как создать динамическое выпадающее меню с jquery

<html> 
 
<head> 
 
    
 
    <script src="//code.jquery.com/jquery-1.11.2.min.js"></script> 
 
    <script type="text/javascript"> 
 
     </script> 
 
    </head> 
 
    <body> 
 
    <?php 
 
    echo form_open(); 
 
    
 
    echo "<table border = '0' >"; 
 
    echo "<tr><td> Region:* </td><td>"; 
 
echo "<select name = 'region[]' id='region' >"; 
 
    foreach($regions as $row) 
 
    { 
 
    echo '<option value= "'.$row->region.'">'.$row->region.'</option>'; 
 
    } 
 
    echo "</select>"; 
 
    
 
    
 
    echo "</td></tr>"; 
 

 
    echo "<tr><td> School:* </td><td>"; 
 
    
 
    echo "<select name = 'school[]' id='school'>"; 
 

 
    foreach($school_show as $row) 
 
    { 
 
    echo '<option value="'.$row->school_name.'">'.$row->school_name.'</option>"; 
 
    } 
 
    echo "</select>"; 
 
    
 
    echo "</td></tr>"; 
 
echo form_submit($data); 
 
    echo "</form>"; 
 
    echo "</table>";

Контроллер:

<?php 
 
class Home extends CI_Controller { 
 
public function register() 
 
    { 
 
$this->load->model('user_model'); 
 
       $data['dynamic_view'] = 'register_form'; 
 
       $data['regions'] = $this->user_model->regions_show(); 
 
       $data['school_show'] = $this->user_model->school_show(); 
 
       $this->load->view('templates/main',$data); 
 
      } 
 
}

Модель:

<?php 
 
class User_model extends CI_Model { 
 

 
    
 
    public function __construct() { 
 
     parent:: __construct(); 
 
     $this->load->database(); 
 
     $this->load->helper('array'); 
 
      
 
    } 
 
     
 
public function regions_show() { 
 
     $this->db->select('region'); 
 
     $this->db->distinct('region'); 
 
     $this->db->from('schools'); 
 

 
     $result=$this->db->get(); 
 
       return $result->result(); 
 

 
    } 
 
    public function school_show() { 
 
     $this->db->select('school_name'); 
 
     
 
     $this->db->from('schools'); 
 

 
     $result=$this->db->get(); 
 
       return $result->result(); 
 

 
    } 
 
}

+0

Когда пользователь выбирает область в первом выпадающем списке, вы хотите, чтобы прочитать название этого региона с помощью '$ (это) .val() '. Затем отправьте это значение с помощью ajax-вызова в файл PHP, который будет читать все школы из этого региона в базе данных и отправить список обратно в jQuery (как правило, в формате JSON). Затем повторите этот json и создайте/обновите второй раскрывающийся список. Об этом много тысяч уроков. –

+0

Да, это то, чего я хочу. Я попробовал что-то из учебника, но, поскольку я не знаю jQuery, я этого не делал. Это не сработало. –

ответ

1

Используйте функцию Java-скрипт со свойством OnChange первого Выпадающее в. Таким образом, когда выбрано первое раскрывающееся значение, он будет вызывать и передавать значение функции, которая затем будет использоваться для заполнения второго раскрывающегося списка.

Простой пример идеи может быть следующим -

function populateSecond(id) 
 
{ 
 
    if(id == 1){ 
 
    $('select[name=first]').append('<option value="a">A</option>');  
 
    }else{ 
 
    $('select[name=first]').append('<option value="b">B</option>');  
 
    } 
 
}
<select name="first" onChange="populateSecond(this.value);"> 
 
    <option value="1">One</option> 
 
    <option value="2">Two</option> 
 
    <option value="3">Three</option> 
 
</select> 
 

 
<select name="second"> 
 
</select>

Смежные вопросы