Bootstrap Modal

Question

我在Bootstrap模式中有一个文本框;在这里你可以看到一个输出示例：

黄色部分不是原始响应的一部分;我的添加显示文本框有一个默认尺寸，而且这个尺寸与模态尺寸不一致。

我的目的是用文本框填充黄色部分;换句话说，我认为文本框大小与模态大小一致。问题是：有没有办法执行此操作？ 我在模态中添加，文本框不是表单部分的一部分，您可以在代码中看到：

<div id="myModal2" class="modal fade" role="dialog">
                        <div class="modal-dialog">
                        <div class="modal-content">
                              <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal">&times;</button>
                                <h4 class="modal-title">Editing Menu</h4>
                              </div>
                              <div class="modal-body">
                              <textarea id='areaforinfo' readonly></textarea>
                              <form id="updateeventsform2" class="form-horizontal">
                              <div class="form-group">
                                <label  class="col-sm-2 control-label"
                                          for="inputNotes">Notes</label>
                                <div class="col-sm-10">
                                    <input type="text" class="form-control" 
                                    id="newnote" name ="newnote" placeholder="Put here the note"/>
                                </div>
                              </div>
                              <div class="form-group">
                                <label for = "type" class = "col-sm-2 control-label">Status</label>
                             <div class = "col-sm-10">
                            <select class = "form-control" id = "newstatus" name="newstatus">
                            <option value="open">open</option>
                                <option value="closed">closed</option>
                            </select>
                         </div>
                              </div>
                             </form>
                            </div>
                              </div>
                              <div class="modal-footer">
                              <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                              <button type="submit" class="btn btn-primary" data-dismiss="modal">Save</button>
                              </div>
                            </div>
                          </div>

我应该将文本框代码放在表单部分吗？

Answer 1

好的，我自己解决了。我只是将文本框放在表单中并添加class属性;最终结果是：

<div class="modal-body">
                              <form id="updateeventsform2" class="form-horizontal">
                              <div class="form-group">
                              <textarea class = "form-control" id='areaforinfo' style="min-width: 100%" readonly></textarea>