一旦选择了一个项目，UI选择下拉列表打开在其他字段后面

问题描述：

我正在使用ui-select在angularjs应用程序中重复表中的每一行（ng-repeat）。这是我的ui-select的代码。一旦选择了一个项目，UI选择下拉列表打开在其他字段后面

<ui-select name="{{'selProperty' + $index}}" ng-model="thing.property" 
theme="bootstrap" ng-required="true"> 
    <ui-select-match placeholder="PLACEHOLDER TEXT"> 
     {{$select.selected.displayName}} 
    </ui-select-match> 
    <ui-select-choices repeat="property in data.properties | filter: $select.search"> 
     {{property.displayName}} 
    </ui-select-choices> 
</ui-select>

我有我的$ scope.data对象上的事情的清单，以及含表使用ng-repeat="thing in data.things"。表中的每一行都是用户填写的字段，用于设置事物的属性。下拉菜单允许用户指定事物的对象属性。

一切工作正常第一次使用。我得到属性列表，我可以输入部分搜索来过滤列表。我选择一个，检查一下，看看它的属性是否设置正确。问题是，当我在选择一个值后重新打开下拉列表时，整个列表出现在表的其他行上的其他UI选择框后面。我在一个不重复的页面上试了一遍，它也出现在<input type="text"></input>框中。

我试着调整Z指数为荒谬的数字没有运气。在选择一个值并进行比较之前和之后，我复制了源HTML，但没有任何区别。我真的不明白为什么我的列表显示在页面上的其他输入元素后面。

你能提供一个小片段来说明这个问题吗？提供的HTML不是很有帮助，谢谢！ –

我试过做一个调度器，但我无法让它工作。如果我今天下午有时间，我会再试一次。抱歉。 – jvance

@jvance，下面的解决方案适合您吗？如果是，请标记为已接受。 –

答

请检查下面的问题GitHub的链接：

https://github.com/angular-ui/ui-select/issues/308

的解决方案是增加以下CSS，看看它是否适合你。

.ui-select-choices { 
    position: fixed; 
    top: auto; 
    left: auto; 
    width: inherit; 
    }

谢谢@Vijay Menon，但是这个解决方案对我来说不起作用，但问题与我的不一样。上面的问题涉及下拉列表被切断时，它是在另一个div与某些溢出设置。我的下拉菜单首次显示用户选择的内容;但是，如果他们随后要更改其选择，则会在其上方或下方显示其他输入元素后面的下拉菜单。 – jvance

然后我们需要看到一些代码来进一步帮助@jvance。请创建一个小提琴/ plunker。 –

一旦选择了一个项目，UI选择下拉列表打开在其他字段后面

相关推荐