Error when using required inputs in Primefaces

Asked

Viewed 464 times

4

I have some inputs from Primefaces inside a Wizard, showing only one of them:

<p:inputText id="inputTitulo" value="#{editalBean.edital.titulo}" required="true"
            requiredMessage="Informe um título" label="titulo" />

It happens if I don’t fill this Input, when I click on the next of the Wizard it appears the message accusing the error, but when I type again, it’s like the letters turn white, I type, the letters are there, but they’re the same color as the background of the input, then it seems that the same is blank, but it fills normal.

In short, it’s like I’m writing with the white letter in inputText with white background.

Element inspection:

https://www.diffchecker.com/4qmxuze1

I put the difference of two inspections, when there has not been validation, and after validation. The theme I am using is bootstrap. Almost sure it is a thing of the theme, because I changed the color of the text and it worked.

Now here’s the question, how to change the color of the text in the css of the theme?

java jsf primefaces

  • I believe it’s a CSS problem, can inspect the element and check which CSS rules are being applied to the input?

  • I’ll check it out here @Wakim

  • I added @Wakim, look at the difference ai of the texts. And in the state-error in the second text, the text is white. How to swap in the css of the first faces?

  • I think there’s some mistake in the rule that you saw the difference, you should stick to the red background, make a rule .ui-state-error { background-color: #cd0a0a; } in your CSS. For some reason that rule is in trouble. No Warning appears in the dev console?

  • But what about my css? I changed the rule in the browser itself. How do I add this rule in the css of first faces msm?

  • Placing in the CSS of the first faces is not possible because it is inside the jar. You need to create a CSS file and import into your page, to overwrite the background-color property that is in trouble.

  • Hmmm, so it’ll just overwrite the only attribute. Okay, I’ll look up how it does that.

Show 2 more comments

1 answer

3

It seems to me that you’re just having a CSS problem. If you don’t want to create an external CSS file, you can do this within your own page:

<style>
    .input-color{
        color: #000000 !important;
    }
</style>

There in the input you make:

<p:inputText styleClass="input-color" ... />

If you don’t want to create a class just to change the color of the text, you can use the style option of the inputText component and put "color: #000000 ! Important;"

Browser other questions tagged java jsf primefaces

You are not signed in. Login or sign up in order to post.