Question

我正在使用JQuery UI 1.12.1和Bootstrap v3.3.7。我有一个popover表单，它是对话框的一部分，除了用户无法在弹出窗体中输入文本外，一切都正常。如果我在“主页”上而不是在对话框中移动弹出窗体，则输入正常。

这是变成popover的div：

<div class="hide" id="owner-popover">
    <div id="owner-search-popover">
        <div class="row">
            <form class="form-inline" id="owner-search" name="owner-search">
                <label class="sr-only" for="ownerFirstNameSearch">First Name</label> 
                <input class="form-control mb-2 mr-sm-2 mb-sm-0" name="FirstName" placeholder="First Name" type="text"> 
                <label class="sr-only" for="ownerLastNameSearch">Last Name</label> 
                <input class="form-control mb-2 mr-sm-2 mb-sm-0" name="LastName" placeholder="Last Name" type="text"> 
                <button class="btn btn-primary" type="submit">Search</button>
            </form>
        </div>
        <div class="row">
            <table class="table table-condensed" id="owner-search-results">
                <thead>
                    <tr>
                        <th>Name</th>
                        <th>Address</th>
                        <th></th>
                    </tr>
                </thead>
                <tbody></tbody>
            </table>
            <div class="row owner-search-paginate"></div>
        </div>
        <div class="row">
            <button class="col-xs-10 col-xs-offset-1 btn btn-primary bottomaligned" id="add-owner">Add Owner</button>
        </div>
    </div>
</div>

请参阅我在jsfiddle的代码：

https://jsfiddle.net/surm2jkj/

如何启用除文本以外的弹出框输入？

Answer 1

我可以通过将对话框的模态选项更改为false来实现此功能。

$("#add-element-dialog").dialog({
  autoOpen: false, 
  modal: false,
  height: 510,
  width: 650,
  resizable: false,
  buttons: {
    //OK: function() {$(this).dialog("close");}
  },
});

https://jsfiddle.net/surm2jkj/1/

我仍然想知道如何在不将模态选项设置为false的情况下完成此操作。

Jquery对话框中的Bootstrap Popover表单

1 个答案: