Question

我有一个模态，最初是通过一个按钮启动的。 Inside是一个带有选择下拉列表的表单，具体取决于选择选项，模式必须使用db中的另一个选择框进行更新。这是模态。根据“Make”，div“Models”通过jQuery .html()加载。 Hoewever，我无法将动态select框“模型”加载到模态中。html()无效，有什么建议吗？

 <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 class="modal-title">New Car Request</h4>
      </div>
      <div class="modal-body">
        <form role="form">
          <div class="form-group">
           <select class="form-control">
             <?php foreach($years as $year) { ?>
                 <option value="<?=$year["Year"]?>"><?=$year["Year"]?></option>
             <?php } ?>
           </select>
          </div>
          <div class="form-group">
           <select class="form-control" id="vehicle-make">
             <?php foreach($makes as $make) { ?>
                 <option value="<?=$make["Make"]?>"><?=$make["Make"]?></option>
             <?php } ?>
           </select>
          </div>
          <div class="form-group">
            <div id="models"></div>
          </div>
          <button type="submit" class="btn btn-default">Submit</button>
        </form>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>
    </div><!-- /.modal-content -->


<script>
    $(document).ready(function() {
        var myModal = $('.modal').modal();

        $("#vehicle-make").on("change", function(e) {
            var make = $(this).val();
            e.preventDefault();
            $.post("/ajax.php", { make: make, method: "get_model_by_make" }, function(data) {
                if(data.success) {
                    $(myModal + " #models").html(data.models);
                }
            }, "json");
        });
    });
</script>

如何向Bootstrap模式添加动态内容

0 个答案: