Issue on size for <p:autoComplete>

Forum rules
Please note that response time for technical support is within 3-5 business days.
j2system
Posts: 7
Joined: 27 Feb 2015, 16:04

27 Sep 2017, 19:22

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>

mert.sincan
Posts: 5281
Joined: 29 Jun 2013, 12:38

02 Oct 2017, 09:07

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

j2system
Posts: 7
Joined: 27 Feb 2015, 16:04

03 Oct 2017, 16:23

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.

mert.sincan
Posts: 5281
Joined: 29 Jun 2013, 12:38

05 Oct 2017, 08:45

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>

j2system
Posts: 7
Joined: 27 Feb 2015, 16:04

09 Oct 2017, 14:28

Worked! Thanks!

mert.sincan
Posts: 5281
Joined: 29 Jun 2013, 12:38

10 Oct 2017, 14:16

Glad to hear, thanks a lot for the update!

zeljko47
Posts: 4
Joined: 14 Feb 2018, 15:55

14 Feb 2018, 16:02

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

mert.sincan
Posts: 5281
Joined: 29 Jun 2013, 12:38

20 Feb 2018, 14:29

Ok, I'll check it and get back to you.

zeljko47
Posts: 4
Joined: 14 Feb 2018, 15:55

08 Mar 2018, 11:02

Hello,

Have you found something already?

Thank you for a small feedback...

mert.sincan
Posts: 5281
Joined: 29 Jun 2013, 12:38

08 Mar 2018, 13:23

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>

Post Reply

Return to “Barcelona - PrimeFaces”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 2 guests