Page 1 of 2

Issue on size for <p:autoComplete>

Posted: 27 Sep 2017, 19:22
by j2system
Hi.

I'm using an <p:autoComplete> component inside a md-inputfield. The effect of the placeholder is working, but the size of the component doesn't.
It's always getting the same size (2 columns), regardless of how many columns I put into the component.

Code: Select all

<div class="ui-grid-col-5">
           <h:panelGroup styleClass="md-inputfield">
                   <p:autoComplete id="acCity" value="#{empMB.city}" completeMethod="#{cityMB.complete}"
                                           forceSelection="false" queryDelay="1" style="width: 100%;" maxResults="10""/>
                   <label>City</label>
            </h:panelGroup>
</div>

Re: Issue on size for <p:autoComplete>

Posted: 02 Oct 2017, 09:07
by mert.sincan
Could you please attach a sample xhtml and screenshot for us to replicate? Also, I think you can use classes of GridCss instead of ui-grid-col-*; https://www.primefaces.org/showcase/ui/panel/grid.xhtml

Re: Issue on size for <p:autoComplete>

Posted: 03 Oct 2017, 16:23
by j2system
XHTML: https://www.dropbox.com/s/kwxomjba22zk9 ... xhtml?dl=0
Screenshot: https://www.dropbox.com/s/gksbp3yxn9anc ... e.png?dl=0

Even with GridCss, the problem remains. I'm used 12 columns, but the component still occupies only 2.

Re: Issue on size for <p:autoComplete>

Posted: 05 Oct 2017, 08:45
by mert.sincan
Please try;

Code: Select all

<div class="card card-w-title shadow-box ui-shadow-5">
    <div class="ui-g">
        <div class="ui-g-12">
            <h:panelGroup styleClass="md-inputfield">
                <p:autoComplete id="acCity" value="#{empMB.city}" inputStyle="width: 100%; box-sizing: border-box;" completeMethod="#{cityMB.complete}"
                                forceSelection="false" queryDelay="1" maxResults="10" style="width:100%; box-sizing: border-box;"/>
                <label>City</label>
            </h:panelGroup>
        </div>
    </div>
</div>

Re: Issue on size for <p:autoComplete>

Posted: 09 Oct 2017, 14:28
by j2system
Worked! Thanks!

Re: Issue on size for <p:autoComplete>

Posted: 10 Oct 2017, 14:16
by mert.sincan
Glad to hear, thanks a lot for the update!

Re: Issue on size for <p:autoComplete>

Posted: 14 Feb 2018, 16:02
by zeljko47
Hello,

Your solution above works very well when autocomplete is multiple="false", but not with multiple="true". In that case the style and inputStyle-Attributes don't work.

Do you have a solution for autocompletes with multiple="true"?

Thank you in advance,
Zeljko

Re: Issue on size for <p:autoComplete>

Posted: 20 Feb 2018, 14:29
by mert.sincan
Ok, I'll check it and get back to you.

Re: Issue on size for <p:autoComplete>

Posted: 08 Mar 2018, 11:02
by zeljko47
Hello,

Have you found something already?

Thank you for a small feedback...

Re: Issue on size for <p:autoComplete>

Posted: 08 Mar 2018, 13:23
by mert.sincan
Please try;

Code: Select all

<div class="card card-w-title shadow-box ui-shadow-5">
    <div class="ui-g">
        <div class="ui-g-12">
            <h:panelGroup styleClass="md-inputfield ui-fluid">
                <p:autoComplete id="acCity" value="#{autoCompleteView.theme1}" multiple="true" inputStyle="width: 100%; box-sizing: border-box;" completeMethod="#{autoCompleteView.completeTheme}"
                                forceSelection="false" queryDelay="1" maxResults="10" style="width:100%; box-sizing: border-box;"/>
                <label>City</label>
            </h:panelGroup>
        </div>
    </div>
</div>