KendoUI 网格过滤器没有答案

【问题标题】：KendoUI Grid filter notKendoUI 网格过滤器没有
【发布时间】：2013-05-28 22:21:37
【问题描述】：

似乎 Kendo UI 网格在包裹在引导模式窗口中时确实可以正确过滤......

在 Chrome 和 Firefox 中，您甚至无法在过滤器文本框中输入内容。我已经删除了所有 CSS 类，但无济于事。在 IE 中，您至少可以输入，但是当您单击“过滤器”时，没有任何反应...

有什么想法吗？

这是我的 HTML...

 <div id="propertyPicker"
    class="modal large hide fade"
    tabindex="-1"
    role="dialog"
    aria-labelledby="propertyPickerLabel"
    aria-hidden="true">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
            <h3 id="propertyPickerLabel">Property Picker</h3>
        </div>

    <div class="modal-body">

         <div data-role="grid"
            data-sortable="true"                
            data-pageable="{                                
                            'info': true,
                            'pageSizes': [10,25,50],                                
                            }" 
            data-filterable="true"                                                   
            data-bind="source: collateralList"              
            data-columns="[
                            {field: 'Name', title: 'Property', filterable: { 'extra': false }},
                            {field: 'StreetAddress', title: 'Address', filterable: { 'extra': false }},
                            {field: 'City', title: 'City', filterable: { 'extra': false }},
                            {field: 'Acronym', title: 'State', filterable: { 'extra': false }},
                            {field: 'ZipCode', title: 'Zip', filterable: { 'extra': false }}
                          ]">


        </div>


    </div>

    <div class="modal-footer">
        <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
        <button class="btn btn-primary">Save</button>
    </div>

</div>

这是我的 javascript...

var viewModel = kendo.observable({ 
... 
collateralList: new kendo.data.DataSource({
            type: "odata",                
            transport: {
                read: {                        
                    url: "@Url.Content("~/Services/{SomeDataService}.svc/Collaterals?$select=ID,Name,StreetAddress,City,Acronym,ZipCode")"
                }
            },                
            pageSize: 10,
            serverPaging: true,
            serverSorting: true,  
            serverFiltering: true

        }),
 ...

【问题讨论】：

标签： twitter-bootstrap mvvm kendo-grid

【解决方案1】：

看起来这个答案可以帮助你。显然 Bootstrap 存在问题。

Twitter Bootstrap Modal Blocks Text Input Field

【讨论】：