如何设置动态下拉列表的选定值

时间:2015-04-28 08:10:14

标签: jquery codeigniter radio selected

首先,我有3个单选按钮,可以从其中一个中选择。

接下来,当您选择时,您具有相关的动态下拉列表。

我希望当用户提交表单时,存在验证错误,单选按钮的选定值以及要显示的下拉列表,而不是再次选择它们。

首先,我必须为名为'role_id'的单选按钮执行此操作。我曾试图为地区做这件事,但我不确定如何做到这一点。

编辑:我用它收音机(ckeck我的编辑代码)。但是对于我来说下拉很难,因为我是jQuery的新手。你可以帮帮我吗?提前致谢! :)

我正在使用CodeIgniter。我的观点是:

          $(document).ready(function(){
              $(":radio").click(function(){
                  $('#region').val('Choose region');
                  $('#school').val('Choose region');
                  $('#teacher').val('Choose school');
                  $('#class').val('Choose class');
                  $('#class_divisions').val('Choose division');
              });
          });
         

  

        $(document).ready(function(){
           if($('#radio1').is(':checked') || $('#radio2').is(':checked'))  {

            var dropDown = document.getElementById("region");
            var region = dropDown.options[dropDown.selectedIndex].value;

             $('.toggle').show();
             }
          });

         function showHide(self, show){

                  $(".all_teachers_show, .toggle, .school,  .teacher_school, .teacher, .class, .teacher_class").hide();
         
                  if (show)
                      $('.toggle').show();
                  else
                      $('.toggle').hide();
                  $(":radio").prop('checked',false);
                  $(self).prop('checked',true);
              }
              
              function show(yes, no){
                  if (no)
                      $('.school').show();
                  else
                      $('.school').hide();
                  $("region").prop('checked',false);
                  $(yes).prop('checked',true);
              }
          

  

          $(document).ready(function() {
                    $('#region').change(function() {
                        var url = "<?= base_url() ?>index.php/home/get_schools";
                        var postdata = {region: $('#region').val()};
                        $.post(url, postdata, function(result) {
                            var $school_sel = $('#school');
                            $school_sel.empty();
                            $school_sel.append("<option>Choose region</option>");
                            var schools_obj = JSON.parse(result);
                            $.each(schools_obj, function(key, val) {
                                var option = '<option  value="' + val.school_id + '" >' + val.school_name + '</option>';
                                $school_sel.append(option);
                            });
                        });
                    });
                });
echo "<tr><td><label>  Choose role:* </label> </td><td>";
  $selected_role = $this->input->post('role_id'); ?>
  <input type="radio" name="role_id" id="radio1" onclick="showHide(this, true)" value="1" 
  <?php echo '1' ==  $selected_role ? 'checked="checked"' : 
      '' ?>/>
      <?php  echo " Ученик "; ?>
      <input type="radio" name="role_id" id="radio2" onclick="showHide(this, true)" value="2" 
  <?php echo '2' ==  $selected_role ? 'checked="checked"' : 
      '' ?>/>
       
      <input type="radio" name="role_id" id="radio5" onclick="teachers_show(this, true)" value="5" 
  <?php echo '5' ==  $selected_role ? 'checked="checked"' : 
      '' ?>/>
  
  
  echo "</td></tr>";
  echo "<tr class='toggle' style='display:none;' ><td><label>  Region*  </label></td><td>";
 
 $selected_region = $this->input->post('region');  ?>
  <select name='region' id='region' onClick='show(this, true)'>
      <?php foreach ($regions as $row) { ?>
        <option name='region' value="<?= $row->region ?>" 
        <?php  echo $row->region ==  $selected_region ? 'selected="selected"' : ''
        ?>>
        <?= $row->region ?></option>
      <?php   } ?>
  </select> 

  
 <?php

  echo "</td></tr>";

  echo "<tr class='school' style='display:none;' ><td><label> School:*  
  </label></td><td>";  
    $selected_school = $this->input->post('school[]');  ?>
<select id="school" name="school[]" class='school' onChange='school_show(this, true)'>
 <option value="" <?php  echo "" ==  $selected_school ? 'selected="selected"' : ''
        ?>>Choose region</option>
  </select>

  
  <?php echo "</td></tr>";

$(document).ready(function(){
$(function(){
    $(document).on('change', '.school', function(e) {
          alert(this.options[e.target.selectedIndex].text);
    
      $( "#school" ).this.options[e.target.selectedIndex].text;
     
});
  $('.school').show();      
});
});

1 个答案:

答案 0 :(得分:0)

要获取要重新填充的表单字段,可以使用表单库功能 https://ellislab.com/codeigniter/user-guide/libraries/form_validation.html#repopulatingform

<?php echo validation_errors(); ?>
<?php echo form_open('form'); ?>
 <h5>Username</h5>
 <input type="text" name="username" value="<?php echo set_value('username'); ?>" />
 <input type="submit" value="Submit" />
</form>

set_value()将以此形式重新填充用户在字段中输入的值(在本例中为名为“username”的字段)

至于检索自动生成的下拉列表,我尝试使用$ _POST ['region']值再次重现相同的下拉列表。

例如在伪代码中

if ($_POST array exists) {      
   if ($_POST['region'] has a value) {
     // eg. a region has been previously selected
     retrieve this dropdown using the region parameter 
   }
}