javascript - 从下拉列表中获取数据，如果从下拉列表中选择了值，那么只有那个经常单击的按钮

Question

我在下拉菜单中有一个表单，它们从数据库中获取值。我有两个按钮，一个是提交按钮，第二个按钮是重复表单（添加更多数据）。

例如：如果假设选择值 6，则添加更多数据按钮 5 次单击

    <?Php
     require 'config-mysqli.php';
     $query2="SELECT DISTINCT cat_id, category, price FROM category order by cat_id"; 

     echo "<select name='cat' class='form-control' id='select_id'><option 
value=''>Select one</option>";
      if($stmt = $connection->query("$query2")){
      while ($row2 = $stmt->fetch_assoc()) {
      if($row2['price']==@$cat){echo "<option selected 
        value='$row2[price]'>$row2[category]</option>";}
      else{echo  "<option value='$row2[price]'>$row2[category] 
      </option>";}
     }
     }else{
      echo $connection->error;
      }
      echo "</select>";
       ?>

        <div class="input_wrap">
        <div class="row group"><br>

            <div class="form-group">
                <label class="control-label col-sm-4">Full Name</label>
                    <div class="col-sm-6">
                        <input type="text" name="user_name[]" class="form-control" required/>
                    </div>
                </div>                   
                </div>
                <div class="col-md-2">
                    <div class="form-group">
                        <button type="button" class="btn btn-danger btnRemove">Remove</button>
                    </div>
                </div>
            </div>
            </div>
        </div><br><br>

两个按钮

        <button type="submit" class="btn btn-success" 
           name="submit">Register</button>
        <button class="add_button btn btn-info" type="submit">Add More</button>

添加更多字段脚本

     <script>
      var wrapper = $(".input_wrap");
      var add_button = $(".add_field_button");

      $(add_button).click(function (e) {
      e.preventDefault();
      $(wrapper).after('<div><div class="row group"><br><div class="form-group"><label class="control-label col-sm-4">Full Name</label>  <div class="col-sm-6"><input type="text" name="user_name[]" class="form-control" required/></div></div><div class="col-md-2"><div class="form-group"><button type="button" class="btn btn-danger btnRemove">Remove</button></div>            </div></div></div>'); //add input box
       });

      $(document).on("click",".remove_field",function(){
      $(this).parent().remove();
      });
      </script>

例如：如果假设选择值 6，则添加更多数据按钮 5 次单击

不要点击更多时间

我为上面的代码应用了一些逻辑，但它不起作用：

<script type="text/javascript">
$(document).ready(function(){
    var maxField = parseInt($("#select_id"))-1;
    var addButton = $('.add_button'); //Add button selector
    var wrapper = $('.field_wrapper'); //Input field wrapper
    var fieldHTML = '<div><div class="row group"><br><div class="form-group"><label class="control-label col-sm-4">Full Name</label>  <div class="col-sm-6"><input type="text" name="user_name[]" class="form-control" required/></div></div><div class="col-md-2"><div class="form-group"><button type="button" class="btn btn-danger btnRemove">Remove</button></div>            </div></div></div>'; //New input field html 
    var x = 1; 
    $(addButton).click(function(){
        //Check maximum number of input fields
        if(x < maxField){ 
            x++; //Increment field counter
            $(wrapper).append(fieldHTML); //Add field html
        }
    });

    //Once remove button is clicked
    $(wrapper).on('click', '.remove_button', function(e){
        e.preventDefault();
        $(this).parent('div').remove(); //Remove field html
        x--; //Decrement field counter
    });
});
</script>

标签： javascriptphpjquerydropdown