【问题标题】:MySQL table populating one dropsown. Upon selection, A second dropdown is populatedMySQL 表填充一个下拉列表。选择时,填充第二个下拉列表
【发布时间】:2017-04-06 04:02:52
【问题描述】:

好的,所以我检查了网络和这里的其他问题,我很难过。我已经从这里发布的问题中尝试了一个 javascript 解决方案,但我认为它不喜欢 MySQL 填充<option>s。我将复制我拥有的所有代码,包括我拥有的 javascript。

脚本:

<script>
  $(function() {
    $('#groups').on('change', function() {
      var val = $(this).val();
      var sub = $('#sub_groups');
      $('option', sub).filter(function() {
        if (
          $(this).attr('data-group') === val || $(this).attr('data-group') === 'SHOW'
        ) {
          $(this).show();
        } else {
          $(this).hide();
        }
      });
    });
    $('#groups').trigger('change');
  });
</script>

PHP 第一个下拉菜单:

<select class="form-control" id="groups">
  <?php
        $sql = "SELECT BoilerBrand FROM boilerbrands";
        $result = mysql_query($sql);
        while ($row = mysql_fetch_array($result)) {
          echo "<option value='".$row['ID']."'>".$row['BoilerBrand']."</option>";
        }
        ?>
</select>

PHP 第二个下拉菜单

<select class="form-control" id="sub_groups">
  <option data-group='SHOW' value="0">Model</option>
  <?php
     $sql = "SELECT * FROM boilermodels";
     $result = mysql_query($sql);
     while ($row = mysql_fetch_array($result)) {
      echo "<option data-group='".$row['BoilerBrand']."' value='".$row['BoilerGC']."'>".$row['BoilerModel']."</option>";
     }
     ?>
</select>

对此的任何帮助将不胜感激!

谢谢:)

【问题讨论】:

  • boilerbrandsboilermodels 表是什么样的? PK 和 FK 说明?
  • 所以boilerbrands 是:PK:ID(int)和字段BoilerBrand(varchar 255)。 boilermodels 是 PK:ModelID (int)、字段 BoilerBrand (varchar 255)、字段 BoilerModel (varchar 255)、字段 BoilerGC (varchar 9) 和字段 BoilerImage (varchar 255)。希望这是有道理的!
  • 例如:boilerbrand 表:ID - BoilerBrand 1 - Alpha boilermodels 表:ModelID - BoilerBrand - BoilerModel - @9876543443@ - @9876 @1 - 1 - 240E - 47-777-77 - 47-777-77.jpg
  • 那么您遇到的实际问题是什么?你永远不会去说明问题所在。

标签: javascript php jquery mysql forms


【解决方案1】:

我通常这样做的方式不是隐藏/显示我删除/添加它们的选项。我相信如果你隐藏options 那么select 输入仍然可以具有该值。

脚本:

<script>
    $(function(){
        <?php
        $sql = "SELECT * FROM boilermodels";
        $result = mysql_query($sql);
        $models = array();
        while ($row = mysql_fetch_array($result)) {
            $models[$row['BoilerBrand']][] = $row;
        }
        /* should look like
        $models = [];
        $models[1][] = ['ModelID'=>'1','BoilerBrand'=>'1','BoilerModel'=>'240E','BoilerGC'=>'47-777-77','BoilerImage'=>'47-777-77.jpg' ];
        $models[1][] = ['ModelID'=>'3','BoilerBrand'=>'1','BoilerModel'=>'290D','BoilerGC'=>'11-111-11','BoilerImage'=>'11-111-11.jpg' ];
        $models[2][]= ['ModelID'=>'2','BoilerBrand'=>'2','BoilerModel'=>'250E','BoilerGC'=>'47-777-77','BoilerImage'=>'47-777-77.jpg' ];
        */
        ?>
        var _boilermodels = '<?php echo json_encode($models); ?>';
        var jsonBoilerModels = JSON.parse(_boilermodels);
        console.log(jsonBoilerModels);

        $('#groups').on('change', function(){
            var $this = $(this);
            var val = $this.val();
            var sub = $('#sub_groups');
            sub.find('option').remove();
            var appendList = [];

            $.each(jsonBoilerModels[val],function(key,value){
                appendList.push('<option value="'.concat(value['BoilerGC'], '">', value['BoilerModel'], '</option>'));
            });

            sub.append(appendList);
        });

        $('#groups').trigger('change');
    });
</script>

第一个下拉菜单:

<select class="form-control" id="groups">
    <?php
        $sql = "SELECT ID ,BoilerBrand FROM boilerbrands";
        $result = mysql_query($sql);
        while ($row = mysql_fetch_array($result)) {
            echo "<option value='".$row['ID']."'>".$row['BoilerBrand']."</option>";
        }
    ?>
</select>

第二个下拉菜单:

<select class="form-control" id="sub_groups">
    <option value="">Select A Model</option>
</select>

【讨论】:

  • 您先生,真是个天才!谢谢你,工作就像一个魅力:)
猜你喜欢
  • 1970-01-01
  • 2012-01-04
  • 1970-01-01
  • 2017-12-17
  • 1970-01-01
  • 1970-01-01
  • 2018-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多