icefaces - использовать автозаполнение в диалоге

Я использую автозаполнение в диалоге. Проблема в том, что автозаполнение не отображается должным образом. Изображение будет описывать его лучше всего, так это выглядит так:

Как видите, автозаполнение отображается не полностью, а справа появляется полоса прокрутки. Чего я хочу достичь, так это того, что автозаполнение будет полностью видимым без полосы прокрутки. Вот чего я хочу добиться:

Это пример кода (исходный код приложения слишком сложен, поэтому я создал демонстрационное приложение, которое работает таким же образом):

index.xhtml

<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:ice="http://www.icesoft.com/icefaces/component"
    xmlns:ace="http://www.icefaces.org/icefaces/components"
    xmlns:iscecore="http://www.icefaces.org/icefaces/core">
<h:head>
    <title>Insert title here</title>
    <ice:outputStyle href="./xmlhttp/css/xp/xp.css" rel="stylesheet"
        type="text/css" />
</h:head>
<h:body>
    <h:commandButton id="show" value="Show Dialog" onclick="sampleDialog.show();"/>
    <ace:dialog id="dialogId" header="Dialog example"
        widgetVar="sampleDialog" draggable="true" modal="true">
        <h:outputText value="dialog content"></h:outputText>
        <h:form id="autoCompleteForm">
            <ace:dialog id="dialogId" header="Dialog example"
                widgetVar="sampleDialog" draggable="true" modal="true">
                <h:outputText value="dialog content"></h:outputText>
            </ace:dialog>
            <ace:autoCompleteEntry id="componentId" rows="10" width="150"
                value="#{autoCompleteEntryBean.selectedText}"
                filterMatchMode="startsWith" label="Select city:">
                <f:selectItems value="#{autoCompleteEntryBean.cities}" />
            </ace:autoCompleteEntry>
        </h:form>
    </ace:dialog>
</h:body>
</html>

AutoCompleteEntryBean.java

package icefacesAutocompleteProblem;

import java.util.ArrayList;
import java.util.List;

import javax.annotation.PostConstruct;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;
import javax.faces.model.SelectItem;

@ManagedBean
@ViewScoped
public class AutoCompleteEntryBean {

    private String selectedText;
    private List<SelectItem> cities;

    @PostConstruct
    public void init() {
        cities = new ArrayList<SelectItem>();
        cities.add(new SelectItem("Warsaw"));
        cities.add(new SelectItem("Warsaw1"));
        cities.add(new SelectItem("Warsaw2"));
        cities.add(new SelectItem("Warsaw3"));
        cities.add(new SelectItem("Warsaw4"));
        cities.add(new SelectItem("Warsaw5"));
        cities.add(new SelectItem("Warsaw6"));
        cities.add(new SelectItem("Warsaw7"));
        cities.add(new SelectItem("Warsaw8"));
        cities.add(new SelectItem("Warsaw9"));
        cities.add(new SelectItem("Warsaw10"));
        cities.add(new SelectItem("Warsaw11"));
        cities.add(new SelectItem("Warsaw12"));
    }

    public String getSelectedText() {
        return selectedText;
    }

    public void setSelectedText(String selectedText) {
        this.selectedText = selectedText;
    }

    public List<SelectItem> getCities() {
        return cities;
    }

}

1 ответ

Решение

Проблема решена настройкой overflow: visible; для ace: диалоговое окно и его содержимое (div[id$='_main']).

Другие вопросы по тегам