当并行用户输入文本字段值更改下拉值时,应自动更改

时间:2018-11-05 12:25:25

标签: php codeigniter

当我单击下拉菜单时,我希望级联下拉菜单也更改另一个用户输入的文本值。我想在用户输入文本字段中显示另一个值。 我的桌子就是这样

我的表名是exercise_parent_type

id | perant_type_name | base_value
1      type1             10
2      type2             20
3      type3             30
4      type4             40
5      type5             50 

我想在用户输入文本字段中查看base_value 在下拉菜单中,我还想看到,请选择父类型名称值

public function get_exercise_type_base_value(){
        $this->db->select('exercise_parent_type.base_value,exercise_parent_type.id');
        $this->db->from('exercise_parent_type');
        $query = $this->db->get();
        foreach($query->result_array() as $row){
    $subcats[$row['id']][] = array("id" => $row['id'], "val" => $row['base_value']);
            }

        return $subcats;
      //  return $query->result_array();       
    }
     public function get_exercise_type(){
        $this->db->select('exercise_parent_type.*');
        $this->db->from('exercise_parent_type');
        $query = $this->db->get();
         $query->result_array();

         foreach($query->result_array() as $row){
    $categories[] = array("id" => $row['id'], "val" => $row['perant_type_name']);
  }
  return $categories;
    }

<?php
  $db = new mysqli('localhost','root','','godspeed');//set your database handler
  $query = "SELECT perant_type_name,id FROM dev_exercise_parent_type";
  $result = $db->query($query);

  while($row = $result->fetch_assoc()){
    $categories[] = array("id" => $row['id'], "val" => $row['perant_type_name']);
  }

  $query = "SELECT id, base_value FROM dev_exercise_parent_type";
  $result = $db->query($query);

      while($row = $result->fetch_assoc()){
        $subcats[$row['id']][] = array("id" => $row['id'], "val" => $row['base_value']);
      }

  $jsonCats = json_encode($categories);
  $jsonSubCats = json_encode($subcats);
?>
<!docytpe html>
<html>

  <head>
    <script type='text/javascript'>
      <?php
        echo "var categories = $jsonCats; \n";
        echo "var subcats = $jsonSubCats; \n";
      ?>
      function loadCategories(){
        var select = document.getElementById("categoriesSelect");
        select.onchange = updateSubCats;
        for(var i = 0; i < categories.length; i++){
          select.options[i] = new Option(categories[i].val,categories[i].id);          
        }
      }
      function updateSubCats(){
        var catSelect = this;
        var catid = this.value;
        var subcatSelect = document.getElementById("subcatsSelect");
        subcatSelect.options.length = 0; //delete all options if any present
        for(var i = 0; i < subcats[catid].length; i++){
          subcatSelect.options[i] = new Option(subcats[catid][i].val,subcats[catid][i].id);
        }
      }
    </script>

  </head>

  <body onload='loadCategories()'>
    <select id='categoriesSelect'>
    </select>

    <input type="text" id="categoriesSelect" name="base_value" /> <!-- i want to see base_value in user input text field -->
    <!--select id='subcatsSelect'>
    </select-->
  </body>
</html>

1 个答案:

答案 0 :(得分:0)

您的问题更好。我想建议您点击此链接,您将获得一个最低限度的想法。这与HTML的select标签有关,下一个下拉列表根据第一个下拉列表进行更改。这包括儿童与父母之间的关系。 dependable dropdown