html - Can't make Dynamic dependent dropdown in CodeIgniter with jQuery -
i'm trying make dynamic dropdown in codeigniter using jquery, i'm new jquery , not work. user first have choose region , after have choose dropdown ot schhols, in region.
my view is:
<html> <head> <script src="//code.jquery.com/jquery-1.11.2.min.js"></script> <script> $('#school').hide(); $('#region').change(function(){ var region = $('#region').val(); if (region != ""){ var post_url = "/index.php/home/register/" + region; $.ajax({ type: "post", url: post_url, success: function(school) { $('#school').empty(); $('#school').show(); $.each(school,function(school_id,school) { var opt = $('<option />'); opt.val(school_id); opt.text(school); $('#school').append(opt); }); } }); } else { $('#school').empty(); $('#school').hide(); } }); </script> </head> <?php echo "<body>"; echo validation_errors(); echo "<div class='container'>"; echo form_open('home/register'); echo "<h3>register:</h3><br/>"; echo "<table border = '0' >"; echo "<tr><td> username:* </td><td>"; $data=array( 'name' => 'username', 'class' => form_error('username') ? 'error' : '', 'value' => set_value('username') ); echo form_input($data); echo "</td></tr>"; //come code register form -passwords , on.. echo "<tr><td> region:* </td><td>"; echo "<select name = 'region' id='region' >"; foreach($regions $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 $row) { echo "<option value= '$row->school_name '>$row->school_name</option>"; } echo "</select>"; echo "</td></tr>"; echo "<tr ><td> class:* </td><td>"; $options=array( '8' => '8', '9' => '9', 'class' => form_error('class[]') ? 'error' : '' ); echo form_dropdown('class[]',$options); echo "</td></tr>"; echo "</table><br/>"; $data=array( 'class' => 'btn btn-success ', 'id' => 'reg', 'value' => 'register' ); echo form_submit($data); echo "</form>"; echo "</div>"; echo "</body>"; echo "</html>"; my controller is:
<?php class home extends ci_controller { public function __construct() { parent::__construct(); $this->load->library('table'); $this->load->library('session'); $this->load->helper('url'); $this->load->database(); } public function register() { if ($this->form_validation->run()==false) { $this->signup(); } else { if( $this->user_model->register()) { $data['dynamic_view'] = 'success_reg'; $this->load->view('templates/main',$data); } else { $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); } } } my model is:
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(); }
here's code register form.
<html> <head> <title></title> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap-theme.min.css"> <link rel="stylesheet" href="http://www.redexperu.com/assets/js/bootstrap-progressbar/less/bootstrap-progressbar-3.2.0-3.x.x.less"> <link rel="stylesheet" type="text/css" href="http://localhost:9080/survey/css/css.css" /> <link rel="stylesheet" type="text/css" href="http://localhost:9080/survey/css/styles/layout.css" /> </head> <body> <div id="container"> <div id="header"> <h1></h1> <h4 id='header_title'><a href="http://localhost:9080/survey/index.php/home/logout">Излез</a></h4> <h4 id='header_title'> </h4> <div id='nav'> <a href="http://localhost:9080/survey/index.php/index/surveys_show">Анкети</a> <a href="http://localhost:9080/survey/index.php/admin/surveys_manage">Управление на анкети</a> <a href="http://localhost:9080/survey/index.php/index/results_show">Резултати</a> <a href="http://localhost:9080/survey/index.php/chart/activity_chart">Диаграма</a> <a href="http://localhost:9080/survey/index.php/index/student_results_show">Резултати на ученици</a> <a href="http://localhost:9080/survey/index.php/coordinator/teachers_show">Добави учител</a> </div> </div> </div> </body> </html> <html> <head> <script src="//code.jquery.com/jquery-1.11.2.min.js"></script> <script type="text/javascript"> /*function showhide(self, show){ if (show) $('.toggle').show(); else $('.toggle').hide(); $(":radio").prop('checked',false); $(self).prop('checked',true); }*/ </script> <script> $('#school').hide(); $('#region').change(function(){ var region = $('#region').val(); if (region != ""){ var post_url = "/index.php/home/get_schools/" + region; $.ajax({ type: "post", url: post_url, success: function(school) //we're calling response json array 'cities' { $('#school').empty(); $('#school').show(); $.each(school,function(school_id,school) { var opt = $('<option />'); // here we're creating new select option each group opt.val(school_id); opt.text(school); $('#school').append(opt); }); } }); } else { $('#school').empty(); $('#school').hide(); } }); </script> <style> form input { width: 180px; height: 30px; } </style> </head> <body><div class='container'><form action="http://localhost:9080/survey/index.php/home/register" method="post" accept-charset="utf-8"><h3>Регистрация:</h3><br/><table border = '0' ><tr><td> Потребителско име:* </td><td><input type="text" name="username" value="" class="" /></td></tr><tr><td> Парола:* </td><td><input type="password" name="password" value="" class="" /></td></tr><tr><td> Повтори парола:* </td><td><input type="password" name="password2" value="" class="" /></td></tr><tr><td> Име:* </td><td><input type="text" name="first_name" value="" class="" /></td></tr><tr><td> Фамилия:* </td><td><input type="text" name="last_name" value="" class="" /></td></tr><tr><td> Населено място:* </td><td><input type="text" name="location" value="" class="" /></td></tr><tr><td> Имейл:* </td><td><input type="text" name="email" value="" class="" /></td></tr><tr><td> Изберете роля:* </td><td><input type="radio" name="role_id[]" value="1" onclick="showhide(this, true)" /> Ученик <input type="radio" name="role_id[]" value="2" onclick="showhide(this, true)" /> Учител <input type="radio" name="role_id[]" value="5" onclick="showhide(this, false)" /> Координатор </td></tr><tr><td> Регион:* </td><td><select name = 'region[]' id='region' ><option value= 'Враца '>Враца</option><option value= 'София '>София</option></select></td></tr><tr><td> Училище:* </td><td><select name = 'school[]' id='school'><option value= 'ПМГ "Акад. Иван Ценов" '>ПМГ "Акад. Иван Ценов"</option><option value= 'СОУ "Христо Ботев" '>СОУ "Христо Ботев"</option><option value= 'ЕГ '>ЕГ</option><option value= 'ПМГ '>ПМГ</option></select></td></tr><tr ><td> Клас:* </td><td><select name="class[]"> <option value="8">8</option> <option value="9">9</option> <option value="class"></option> </select></td></tr></table><br/><input type="submit" name="" value="Регистрация" class="btn btn-success " id="reg" /></form></div></body></html>
Comments
Post a Comment